Codici, aiuto pratico

« Older   Newer »
  Share  
yursnake
view post Posted on 12/5/2009, 20:41




Un semplice aiuto con i codici che spesso ci fanno impazzire :bang:

COLORI - i colori sono scritti in lingua inglese (blue, red, purple, green)

in tag chat: se per caso volete inserire un messaggio colorato, come sostenete il forum
CODICE
[color=...][/color]


in un post
: SPOILER ALERT
CODICE
[color=...][/color]


nel titolo/sottotitolo di un post: trattasi di moda
CODICE
<font color=...></font>


DIMENSIONE

le dimensioni sono in numeri fino a 14.

da 1 a 3 è piccolo: ciao <-- dimensione tre ed è quella standard della scrittura.

da 4 a 7 è medio: ciao <--- dimensione 6

da 8 a 14 è grande: ciao <--- dimensione 10

in tag chat: non è possibile dare una dimensione è sempre standard

in un post: CIAO
CODICE
[size=...][/size]


in un titolo/sottotitolo: Ligabue
CODICE
<font size=...></font>


Grassetto, corsivo, sottolineato

in tag chat: io credo che sia giusto così
CODICE
[b][i][u]...[/b][/i][/u]


in un post: io credo che sia giusto così
CODICE
[b][i][u]...[/b][/i][/u]


in un titolo/sottotitolo: io credo che sia giusto così
CODICE
<b><i><u>...</b></i></u>


********
Se per esempio volete postare un'immagine di dimensioni molto grandi e linkarla o un'immagine che richiami ad un altro link

