TEMPLATE PROTOSTAR
http://www.piccoliwebmaster.com/template-protostar/aggiungere-nuove-posizioni.html
Aggiungere nuove posizioni
Per inserire una nuova posizione bisogna modificare l'index.php del template. Qui ho aggiunto una posizione per avere la possibilità di pubblicare un modulo HTML personalizzato in cui inserire le icone e i link ai Social media.
E qui una posizione per la slide sotto al top menù.
La prima posizione si inserisce così:
150 <div class="icone_social">
151 <jdoc:include type="modules" name="position-icone" style="none" />
152 </div>
Appena sotto la riga 149 <!-- Header -->
e questo il css da inserire nelpersonal.css:
.icone_social {
float: right;
margin-top: -10px;
}
La seconda così:
168 169 170 171 172 |
<?php if ($this->countModules('slide')) : ?> <div class="slide"> <jdoc:include type="modules" name="position-slide" style="none" /> </div> <?php endif; ?> |
appena dopo la position-1
163 164 165 166 167 |
<?php if ($this->countModules('position-1')) : ?> <nav class="navigation" role="navigation"> <jdoc:include type="modules" name="position-1" style="none" /> </nav> <?php endif; ?> |
e questo il css da inserire per modificare padding, margin o altro
Quindi si può scegliere uno dei tanti moduli slide tra le estensioni di Joomla!®. Qui è pubblicato questo modulo:Responsive Photo Gallery, modificato con il css:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
.es-carousel-wrapper, .rg-view, #buttons { display:none !important; } .rg-image-wrapper { -moz-border-radius: 0px !important; -webkit-border-radius: 0px!important; border-radius: 0px!important; box-shadow: 0 3px 12px #000000!important; margin-bottom: 15px!important; min-height: 0!important; padding: 0!important; position: relative!important; } |
Per inserire il modulo nella nuova posizione occorre scriverne il nome nella tendina delle posizioni, oppure si può inserirla nel file templateDetails.xml del template in questo modo:
27 28 29 30 31 |
<positions> <position>position-icone</position> <position>position-slide</position> </positions> |