Acest tutorial nu mai este valabil deoarece in blogurile de pe Blogspot functia de lightbox este disponibila si poate fi activata din meniul Settings -> Showcase images with Lightbox -> Yes.
Ziceam într-un post că e bine să faci experimente, că e bine să încerci unele extensii pentru blog, să intrii puţin în cod si să modifici una sau alta doar dar nu înainte de a-ţi salva în prealabil template-ul sau mai bine chiar să-ţi mai faci un blog de test.
Aş vrea să vă explic mai jos cum puteţi adăuga în blogul vostru Blogspot un plugin prin care puteţi să măriţi o imagine mai mică (thumbnail) atunci când daţi click pe ea. Plugin-ul este luat de pe site-ul Dynamicdrive.com, un site unde puteţi găsi mai multe plugin-uri pentru site-uri în general, nu exclusiv pentru Blogspot sau Wordpress.
Rezultatul tutorialului de mai jos va fi acesta (click pe imagine):
Pentru a putea folosi acest plugin trebuie să utilizăm cinci fişiere externe, trei imagini, un fişier CSS şi un alt fişier JS (JavaScript). Ceea ce am făcut eu a fost să optimizez aceste fişiere şi să le pun pe contul personal de Dropbox (am pus link-ul de referral pentru a câştiga 250MB spaţiu la fiecare nou utilizator ce se înscrie pe acest site - dacă aveţi de gând să vă înscrieţi ), un serviciu care-ţi oferă 2GB de spaţiu gratis şi unde puteţi sicroniza orice fişier pe care-l aveţi.
Deci, să revenim la ce trebuie să facem pentru a utiliza acest plugin. Intraţi în Tabloul de bord a sit-ului draft.blogger.com şi apăsaţi pe Design apoi Editaţi HTML. Daţi un CTRL+F şi căutaţi tag-ul
Ce mai aveţi de făcut e să aplicaţi tag-ul de mai jos de fiecare dată când puneţi o imagine pe site astfel:
Codul obligatoriu e:
Cam asta! Sper să reuşiţi să integraţi acest plugin în site-ul vostru!
Dacă nu înţelegeţi ce am scris puteţi citi acest tutorial de pe site-ul original.
Ziceam într-un post că e bine să faci experimente, că e bine să încerci unele extensii pentru blog, să intrii puţin în cod si să modifici una sau alta doar dar nu înainte de a-ţi salva în prealabil template-ul sau mai bine chiar să-ţi mai faci un blog de test.
Aş vrea să vă explic mai jos cum puteţi adăuga în blogul vostru Blogspot un plugin prin care puteţi să măriţi o imagine mai mică (thumbnail) atunci când daţi click pe ea. Plugin-ul este luat de pe site-ul Dynamicdrive.com, un site unde puteţi găsi mai multe plugin-uri pentru site-uri în general, nu exclusiv pentru Blogspot sau Wordpress.
Rezultatul tutorialului de mai jos va fi acesta (click pe imagine):
Pentru a putea folosi acest plugin trebuie să utilizăm cinci fişiere externe, trei imagini, un fişier CSS şi un alt fişier JS (JavaScript). Ceea ce am făcut eu a fost să optimizez aceste fişiere şi să le pun pe contul personal de Dropbox (am pus link-ul de referral pentru a câştiga 250MB spaţiu la fiecare nou utilizator ce se înscrie pe acest site - dacă aveţi de gând să vă înscrieţi ), un serviciu care-ţi oferă 2GB de spaţiu gratis şi unde puteţi sicroniza orice fişier pe care-l aveţi.
Deci, să revenim la ce trebuie să facem pentru a utiliza acest plugin. Intraţi în Tabloul de bord a sit-ului draft.blogger.com şi apăsaţi pe Design apoi Editaţi HTML. Daţi un CTRL+F şi căutaţi tag-ul
</head>
<link href='http://dl.dropbox.com/u/1518616/Plugins/lightbox/lightbox.css' media='screen' rel='stylesheet' type='text/css'/>
<script src='http://dl.dropbox.com/u/1518616/Plugins/lightbox/lightbox.js' type='text/javascript'/>
Ce mai aveţi de făcut e să aplicaţi tag-ul de mai jos de fiecare dată când puneţi o imagine pe site astfel:
<a href="http://site.com/imagine.jpg" rel="lightbox" ><img src="http://site.com/imagine_thumb.jpg" /></a>
Codul obligatoriu e:
rel="lightbox"
Cam asta! Sper să reuşiţi să integraţi acest plugin în site-ul vostru!
Dacă nu înţelegeţi ce am scris puteţi citi acest tutorial de pe site-ul original.