°° Testo accapo
CODICE
[color=blue]<br>[/color]
°° Linea
°° Immagine
CODICE
<img src="http://indirizzo_immagine">
°° Testo con collegamento
CODICE
<a href="http://indirizzo_sito">testo</a>
°° Immagine con collegamento
CODICE
<a href="http://indirizzo_sito"><img src="http://indirizzo_immagine"></a>
°° Centrare un'immagine o un testo
CODICE
<div align="center">immagine/testo</div>
°° Immagine o testo che scorre
CODICE
<marquee direction="up" scrollAmount=1 height="30" width="70%">immagine/testo</marquee>
{
direction gestisce la direzione
scrollAmount indica la velocità
heigth indica l'altezza del campo di movimento
width indica la larghezza del campo di scorrimento }
°° Immagine o testo che scorre e si ferma al passaggio del mouse
CODICE
<marquee onmouseover="this.stop()" onmouseout="this.start()">immagine/testo</marquee>
°° Immagine o testo che scorre e rallenta al passaggio del mouse
CODICE
<marquee scrollamount='5' onMouseover='this.scrollAmount=1' onMouseout='this.scrollAmount=5'>immagine/testo</marquee>
°° Testo in grassetto
°° Testo in corsivo
°° Testo sottolineato
°° Testo barrato
°° Colore testo
CODICE
<font color="colore">testo</font>
°° Dimensione testo
CODICE
<font size="dimensione">testo</font>
°° Font testo
CODICE
<font face="font da utilizzare">testo</font>
°° Cambiare colore, font, dimensione ad un testo
CODICE
<font color="colore" size="dimensione" face="font da utilizzare">testo</font>
°° Testo con alone (visibile solo con explorer)
CODICE
<div style="width:100%;filter:glow(color=colore)">testo</div>
°° Testo sfumato (visibile solo con explorer)
CODICE
<div style="width:100%;filter:blur">testo</div>
°° Lista
CODICE
<ul type="disc">
<li>voce</li>
<li>voce</li>
<li>voce</li>
</ul>
Si può cambiare <i>disc</i> con <i>circle</i> o <i>square</i>
<ul type="disc">
<li>Disc</li>
<li>Attivato</li>
</ul>
<ul type="square">
<li>Square </li>
<li>Attivato</li>
</ul>
<ul type="circle">
<li>Circle </li>
<li>Attivato</li>
</ul>
°° Lista numerata
CODICE
<ol>
<li>voce</li>
<li>voce</li>
<li>voce</li>
</ol>
<ol>
<li>Punto</li>
<li>Punto</li>
<li>Punto</li>
</ol>
°° Area di testo
CODICE
<textarea>testo</textarea>
<textarea>area di testo</textarea>
°° Imput
CODICE
<input type="" value="testo">
<input checkbox ="" value="123"> checkbox
°° Menù a tendina
CODICE
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
Codice:
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
°° Pulsante con testo
CODICE
<button>testo</button>
°° Testo in alto
°° Testo in basso
°° Immagine che si ingrandisce al passaggio del mouse
Questo codice va copiato in fondo a "modifica colori e stili"
CODICE
.thumbnail {position: relative;
z-index: 0}
.thumbnail:hover {background-color: transparent;
z-index: 9}
.thumbnail span {/*CSS for enlarged image*/
position: absolute;
background-color: none;
padding: 5px;
left: -1000px;
border: none;
visibility: hidden;
color: black;
text-decoration: none}
.thumbnail span img {/*CSS for enlarged image*/
border-width: 0;
padding: 2px}
.thumbnail:hover span {/*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */}
Questo invece nella vostra tabella nello spazio in cui volete mettere l'img
CODICE
<a class="thumbnail" href=><img src="LINK IMMAGINE PICCOLA"><span><img src="LINK IMMAGINE GRANDE"></span></a>
E infine qui c'è la spiegazione di alcune parti del codice:
CODICE
.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: none;
padding: 5px;
left: -1000px;
border: none;
visibility: hidden;
color: black;
text-decoration: none;
°° Codici per l'audio
- Per impostare una musica di sottofondo
CODICE
<bgsound src="link audio">
- Per ripetere la musica all'infinito
CODICE
<bgsound src="link audio"loop="infinite">
- Per ripetere la musica con un numero prestabilito di volte
CODICE
<bgsound src="link audio"loop="2">
°° Blocco tasto destro
-In alcuni siti o forum, quando clicchi su qualcosa ti spunta la finestrella che ti impedisce di copiare un'immagine o altro. Bene se volete mettere nel vostro forum questo blocco basterà copiare il codice qui sotto in "Gestione codici html"---> Codici in fondo al forum
CODICE
<script type="text/javascript">
<!-- Start
function right(e) {
if (navigator.appName == 'Netscape' &&
(e.which == 3 || e.which == 2))
return false;
else if (navigator.appName == 'Microsoft Internet Explorer' &&
(event.button == 2 || event.button == 3)) {
alert("scrivi qui il tuo messaggio");
return false;
}
return true;
}
document.onmousedown=right;
if (document.layers) window.captureEvents(Event.MOUSEDOWN);
window.onmousedown=right;
// end -->
</script>
°° Targhette delle sezioni opache che si illuminano al passaggio del mouse
- Questo codice va inserito in "Modifica colori e stili" in fondo a tutti gli altri codici
CODICE
/* TARGHETTE OPACHE */
.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}
°° Menù a lista
- Copiate questo in "Modifica colori e stili" in qualsiasi punto vogliate (certo non in mezzo ad altri codici se no succede un pastrocchio
CODICE
.tab a:link, .tab a:visited {display:block; color: #hex; text-align: left; background: #hex; border-left: 10px solid #hex; padding: 1px; padding-left: 3px; margin-top: 1px}
.tab a:hover {display:block; background: #hex; border-right: 10px solid #hex; text-align: right; border-left: 10px #hex solid}
- E questo qui nella vostra tabella, nello spazio in cui desiderate inserire il menù
CODICE
<div class="tab">
<a href="http:link">Testo</a>
<a href="http:link">Testo</a>
<a href="http:link">Testo</a>
<a href="http:link">Testo</a>
<a href="http:link">Testo</a>
<a href="http:link">Testo</a>
</div>
°° Codice per nascondere le sottosezione del forum
CODICE
</span><p class="nascosta"><span>
°° Sfondo nella firma
CODICE
<div style="background-color: codice colore; display: block;">contenuto della firma</div>
- Se volete un'immagine al posto di un colore dovrete sostituire
CODICE
background-color: codice colore
- Con
CODICE
background-image: link immagine
°° Per scrivere un testo al lato di un'immagine
CODICE
<div style="float: left; padding-right: 4px">[IMG]http://linkimmagine[/IMG]</div>Testo Testo Testo
°° Per scrivere nella NewsBoard
CODICE
QUI INSERISCI LA DATA<a href="URL PROFILO"><b>QUI INSERISCI IL TUO NICK</b></a>:QUI INSERISCI IL TESTO<br>
°° Bottone per aggiungere il forum tra i preferiti
CODICE
<!-- Prelevato nel Forum di Supporto di ForumFree.net e ForumCommunity.net -->
<script type="text/javascript">
var url_del_tuo_forum="http://www.forumfree.net"
var nome_del_tuo_forum="ForumFree.net"
</script>
<script type="text/javascript">function addbookmark(){if (document.all)window.external.AddFavorite(url_del_tuo_forum,nome_del_tuo_forum)}</script>
<a href="javascript:addbookmark()">Aggiungi il forum ai preferiti</a>
°° Logo che cambia con l'aggiornamento della pagina
Per fare in modo che il logo cambi ogni volta che si aggiorna la pagina del forum bisogna inanzitutto creare diversi loghi (il numero dipende da quanti loghi diversi volete vengano visualizzati) e poi bisogna inserire questo codice in gestione HTML, in cima al forum
CODICE
<script type="text/javascript"><!--
var ran=new Array();
ran[0]='<img src="indirizzo_immagine">';
ran[1]='<img src="indirizzo_immagine">';
ran[2]='<img src="indirizzo_immagine">';
var id=Math.round(Math.random()*(ran.length-1)); document.write(ran[id]);
//--></script>
NB: non bisogna inserire nessuna immagine in modifica logo perchè se no verrà visualizzata l'immagine del logo e anche quella in cima al forum. Quindi da logo farà l'immagine in cima al forum.
°°Staff in tabella con immagini che si ingrandiscono e didascalie
Prima di tutto andate in gestione codici html e inserite in cima al forum questo codice
CODICE
<style type="text/css">
.thumbnail{
position: relative;
z-index: 0;
}
.thumbnail:hover{
background-color: transparent;
z-index: 50;
}
.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}
.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}
.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */
}
</style>
E poi inserite e compilate questo codice nello spazio in cui volete inserire lo staff
CODICE
<a class="thumbnail" href="#thumb"><img src="URL IMMAGINE PICCOLA DI ANTEPRIMA" width="100px" height="100px" border="0" /><span><img src="URL IMMAGINE GRANDE DA PASSAGGIO DEL MOUSE" /><br />DESCRIZIONE CHE VUOI METTERE</span></a>
Andate su:
-Amministrazione
-Gestione codici html
-In fondo al forum
-E inserite questo codice:
CODICE
<script type="text/javascript"><!--
moving=setTimeout('null',1);
function move(b){if(b<0&&parseInt(Menu.left)>-Width||b>0&&parseInt(Menu.left)<0)
{clearTimeout(moving); moving=setTimeout('move('+b+')',slideSpeed); theleft+=b; Menu.left=theleft} else{clearTimeout(moving); moving=setTimeout('null',1)}}
function startMenu(menu,barText){document.write('<div id=ssm style="width:'+(Width+30)+'px; left:-'+(Width)+'px; z-index:9; top:'+Yoffset+'px; '+(isStatic?'':'top:expression('+Yoffset+'+(y=document.body.scrollTop)+\'px\'); position:fixed!important; ')+'position:absolute" onmouseover=move(10) onmouseout="clearTimeout(moving); moving=setTimeout(\'move(-10)\',waitTime)"><table class=mainbg width=100% cellpadding=4 cellspacing=1><tr><td class=title align=center><b>'+menu+'<\/b><td class=ww rowspan=100 style="width:20px;padding:12px 4px 12px 4px;font-size:10pt;font-weight:bold" align=center valign=middle>'+barText); Menu=document.getElementById("ssm").style; theleft=-Width}
function addItem(text,link){document.write('<tr><td class=aa><span class=web><a HREF='+link+'>'+text+'<\/a><\/span>')}
function endMenu(){document.write('<\/table><\/div>')}
if(document.getElementById){
isStatic=false;
Yoffset=20;
Width=130;
slideSpeed=20;
waitTime=500;
startMenu("Menù","M<br>e<br>n<br>ù<br><br>l<br>a<br>t<br>e<br>r<br>a<br>l<br>e");
addItem("Nome del link","link sezione o topic");
addItem("Nome del link","link sezione o topic");
addItem("Nome del link","link sezione o topic");
addItem("Nome del link","link sezione o topic");
addItem("Nome del link","link sezione o topic");
endMenu()}
//--></script>
Se al posto della scritta menu laterale volete inserire un immagine fate così:
Sostituite a questo codice
CODICE
startMenu("Menù","M<br>e<br>n<br>ù<br><br>l<br>a<br>t<br>e<br>r<br>a<br>l<br>e");
Questo qui
CODICE
startMenu("Menù","<img src=URL IMMAGINE>");
Tutorial
Codici Html/Css/Php
