Joomla.it Forum
Joomla! 3 => I Template di Joomla! 3 => : X-mac 13 Mar 2013, 21:44:59
-
Ciao, vorrei sapere nel template Protostar come fare a sostitituire il colore BIANCO dello sfondo del template con un altro colore da me scelto.
Grazie a tutti per l'aiuto
-
Cambi a tuo piacere a riga 6088 del template.css questa regola:
.body .container {
background-color: #FFFFFF;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 4px 4px 4px 4px;
box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
padding: 20px;
}Ma non è lo sfondo del sito ma del contenitore dei contenuti ;)
-
Grazie 1000 provo subito
-
Ciao a tutti,
nel template in questione sto tentando d'inserire un'immagine di sfondo, senza alcun successo.
Sapete indicarmi la retta via? :)
Grazie fin d'ora
-
scarichi jquery backstretch e lo copi nella cartella del template /js/jquery.backstretch.js, se non c'è creala
tra gli header metti questo:
$doc->addScript('templates/'.$this->template.'/js/jquery.backstretch.js');
appena dopo l'apertura del tag body:
<body class="site <?php echo $option
. ' view-' . $view
. ($layout ? ' layout-' . $layout : ' no-layout')
. ($task ? ' task-' . $task : ' no-task')
. ($itemid ? ' itemid-' . $itemid : '')
. ($params->get('fluidContainer') ? ' fluid' : '');
-------------------------------------------------------------------------------------
<?php
$doc->addScriptDeclaration('
(function($) {
$(document).ready(function() {
$.backstretch(["templates/protostar/images/tua_immagine.jpg"]);
});
})(jQuery);
');
?>--------------------------------------------------------
prima di qs:
<!-- Body -->
<div class="body">
-
Molte, molte grazie MWC,
come di consueto i tuoi post mi sono di prezioso aiuto, ho visto che con jquery.backstretch.js posso anche mettere diversi sfondi in dissolvenza il che non guasta :)
Ringrazio te e tutti i membri del forum che consentono anche alle capre come me :) di imparare sempre cose nuove.
-
se non dovesse funzionare, così come ogni altro script jquery che si aggiunge, è quasi sempre un problema di Jquery caricato da joomla, o non aggiornato o non corretto perchè vers ui o troppo aggiornato.
Mentre nel b/end diventa un casino, nel f/end spesso conviene proprio caricare un JQuery a parte escludendo quello joomla
-
Nel mio caso funziona perfettamente, in quanto al caricamento di jquery in Joomla conosco poco, comunque ho visto che a tale scopo esistono svariati plugin i quali facilitano tale operazioni e che dovrebbero contemplare il noconflict.
Per quanto riguarda b/end e f/end non ho capito quanto da te esposto, ovviamente la mia incomprensione è data dalla scarsissima conoscenza come detto in precedenza :) :'( .
-
se funziona, bene così!... anche nelle pagine interne o solo nella home?
cmq sarebbe bello per sfruttare al meglio il boostrap e il suo responsive, riuscire a "simulare" la dimensione della pagina con un div e l'immagine darla come sfondo a quello così da poter applicare lo stile hidden-phone che la nasconde alla visualizzazione mobile
-
Funziona in tutte le pagine, in merito al div per lo stile hidden-phone lo prendo in seria considerazione anche se visualizzandolo in emulazione IOS e Android lo sfondo non disturba in quanto è un colore unico con svariate sfumature, ovviamente se inserirò in definitiva uno sfondo con immagine, l'hide-phone sarà sicuramente opportuno.
-
Chiedo venia se riprendo questo topic.. ::)
Il cambio colore del fondo è ok se lo tengo statico come indicato da Toni .. ma pena lo rendo fluido torna bianco... :o ooo saltato qualche passaggio?
-
l'hai reso fluido quindi hai cambiato regola css per lo sfondo la quale non avrà dentro ciò che dice toni
prova a guardare ora come si chiama la classe che usi con firebug e modifichi lo sfondo in quella
-
Grazie ;) :)
;D dopo aver letto in un sto americano che non era possibile farlo :P (o perlomeno con il mio inglese maccheronico ho capito così) ma spulciando ci sono riuscito ...non solo la cornice interna ma anche quella esterna :
per la cornice esterna la troviamo alla riga 6618
body.site.fluid {
background-color: #0d5133;
mentre alla riga 517 il contenitore dei contenuti
container-fluid {
padding-right: 20px;
padding-left: 20px;
*zoom: 1;
ho aggiunto la riga "background-color: #0d5133;"
-
Un'altra informazione, per quanto riguarda il fluido... è possibile impostare una massima larghezza?
grazie
-
Certo. Devi impostare un max-width al contenitore principale...
-
Grazie Toni, mi puoi dire come, non sono un esperto :-\
Grazie
-
Ho usato jquery.backstretch ma questo mi adatta l'immagine inserita alla dimensione della finestra, quello che vorrei utilizzare io è il normale comportamento html per le immagini di sfondo ossia il riempimento tipo mattonella senza ridimensionamento. Con backstretch è possibile? oppure devo utilizzare altro?
-
Sto cercando di inserire l'immagine di sfondo al template protostar, come è stato suggerito qui.
Ho provato in svariati modi e non mi funziona! :-[
Era da tanto che non mi cimentavo con queste cose. ;D ;D
l'index.php, in joomla 3.4, ora è così:
<body class="site <?php echo $option
. ' view-' . $view
. ($layout ? ' layout-' . $layout : ' no-layout')
. ($task ? ' task-' . $task : ' no-task')
. ($itemid ? ' itemid-' . $itemid : '')
. ($params->get('fluidContainer') ? ' fluid' : '');
echo ($this->direction == 'rtl' ? ' rtl' : '');
?>">
<?php
$doc->addScriptDeclaration('
(function($) {
$(document).ready(function() {
$.backstretch(["templates/protostar/images/tua_immagine.jpg"]);
});
})(jQuery);
');
?>
<!-- Body -->
<div class="body">
<div class="container<?php echo ($params->get('fluidContainer') ? '-fluid' : ''); ?>">Sopra viene detto di inserire tra gli header questo codice:
$doc->addScript('templates/'.$this->template.'/js/jquery.backstretch.js');
L'header del mio index.php è questo:
<body class="site <?php echo $option
. ' view-' . $view
. ($layout ? ' layout-' . $layout : ' no-layout')
. ($task ? ' task-' . $task : ' no-task')
. ($itemid ? ' itemid-' . $itemid : '')
. ($params->get('fluidContainer') ? ' fluid' : '');
echo ($this->direction == 'rtl' ? ' rtl' : '');
?>">
<?php
$doc->addScriptDeclaration('
(function($) {
$(document).ready(function() {
$.backstretch(["templates/protostar/images/tua_immagine.jpg"]);
});
})(jQuery);
');
?>
<!-- Body -->
<div class="body">
<div class="container<?php echo ($params->get('fluidContainer') ? '-fluid' : ''); ?>">
<!-- Header -->
<header class="header" role="banner">
<div class="header-inner clearfix">
<a class="brand pull-left" href="<?php echo $this->baseurl; ?>/">
<?php echo $logo; ?>
<?php if ($this->params->get('sitedescription')) : ?>
<?php echo '<div class="site-description">' . htmlspecialchars($this->params->get('sitedescription')) . '</div>'; ?>
<?php endif; ?>
[/url]
<div class="header-search pull-right">
<jdoc:include type="modules" name="position-0" style="none" />
</div>
</div>
</header>
Scusatemi ma non riesco proprio a capire come inserire quel codice tra gli header. :-\
Sono riuscito, poi, a scaricare il plugin da qui:
https://github.com/srobbin/jquery-backstretch/zipball/master (https://github.com/srobbin/jquery-backstretch/zipball/master)
Vorrei sapere, di tutti quei files e cartelle, cosa dovrei copiare nella directory "/protostar/js"?
Ringrazio anticipatamente per le risposte che mi vorrete dare.
Saluti, Franco
-
Ciò che mi sta facendo dannare è questa parte:
scarichi jquery backstretch e lo copi nella cartella del template /js/jquery.backstretch.js, se non c'è creala
tra gli header metti questo:
$doc->addScript('templates/'.$this->template.'/js/jquery.backstretch.js');
Riguardo al primo punto nell'archivio .zip che ho scaricato ho trovato due file JScript: jquery.backstretch.min e jquery.backstretch
per non sbagliare li ho messi tutti e due nella cartella "js" del template.
Per il secondo punto, invece, non riesco a comprendere cosa significa "tra gli header metti questo"
L'header dell'index è questo:
<header class="header" role="banner">
<div class="header-inner clearfix">
<a class="brand pull-left" href="<?php echo $this->baseurl; ?>/">
<?php echo $logo; ?>
<?php if ($this->params->get('sitedescription')) : ?>
<?php echo '<div class="site-description">' . htmlspecialchars($this->params->get('sitedescription')) . '</div>'; ?>
<?php endif; ?>
</a>
<div class="header-search pull-right">
<jdoc:include type="modules" name="position-0" style="none" />
</div>
</div>
</header>
Possibile che non c'è nessuno in grado di darmi una dritta? ;D
Colgo l'occasione per inviare un saluto a tutti del forum.
FC
-
Mettilo alla fine dopo l'ultimo /div e prima della chiusura dell /header
-
Ciao tomtomeight,
grazie per avermi risposto.
A dire la verità, proprio in questo momento, sono riuscito a risolvere il problema in questo modo:
{
$doc->addScript('templates/'.$this->template.'/js/jquery.backstretch.js');
}
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>">
<head>Come potrai vedere, l'ho inserito con due parentesi graffe alla fine del codice php.
Poi, per il file JScript (quello giusto) era jquerybackstretch.js
Spero che questa dritta possa essere d'aiuto a qualcuno.
Saluti a tutti, Franco