Casetă lightbox în joomla

În acest articol ne vom concentra pe lightbox; tehnici folosind ferestre modale în Joomla.

Cred că ai văzut spectaculos fereastră pop-up cu o imagine după un clic pe imagine puțin previzualizare. Aceste ferestre pop-up pe un fundal întunecat, de umplere a ecranului, și sunt ferestre modale. Pe Internet, ferestre modale sunt utilizate pentru a afișa imagini sau conținut web în detaliu.

Crearea de ferestre modale în Joomla

Aș dori să vă atrag atenția la următoarele. Cu toate previzualizări clare, ele sunt mici, deci fișierul de greutate este scăzută. Cel mai important, asigurați-vă că să se ocupe de imaginea originală, realizând greutate minimă cu calitatea fișierului salvat. În caz contrar, din cauza de descărcare lung fișiere mari, riscați să pierdeți vizitatorii care se plictisesc de așteptare până când imaginea se va deschide și el va părăsi site-ul. Dimensiunea imaginii originale nu ar trebui să fie făcut mai mult de 800 x 600 pixeli (având în vedere vechea valoare de afișare a monitorului). Imaginile originale, de asemenea, pot procesa on-line, dar dacă aveți posibilitatea și capacitatea, cel mai bine să o faci singur.

Și astfel, de exemplu, am creat două fișiere de dimensiuni diferite 120x90 și 800x600 pixeli - pic120.jpg și pic800.jpg și încărcate în dosarul corespunzător (sau folder) pe site-ul.

Așa cum am menționat mai devreme, în Joomla, există caracteristici avansate pentru conținut Web scoate (foto, materiale, etc.) Într-o fereastră separată - JHTML :: _ ( „behavior.modal“). Prin urmare, pentru a se asigura că site-ul a câștigat lightbox, pur și simplu introducerea fișierul index.php în tag-uri și șablon următorul cod:

Acum vom putea afișa conținutul nostru web în ferestre modale.

caseta modală în Joomla pentru o imagine

Pentru a afișa fotografiile într-o fereastră modal, vom construi o clasă de modal și un link la imaginea originală

caseta modală în Joomla pentru conținut

Pentru a afișa în materialul lightbox, subliniem, de asemenea, modal de clasă, un link către pagina, și dimensiunea ferestrei modal

Apoi, la link-ul pe care doriți să se deschidă într-o fereastră modal, adăugați codul:

articole similare