Joomla.it Forum
Joomla! 3 => I Template di Joomla! 3 => : giusebos 24 Oct 2020, 15:47:37
-
Ho l'esigenza di inserire dentro un template di mia realizzazione uno switch per il cambio immagine usata per background del body.
Non sono riuscito a trovare nessuna informazione in merito, i risultati pullulano di pagine che parlano su come cambiare il background, ma nessuna affronta l'implementazione di uno switch nelle opzioni del template.
Mi ricordo che in passato ho trovato qualche template con questa opzione, ma adesso non ricordo ne nome de dove reperirlo.
Qualcuno ha memoria di un template che utilizzi questo meccanismo in modo tale da replicarlo nel mio template?
Mi pare anche che esistono delle estensioni, ma vorrei evitare di installarne una per fare una cosa abbastanza semplice.
Grazie
-
Buongiorno.
Se non ho capito male, forse questo potrebbe esserti utile:
https://www.jquery-backstretch.com/ (https://www.jquery-backstretch.com/)
Nella sezione "demos" dal menu' a tendina seleziona "attach Backstretch to click event"
-
no purtroppo le info mancanti sono l'integrazione con joomla, a livello di codice non ho problemi
-
dopo molte moltissime ricerche sono riuscito a capire come fare per realizzare ciò che si vede nell'immagine allegata.
nel post sotto descrivo come ho risolto:
-
per prima cosa realizzo o modifico la regola per il body come nel codice seguente, ho inserito degli asterischi nelle dichiarazioni obbligatorie, mentre le altre varieranno in base al vostro template.
body {
font-family: 'Open Sans', sans-serif;
font-weight: 400;
line-height: 1.6;
font-size: 1rem;
color: #808080;
margin: 0px;
padding: 0px;
*background-repeat: no-repeat;
*background-size: cover;
* background-position: center;
*background-attachment: fixed;
}
Come seconda operazione dichiaro nel template che il body dovrà prelevare i valori dalle impostazioni del template scritte nel file templateDetails.xml.
per fare ciò apro il file index.php (attenzione per chi usa framework vari questa procedura potrebbe non funzionare)
queste le righe di codice da inserire dopo la chiusura dell'head e prima dell'apertura del body
</head>
<style type="text/css">
body {
background-color: <?php echo $this->params->get('body_color') ?>;
background-image: url('../<?php echo $this->params->get('body_background') ?>');
}
</style>
<body>
infine inserisco le seguenti istruzioni nel file templateDetails.xml , di seguito le ultime righe di codice dopo le ultime posizioni del mio template
<position>full_width_bottom</position>
<position>copyright</position>
</positions>
<config>
<fields name="params" addfieldpath="/templates/pomodoro/elements">
<fieldset name="body" type="upload_func" label="Body">
<field name="body_color" type="color" label="Colore background:" description="Example: #000000" default="#d10000"></field>
<field name="body_background" type="media" label="immagine background:">
</field>
</fieldset>
</fields>
</config>
</extension>
-
Con questo sistema ho realizzato un automatismo che sarà utile a chi non conosce una riga di codice e non ha sufficiente dimistichezza con css e connessioni FTP.
L'utente dopo aver realizzato un immagine potrà caricarla in una cartella preposta e questa diverrà l'immagine di background del sito.
Il sito dove verrà installato questo meccanismo ha l'esigenda di cambiare immagine molto spesso, inoltre per quelle volte che nessuna immagine verrà inserità, ho fatto in modo che sarà possibile assegnare un colore con un codice esadecimale prelevato da un color picker.