Instalace
Na této stránce se dozvíte, jak nasadit Ligon Reader do vašich stránek. Toto nasazení je velice jednoduché, ale doporučuji mít alespoň základní povědomí o věcech jako je HTML, jQuery, apod..
Nasazení
Pokud není součástí vašeho webu knihovna jQuery, přidejte do vaši stránek (mezi tagy <head> a </head>) následující kód pro její načtení:
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
Přidejte následující kód do vašich stránek, mezi tagy <head> a </head>. Dbejte na to, aby předchozí knihovna jQuery byla načtena jako první:
<script type="text/javascript" src="http://www.ligon.cz/reader/js/latest.js"></script>
Vytvořte odkazy, které budou mít parametr data-ligon-isbn, jehož hodnota bude platné ISBN 13 pro knihu, pro kterou chcete ukázky zobrazit:
<!-- Hodnotu 978-80-7462-539-8 vyměňte za ISBN 13 požadované knihy --> <a href="#" data-ligon-isbn="978-80-7462-539-8" class="ligon-button">Prolistovat knihu</a>
Nasaďte Ligon na vytvořené odkazy pomocí jQuery:
<script type="text/javascript"> $(document).ready(function() { $('a[data-ligon-isbn]').ligon(); }); </script>
Pokud se kniha nachází v databázi Ligon, tak se zobrazí aktivní tlačítko:
Prolistovat knihuPokud kniha v databázi není, zůstává tlačítko neaktivní:
Prolistovat knihuPřizpůsobení
Elementem pro tlačítko nemusí být tag A, ale jakýkoliv tag, který chcete, například BUTTON. Musíte k tomu samozřejmě upravit i selektor v jQuery:
<button data-ligon-isbn="978-80-7462-539-8">Ukázka</button> <script type="text/javascript"> $(document).ready(function() { $('button[data-ligon-isbn]').ligon(); }); </script>
Můžete si nastavit CSS podle svých představ, například měnit barvu textu:
.moje-tlacitko { color: red; } /* Třída active se automaticky přidá HTML elementu, pokud je kniha nalezena v DB Ligonu. */ .moje-tlacitko.active { color: green; }
Pokud si například přejete, aby tlačítko (tag A) nebylo vidět, pokud není kniha v databázi, můžete nastavit classy takto:
a.ligon-button { display: none; } a.ligon-button.active { display: inline; }
Když to nefunguje
Nasazení databáze Ligon je velice jednoduché, pokud by se ale přesto objevil problém, zkuste následující tipy:
- Zkontrolujte, jestli máte správně načtené knihovny jQuery a Ligon.
- Zkontrolujte správné pořadí při načítání knihoven. Nejprve jQuery, pak Ligon.
- Zkontrolujte, jestli není na stránce JavaScriptová chyba. Běžné webové prohlížeče mají debugger na JavaScript, který lze většinou spustit klávesou F12.
- Zkontrolujte správnou definici tlačítka. Musí se jednat o HTML tag, který musí mít parametr data-ligon-isbn, jehož hodnota musí být platné ISBN 13.
- Zkontrolujte správnost selektoru v jQuery.
- Pokud je tlačítko stále neaktivní, ujistěte se na těchto stránkách, že je kniha v databázi Ligon.
- Pokud se snažíte přepsat CSS třídy a.ligon-button a/nebo a.ligon-button.active, ujistěte se, že vaše definice je až po načtení knihovny Ligon.