Come modificare SqueezeBox su Joomla!

September 7

Per le pagine Web che visualizzano solo una foto, l'integrazione è relativamente semplice e non rallenta la velocità di caricamento della pagina di troppo, nella maggior parte dei casi. Tuttavia, se si desidera creare una galleria fotografica o inviati molte immagini in una sola pagina, l'incorporamento fotografie a grandezza completa può rallentare il tempo di caricamento pagina considerevolmente. Collegamento immagini in miniatura di grandi foto popup risultati nel caricamento delle pagine più veloce e rende il sito più interattivo. Se si dispone di un Joomla! sito, è possibile utilizzare la funzione SqueezeBox built-in per creare modale o popup, finestre delle immagini per le gallerie. Tuttavia, è necessario modificare il codice nei file di template di base prima di poter creare i collegamenti popup sulle pagine di contenuti.

istruzione

Abilita SqueezeBox

1 Passare alla URL della pagina di log-in di amministrazione di back-end per il vostro Joomla! luogo. Accedi con il tuo username e password.

2 Clicca sul link "Estensioni" nella barra dei menu del pannello di controllo, poi "Template Manager." Dopo il caricamento della pagina Template Manager, fare clic sul nome della corrente Joomla! template (quello con la stella gialla accanto). Il "Template: [modifica]" pagina si apre nel browser. Fare clic sull'icona "Modifica HTML" nella parte superiore della pagina.

3 Fare clic sull'icona "Modifica HTML" nella parte superiore della pagina. Una volta visualizzata la pagina di modello HTML Editor, individuare la riga di codice che contiene la sintassi:

<Head> <jdoc: include type = "testa" />

4 Posizionare il cursore del mouse alla destra del simbolo ">" nel codice di linea, e poi premere "Invio".

5 Copiare e incollare il seguente codice nel modello HTML:

<Script type = "text / javascript" href = "<? Php echo $ this-> baseurl?

/media/system/css/modal.css "type =" text / css "/>

<Script type = "text / javascript">

// <! -

window.addEvent ( 'domready', function () {var = new JTooltips

Consigli ($$ ( 'hasTip.'), {MaxTitleChars: 50, fissati: 'false'}); });

// ->

</ Script>

<Script type = "text / javascript">

// <! -

window.addEvent ( 'domready', function () {

SqueezeBox.initialize ({});

$$ ( 'A.modal'). Each (function (EL) {

el.addEvent ( 'click', function (e) {

nuovo evento (e) .Stop ();

SqueezeBox.fromElement (EL);

});

});

});

// ->

</ Script>

6 Fai clic su "Salva" nella parte superiore della pagina.

Utilizzare lo script

7 Fai clic su "Articolo Manager" nel pannello di controllo. Aprire l'articolo per il quale si desidera incorporare i file di immagine.

8 Scorrere fino al punto nel vostro articolo in cui si desidera visualizzare un collegamento ad una grande pop-up foto. Utilizzare la seguente sintassi per collegare direttamente le immagini pop-up:

<a rel="SqueezeBox" href="URLofPhoto" title="MyCaption" class="modal">

9 Modificare la variabile "URLofPhoto" per l'URL della immagine caricata. Cambiare "MyCaption" a qualsiasi testo che si desidera sotto la foto nella finestra pop-up.

10 Salvare le modifiche al tuo Joomla! articolo. Quando si visualizza la pagina di articolo sul tuo sito, il link popup compare nel testo. Se si fa clic sul collegamento, l'immagine collegata si apre in una finestra modale.