Autore: Rey
Descrizione: aggiunge i bordi allo stile che vuoi creare o modificare, partendo dallo stile prosilver.
Nota! Questo e solo un esempio le immagine dei bordi li potete creare come meglio credete.
Inizio guida:
file da editare
overall_footer.html
overall_header.html
stylesheet.css
file da includere
Carica borders.css in
styles/prosilver/theme/Carica le tre immagini bordo in
styles/prosilver/theme/images/Prima di tutto è necessario creare l'immagine che andremo ad inserire nello stile, apriamo Photoshop parto dal presupposto che lo avete già, cito questo perché è il più conosciuto, ma ci sono altri programmi per la grafica free come Gimp etc, apprestiamoci ad creare un nuovo documento e inserite queste dimensioni, larghezza 937px e altezza 300px trasparente, ora con lo strumento forma personale (U), dal menu a discesa, strumento rettangolo arrotondato, e tirate la linea fino in basso, ovviamente il colore lo scegliete voi, ecco i parametri da usare (vedi immagine), il raggio io ho messo 15px ma potete mettere come più vi aggrada, per rendere gli angoli più arrotondati.
Se avete fatto tutto bene vi dovete trovare un'immagine simile a questa:
Ora con lo strumento selezione rettangolare (M), io le taglio cosi ma si può fare anche in altri modi, tirate una linea orizzontale dall'alto fino ad una certa altezza, poi dal menu immagini cliccate su ritaglia, ecco quello che vi dovete trovare, (vedi immagine)
Bene ora dal menu file selezionate: (salva per web e dispositivi), salvate l'immagine con estensione gif in questo caso, ma l'estensione la scegliete voi per l'esigenza del momento, e rinominatela header-bg.gif, fate lo stesso passaggio con l'immagine sotto e quella centrale, salvatele sempre con gli stessi parametri, quella di sotto la rinominate footer-bg.gif, è quella centrale middle-bg.gif
Ecco le tre immagini che vi dovete ritrovare.
Ok la fase successiva sarà quella di editare i tre file citati sopra.
Apri: styles/prosilver/theme/stylesheet.css
trova:
Codice: Seleziona tutto
@import url("colours.css");Codice: Seleziona tutto
@import url("borders.css");trova:
Codice: Seleziona tutto
<body id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">Codice: Seleziona tutto
<div id="header-bg"></div>
<div id="wrap-bg">trova:
Codice: Seleziona tutto
</div>
</div>
</div>Codice: Seleziona tutto
</div>
<div id="footer-bg"></div>
E' VIETATA LA COPIA ANCHE PARZIALE DELLA GUIDA
Informazioni
