RISOLTO sfondo con immagine joomla3

[trovaire]

premessa
buon giorno, sono trovaire e non so se questo post farà infuriare la communiti quindi chiedo scusa a priori.
è la prima volta che mi approccio a questo tipo di cose: siti e joomla e video e post. non ho capito molto ma sto provando di combinare qualcosa.
joomla 3
xampp
offline
template beez3


1 domanda
come faccio a mettere un immagine di sfondo alla pagina del sito?
considerazioni:
devo scrivere in html? non saprei dove e come iniziare...
in localhost...ecc.so cambiare colore allo sfondo, ma non mettere l'immagine.


2 domanda
il sito diventa pesante se metto un immagine di sfondo?
vi è un modo per avere un immagine di sfondo leggera da caricare?
considerazioni:
vorrei creare una pagina adatta alle classi elementari uno sfondo di un dipinto tipo foresta mi aiuterebbe ma non vorrei metterci troppo per il caricamento lato utente.


conclusioni
se ho sbagliato luogo o modo di chiedere o ho scritto troppo...scusate sto provando a fare del mio meglio




buoni auspici e grazie a tutti
trovaire






in questo link ci sta la soluzione
http://forum.joomla.it/index.php?topic=190271.new;topicseen#new

[giovi]

ciao trovaire, benvenuto sul forum!


Purtroppo per i template che non prevedono la possibilità di cambiare sfondo tramite le impostazioni del template stesso (gestione estensione->gestione template) è necessario agire sul codice, precisamente sul css. Le modalità di modifica non si discostano molto da quelle per la modifica del colore di sfondo.


La direttiva da applicare al tag body è

Codice: [Seleziona]

background-image("url-dell-immagine.jpg");

Lentezza nel caricamento? Dipende da molti fattori legati anche al server ma la pesantezza dell'immagine influisce molto se questa è eccessiva. In questo caso basta scegliere immagini leggere o complrimere quella che hai scelto

[trovaire]

grazie del benvenuto e grazzzissime della risposta...mando un saccodi faccine compiaciute e diverse, immaginale...per favore...




grazie per la risposta bella precisa e facile...ecco però...ho visto le istruzioni con ispeziona elemento in altri siti, questo tag body...


 dove lo trovo?
come lo trovo??




grazie anche per la risposta alla pesantezza dell'immagine, intendevo disegnarla io e scannerizzarla o fotografarla o disegnarla su pc con paint o coreldraw.....per renderla leggera c'è un formato piu utile di un altro tipo jpg o tif?


scusa se insisto con domande che richiedono risposte a voi scontate...cerco di imparare..




buoni auspici e grazzizzime ancora

[adottauncane]

Ciao trovaire,
usa Firebug per Firefox e ispeziona il template, lo sfondo in questo caso. Nella finestra di Firebug troverai il css corrispettivo, il file e la riga dove è scritto.
Aggiungi la riga scritta qui mettendo l'immagine nella cartella images del template. Il percorso sarà:

Codice: [Seleziona]

background-image: url("../images/sfondo.jpg");
Cerca un programma gratuito per la gestione dell'immagini come GIMP, se non ne hai già uno, fai un'immagine .jpg e ottimizzala per il web.

[trovaire]

scusa...non ho capito niente...colpa mia...non sono pratica


credo di aver inteso
scarico da internet un programma chiamato firefox, come quando ho scaricato xampp o joomla, dentro ci sta firebug che lo apro e lui mi chiederà quale prog guardare.... piu o meno sarà cosi... e cosi trovo la riga del tag body vicino a quella del background e cambio le parole li dentro con il nome della foto messa nella cartella immagini di htdocs di xammp...




mentre per scannerizzare il mio disegno e passarlo sempre nella cartella immagini lo passo prima nel programma scaricato gimp...




ora ho finito i kb di internet per cui mi collego domani in biblioteca e provo...poi ti so dire, se quello che ho scritto è sbagliato..perdonami me lo spieghi più...tipo contadinotto che va in città???


eh??? dai??? per favore??...grazie..
buoni auspici trovaire

[adottauncane]

Sì, più o meno.
Per la precisione:
Firefox è un browser e Firebug un add-ons (un robo che non installi sul PC ma direttamente in Firefox, non ti preoccupare clicchi e fanno tutto loro). Con Firefox vedi il tuo sito come lo vedi con un altro browser.
Poi ti guardi questi tutorial:
http://www.joomla.it/video-guide/3645-videotutorial-su-come-utilizzare-firebug-con-il-proprio-sito-joomla.html