in tag chat: sarebbe inutile ma comunque ve lo dico
CODICE
[URL=link dell'immagine nelle dimensioni reali/link del forum-blog][IMG]link dell'immagine rimpicciolita[/IMG][/URL]


in un post:
CODICE
[URL=link dell'immagine nelle dimensioni reali/link del forum-blog][IMG]link dell'immagine rimpicciolita[/IMG][/URL]


oppure

CODICE
<a href="LINK FORUM O IMMAGINE GRANDE"><img src="LINK IMMAGINE PICCOLA"></a>




Fonte preziosissima: (forum con tutti i codici che possono essere utili per firme o forum stessi)QUI

Per creare l'effetto Accendi / Spegni al passaggio del mouse sopra le targhette, bisogna inserire il seguente codice in Amministrazione>Modifica colori e stili>In fondo a tutto il codice

CODICE
.web a:link img, .web a:visited img {filter:alpha(opacity=30); -moz-opacity: 0.5; opacity: 0.5}
.web a:hover img {filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0}


Ecco vari tipi di collegamenti:
Collegamento esterno
CODICE
<a href="http://indirizzo_sito">testo</a>


Collegamento esterno con immagine
CODICE
<a href="http://indirizzo_sito"><img src="http://indirizzo_immagine"></a>


Collegamento a messaggio
CODICE
<a name="target"></a> - <a href="#target">testo</a>


Ecco i più frequenti codici di formattazione (Ovviamente escludendo i codici pronti nel modulo di scrittura):
Scrittura carattere non-standard
CODICE
<font size="3" face="nomefont">testo</font>


Centrare
CODICE
<div align="center">immagine/testo</div>


Movimento
CODICE
<marquee direction="up" scrollAmount=1 height="30" width="70%">immagine/testo</marquee>



Movimento bloccato al passaggio del mouse

CODICE
<marquee onmouseover="this.stop()" onmouseout="this.start()">immagine/testo</marquee>



Movimento rallentato al passaggio del mouse

CODICE
<marquee scrollamount='5' onMouseover='this.scrollAmount=1' onMouseout='this.scrollAmount=5'>immagine/testo</marquee>


Testo sbarrato (testo)
CODICE
<s>testo</s>


Testo con alone (Solo per IE)
CODICE
<div style="width:100%;filter:glow(color=colore)">testo</div>


Testo sfumato
CODICE
<div style="width:100%;filter:blur">testo</div>


Apice
CODICE
<sup>...</sup>


<pedice
CODICE
<sub>...</sub>


Affiancare immagine al testo
immagine a sinistra e testo a destra
CODICE
<div style="float: left; margin-right: 4px">Immagine</div> Testo

immagine a destra e testo a sinistra
CODICE
<div style="float: right; margin-left: 4px">Immagine</div> Testo


Ecco come creare una lista personalizzata:
CODICE
<ul type="[color=green]disc[/color]">
<li>voce</li>
<li>voce</li>
<li>voce</li>
</ul>

# Dove disc può essere sostituito da circle o square a seconda dell'effetto che si vuole ottenere.

Per fare menù a tendina, basta utilizzare il seguente codice:
CODICE
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>


Per creare invece un pulsante, utilizzare il seguente codice:
CODICE
<button>testo</button>


Per inserire una scollbar, ecco il codice:

CODICE
<div style="overflow:auto; height:60px">testo<br><br><br><br><br><br></div>

Dove "br" simbolegga l'accapo. Per avere la scrollbar orizzontale sostituire height con width.

Per inserire una showcase nella tabella del vostro forum, bisogna inserire questi codici rispettivamente in Amministrazione>Gestione codice HTML>in cima al forum e nella cella della tabella dove volete appaia la showcase:
In cima al forum
CODICE
<style type="text/css">

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 9;
}

.thumbnail span{
position: absolute;
background-color: #xxx;
padding: 5px;
left: -1000px;
border: xxxpx dashed #xxx;
visibility: hidden;
color: #xxx;
}

.thumbnail span img{
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{
visibility: visible;
top: 0;
left: xxxpx;

}

</style>

Al posto di #xxx dovete inserire il codice del colore che deve apparire nel parametro settato, quindi quello del testo per color, quello dello sfondo per backgorund-color e quello del bordo per border.
Al posto di xxxpx dovete inserire la dimensione in pixel del parametro settato, quindi la larghezza del bordo per border, e la posizione di spostamento dell'immagine grande rispetto a quella piccola per left (che puô tranquillamente essere sostituito con right se la volete a destra).
Il bordo può inoltre essere normale (solid), tratteggiato (dashed), a puntini (dotted) o con qualsiasi altro settaggio normale dei bordi.

Nella cella della vostra tabella, dove volete appaia lo showcase, inserite questo:
CODICE
<a class="thumbnail" href="link a cui deve portare l'anteprima se cliccata; si può anche togliere, eliminando il parametro href"><img src="link dell'immagine di anteprima" border="0">
<span><img src="link dell'immagine"> </span></a>


Il codice map viene utilizzato per dividere un'immagine in più aree che portano a link differenti. Ecco il codice:
HTML
<map name="titolomappa">
<area shape="rect" COORDS="0,0,20,10" href="link" TITLE="testo">
</map>
<img src="linkimmagine" usemap="#titolomappa" border=0 width=larghezza height=altezza>


Name: il titolo della mappa. Serve per richiamare la mappa da usare per l'immagine scelta (infatti si trova poi usemap="#titolomappa")
Shape: è la forma della mappa. Può essere rect (Rettangolo: le coordinate di riferiscono all'angolo in alto a destra e in basso a sinistra cioè 4 numeri), circle (Cerchio: le coordinate si riferiscono al centro e al raggio, quindi 3 numeri) e tante altre.
Href: il link di quell'area precisa.
Title: se si vuole dare un titolo a quell'area.

Per fare più aree nell'immagine basta ripetere il codice in questo modo:

HTML
<map name="titolomappa">
<area shape="rect" COORDS="0,0,20,10" href="link" TITLE="testo">
<area shape="rect" COORDS="10,20,30,40" href="link" TITLE="testo">
<area shape="rect" COORDS="50,60,70,80" href="link" TITLE="testo">
<area shape="rect" COORDS="90,100,110,120" href="link" TITLE="testo">
</map>
<img src="linkimmagine" usemap="#titolomappa" border=0 width=larghezza height=altezza>


Esempio:
SPOILER (click to view)
CODICE
<map name="mappa1">
<area shape="circle" COORDS="10,20,3" href="http://meravilandia.forumcommunity.net/" TITLE="Meravilandia">
<area shape="circle" COORDS="20,40,4" href="http://forumcommunity.net/" TITLE="Forumcommunity">
<area shape="rect" COORDS="50,60,70,80" href="http://forumfree.net/" TITLE="Forumfree">
<area shape="rect" COORDS="70,70,100,130" href="http://blogfree.net/" TITLE="Blogfree">
</map>
<img src="linkimmagine" usemap="#mappa1" border=0 width=140 height=100>


Per nascondere i nomi delle sottosezioni, inserire il seguente codice DOPO la descrizione della sezione in questione
CODICE
</span><p class="nascosta"><span>


Per inserire alla fine del Forum un testo nell'area delle statistiche, usare il codice in "In cima al Forum":
CODICE
<script type="text/javascript">stats='<br>Forum creato il <b>Data</b> da <a href="linkprofilo"><b>nomeutente</b></a>'</script>


Per inserire le ultime discussioni del forum (da inserire in cima al forum)
CODICE
<script type="text/javascript">

function NextBirthday(list){document.write(" <tr><td class="sunbar" colspan="2">TITOLO<tr><td class="ww" align="center"><img src='URL IMMAGINE A FIANCO'><td class="ww"><p class="kpinfo"> TESTO");
}
</script>


Sostituite quindi XXXXX con l'id del vostro forum e sostituite, se necessario, forumfree co forumcommunity.

Per inserire nel vostro forum delle icone on/off differenti per ogni sezione, inserite i seguenti codici dove indicato:

Amministrazione>Modifica Immagini>c_on e c_on_res
CODICE
<div class="C_ON"></div>


Amministrazione>Modifica Immagini>c_off e c_off_res
CODICE
<div class="C_OFF"></div>


Amministrazione>modifica colori e stili
CODICE
#fxxx .c_on {height: xxpx; width: xxpx; background-image: url(link del bottone on che volete appaia)}
#fxxx .c_off {height: xxpx; width: xxpx; background-image: url(link del bottone off che volete appaia)}

dove #fxxx va sostituito con l'id della sezione e xxpx con le dimensioni dell'immagine.
Per ricavare l'id della sezione, cliccateci con il tasto destro>proprietà>l'id sono i numeri presenti.
Ad esempio, la mia sezione ha questo indirizzo:
CODICE
http://meravilandia.forumcommunity.net/?f=921284

L'id è 921284, quindi nel codice, per sostituire on e off di questa sezione metterò #f921284.
#f non può mancare, perché è quello che fa capire al sistema che lì deve mettere quella data immagine. Senza il codice non funziona.
Per settare le dimensioni dell'immagine, semplicemente sostituite le due xx davanti a px con le dimensioni in pixel dell'immagine.
Se ad esempio usate un'immagine 50x50, metterete 50px.

# Questo va ripetuto per tutte le sezioni del forum.

Se avete dubbi circa questo ultimo post di codici, fate riferimento al link di provenienza e chiedete lì!
 
Top
ARESarg90
view post Posted on 10/1/2010, 02:47




Ciao, scusami ma non è che per caso hai il codice per creare una lista personalizzata automatica come quella di animeonline?

ps: per rispondermi quotami please, cosi mi arriva l'email di notifica.
 
Top
fdr77
view post Posted on 4/8/2010, 03:07




ciao utilissima questa guida complimenti
 
Top
maddybelpop
view post Posted on 24/4/2013, 20:30




Ciao,scusa la mia ignoranza...ma...i 2 link(on e off)quelli che vanno messi in Colori e Stili per avere un'icona diversa dall'altra per ogni sezione!Dove vanno?Ho capito in Colori e Stili...ma è pieno di html...puoi indicarmi dove?Grazie in aticipo...Maddy
 
Top
maddybelpop
view post Posted on 24/4/2013, 20:56




Niente...forse ce l'ho fatta!
 
Top
Moogukinos31
view post Posted on 20/4/2016, 09:59




Hack again?!
 
Top
5 replies since 12/5/2009, 20:41   7987 views
  Share