Grazie ai preziosi suggerimenti di
Dieda12 sono riuscito a risolvere il mio problema (per me ad uso esclusivamente didattico).
Volevo inserire una immagine di sfondo - ridimensionabile automaticamente - e che fosse "cliccabile" per richiamare una url, partendo dal template Protostar di default sulla 3.1.5
Questa la procedura seguita:
- Duplicazione del template (credo sia importante, essendo protostar un template di default, in caso di aggiornamenti si perderebbero le modifiche e poi é sempre meglio lavorare su una copia)
- Per inserire l'immagine di sfondo ho utilizzato il plugin jquery "jquery.backstretch.js", quindi dopo averlo scaricato ho eseguito alcune piccole modifiche:
riga 91, modificato z-index: -1000;
riga 103, modificato z-index: -1000;
dopo la riga 266, inserita nuova riga -- > self.$img.addClass('imgClk');
- Incluso il file js nella index del template all'interno del tag <head>
<?php $doc->addScript('templates/'.$this->template.'/js/jquery.backstretch.js'); ?>
- Inserito sempre nella index del template all'interno del tag <body>
<script type="text/javascript">
jQuery(document).ready(function() { jQuery.backstretch("path_della_immagine_di_sfondo");
});
jQuery(document).ready(function() {
jQuery('.imgClk').wrap('<a href="url_del_collegamento" target="_blank">[/url]');
});
</script>
- Modificato nel file css/template.css la seguente classe:
body.site {
position: relative;
z-index: -5000; border-top: 3px solid #0088cc;
padding: 20px
100px; background-color: #f4f6f7;
}
Spero di non essermi dimenticato nulla.
Ciao.