Sì, per l'immagine. Fai così, trovati un sito qualunque il cui sfondo sia un'immagine, scarichi l'immagine, la apri con GIMP e vedi com'è fatta.

Per imparare non c'è che... copiare.

[trovaire]

sto facendo delle prove e scrivo quello che ho provato:


sono andata sul sito off line che sto creando, visuale sito utente, ho cliccato con il mouse dx ed esce una finestra a piu scelte, scelgo ispeziona elemento e mi apre una finestra con molte parole strane ...tipo linguaggio di programmazione


trovo la sezione body poi style poi body dentro ci scrivo quello che copio qui sotto sottolineato



            .logoheader {
               background:url('/joomla/') no-repeat right;
            }
            body {
               background:url('/joomla/images/foresta.jpeg') repeat;
            }
         
cosi circa, e quando guardo il sito off line per vedere i cambiamenti il sito developer mi cancella tutto e si rimette come prima, ma anche i colori delle scritte li mette giusti quando scrivo......uffa secondo me è giusto ....


ps1 la finestra in alto dove c'è il favicom si chiama developer tools

ps2 joomla è il nome della cartella di joomla in cui creo il sito...

[adottauncane]

Prova con quello che ho scritto io. Il tuo url non va bene. Non so se lo stai mettendo nel css giusto, ma il tuo css non è comunque corretto. L'immagine devi metterla nella cartella images del template.

[trovaire]

ok domani provo...la fretta è una cattiva consigliera e cercavo di soddisfare la mia curiosità con tentativi poco consapevoli...sorry e grazie della tua grande pazienza baci notte...

[trovaire]

in questi giorni sono imp per cui vado a rilento....quando risolvo o non trovo come utilizzare la vostra spiegazione...scrivo per ora grazie della pazienza comprensione e conoscenza di voi specialisti di joomla...


trovaire

[trovaire]

scaricato firefox
aperto il prog credo ho fatto clic sul mouse sinistro ed ha aperto un file di analisi che assomiglia a quello del video
trovato il programma
trovata la riga
copiato con i riferimenti
belisiimo ma non lo so salvare se no appena ricarico la pagina mi scompare...


come lo memorizzo

intanto grazie sto imparando un sacco.

[adottauncane]

Ovvio che scompaia, altrimenti chiunque potrebbe scombinarti il css...

Quando hai verificato con Firebug che la modifica è a posto, copi la riga, la modifica, quello che hai fatto e la riporti nel file corrispettivo (quale e in che riga lo scrive sempre Firebug) o scaricando il file originale via ftp, modificandolo e ricaricandolo o aprendolo da backend dalla gestione template.

[trovaire]

ok scompare...anche nel video c'è scritto che serve solo per sperimentare senza far danni....anche google da uan opzione simile ma firefox è mille volte melgio grandissima grazie

pultroppo e qui sorrido con candida innocenza non ho capito nullla dellle tue parole....

ok che firebug mi dice dove scrivere e cosa me lo hai detto tu....ma come faccioa scriverlo?

"scaricando il file originale via ftp, modificandolo e ricaricandolo o aprendolo da backend dalla gestione template."

queste parole sono troppo oltre per me...scussssssa
avresti modo di semplicifarle..?? grazie

trovaire...un mondo di affetto grazzie....

[adottauncane]

Sei in locale? Allora cerca semplicemente il file che dice Firebug nel cartella che probabilmente sarà css dentro la cartella del template. Per avere il percorso esatto delle cartelle che devi aprire, clicca sul file indicato da Firebug con il tasto destro.

Però le mie parole non sono difficili...  Solo, mi sembra di capire, non hai ancora le basi per orientarti. E diventa difficile spiegarti se non hai almeno quelle. Devi esporare un po' Joomla nel backend, cliccare sul nome del template, in alto a destra trovi Stile, ad esempio, se lo clicchi trovi tutti i file del template. puoi farlo da lì.

Ma devi comunque farti un po le ossa con le guide. Seguire quello che dicono, sperimentare un po', altrimenti è come parlare bergamasco con un napoletano... 

[trovaire]

ciao...grazie..ci provo....intanto metto un bel risolto...confido nella tua competenza e nella mia fortuna...va beh...diciamo tenacia....

si devo farmi le basi e ci sto provando...ho pensato a cose che dovevano essere facili secondo me...sto cercando di creare una pagina di creare uno sfondo...vedendone i vari aspetti..ma tutto quello che secondo me è facile diventa difficile....ragiono al contrario di sto programma...uffa...


cerco sempre in youtube i filmati per vedere passo dopo passo
leggo la guida ma è davvero non semplice...l'ha scritta qualcuno che ne sapeva tanto mi sa..


provo anche a cercare su google siti che parlano di joomla e html cosi da capire come funziona...


non avrebbe dovuto essere cosi complicato scegliere uno sfondo...in teoria piazzi una jpg invece di un colore...come potevo immaginare che era una cosa difficile..


ho pensato che era meglio questo piuttosto di partire dal capire i moduli..


eh...penso male che ci vuoi fare...


grazzie....


e lo so che le tue parole non sono difficili, lo sono per me....è diverso..




un abbraccio...

[trovaire]

mi collego a firefox
carico xamp
carico php administrator
carico localhost/sito/administrator
carico localhost/sito
tutto in locale
nella pagina del sito clicco con il dx esce ispeziona elemento...sto utilizzando firebug
la terza riga parla di body nella finestra in basso a sx (analisi pagina)
in basso a dxesce la parte di programma che mi interessa con il background il titolo del programma è
inline:47
sotto vi sono altri passaggi intitolati template.css: numeri di riga...
vado in localhost/sito/administrator
estensioni
gestione template
template (scelta fra stili e template centro alto sx)
clicco sul nome del template scelto da me
esce la pagina gestione template personalizza
con tre titolini:
editor          crea override          descrizione template
al momento sono su editor
in fianco alcuen cartelline azzurre chiare o scure ...da qui, posso scegliere il programma da modificare come mi ha suggerito firebug (in firebug posso fare le prove per vedere se le istruzioni funzionano oppure no...)

e il programmino inline non ci sta...non c'è ...davvero..

io supponevo fosse una parte differenziata del programma ma leggendo su internet non è cosi...cosa sbaglio?


css
tempalte.css

le righe dalla 15 alla 20 dicono cosi

video {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}


firebug mi fa fare la modifica in questo inline:47...


i ringraziamenti a tutti i tre che fino ad ora mi hanno indicato tutte ottime strade..sto imaprando dove concentrare lo sguardo....

buoni auspici trovaire

[tomtomeight]

Ciao

e il programminoinline noncista...non c'è ...davvero..

Non si tratta di un programma ma di una linea di codice css, una voltatrovato il file template.css devi editare la linea allo stesso modo che hai fatto con firebug.

[trovaire]

ci provo grazie....

[adottauncane]

inline:47

Non sapendo esattamente a quale template ti riferisci e a cosa, non saprei con sicurezza, ma questa inline secondo me significa che è un css in linea, magari del video che stai cercando di modificare, cioè se lo prende da qualcosa che hai inserito ma che è in un altro sito. Questi non li puoi modificare...

[trovaire]

il template è il protostar, quello di default ma uso una copia cosi non faccio danni


quello che mi scrive firebug sulla pagina lato utente sempre in locale è:


....................................... ............



elemento {
}
body.site {                                 inline:47
    border-top: 3px solid rgb(0, 136, 204);
    background-color: rgb(244, 246, 247);
}
body.site {                                  template.css.6922
    border-top: 3px solid rgb(0, 136, 204);
    padding: 20px;
    background-image: url("templates/foresta/images/foresta.jpg");
}
body {                                       template.css.189
    margin: 0px;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 13px;
    line-height: 18px;
    color: rgb(51, 51, 51);
    background-color: rgb(255, 255, 255);
}
....................................... ....................................... .....


quando sostituisco il codice che mi hai dato alla scritta in grassetto e sottolineata (utilizzando firebug nella vista sito utente) funziona lo sfondo cambia subito...


con calma ho cercato bene ed alla riga 6922 o 6925 c'è la stessa istruzione visualizzata come in line
ho provato la sostituzione e non funziona..




ma è tardi e domani provo meglio poi nel pomeriggio vi do i risultati...provo anche con beez...


grazie grazie grazie grazie