tutorials | ///ABORTI DI fotoSCIPPO ohmmygodd

the blog

« It's a wonderful world,
from the sky down to the sea,
I can only see it when you're here,
here with me. »

Scrivi qui qualcosa su di te, cosa ami, cosa odi, quali sono i tuoi film preferiti, le canzoni che ascolti spesso, i libri che leggi, eccetera eccetera.

Citazione tratta dalla canzone Wonderful world di James Morrison.

links

Irene
link

wishlist

desiderio da realizzare
~~desiderio realizzato~~

credits

template creato da Irene
distribuito qui e su 1 2 3 4

giovedì, 02 giugno 2005

Ricordo che per inserire proprie immagini, bisogna prima hostarle su siti come Altervista, Supereva ecc!

Andreakp, 22:31, commenti (2)?

venerdì, 27 maggio 2005

siccome me l'hanno chiesto, per mettere alla fine dei post i links con i numeri dei post, tipo successivo e precedente, ovvero la paginazione dei blog, il codice che dovete inserire dove la volete e' solo

<$BlogPager$>

che poi vabbe nn e' un codice ma una roba php che poi splinder interpretera. ovviamente nn usate il front page per copiarlo, a limite aiutatevi a districarvi nel codice, ma nn inseritelo dalla visualizzazione. sempre dal codice.

perche come dissi una volta in html i simboli < > $ sono strani e hanno un codicetto per essere scritti.

dimenticavo. assicuratevi che la paginazione nel vs blog sia attiva.

come?

dal pannello del vs blog, configura e poi nei sottolinks "impaginazione", attiva impag blog? ovviamente si :P

valeriucciola, 20:18, commenti (1)?

domenica, 15 maggio 2005

se vi siete mai chiesti come si fa a mettere la scrollbar trasparente nei templates, posso dirvi che (anche se nel template di homer ho preso un tutorial) ho ritrovato in un layout vecchio del mio sito, la dolls house, la prima e l'ultima, perche e' rimasta on line solo uno o due giorni, dove avevo messo sto coso.

FILTER: chroma(color=#000000) allowtransparency;

questo codice va inserito nel div che volete abbia la scrollbar trasparente, una cosa tipo cosi

<div id="post" style="position:absolute; 



FILTER: chroma(color=#000000) allowtransparency; 



width:686px; height:798px; z-index:2; left: 7px; top: 480px"> 



quel colore che e' scritto li nel filtro e' quello che praticamente scomparira, diventando 

trasparente. 

ovviamente il colore lo cambierete come vorrete. 





il codice della scroll lo scrivete normalmente, tenendo presente che 

alla parte della scroll che volete faccia trasparenza dovete assegnare 

il colore che poi metterete in quel codice all'interno del div. 





cosi, se volete che della scroll si vedano solo contorno e freccette dovete

mettere lo stesso colore del codice del div a scrollbar track color e scrollbar face color. 



spero sia chiaro :))

valeriucciola, 14:35, commenti ?

domenica, 08 maggio 2005

per bloccare il tasto destro del mouse (lo odio, anzi piu che altro lo trovo inutile dato che firefox ignora completamente lo script, o meglio, l'evento accade ma si puo cliccare comunque, questo e' il codice , richiesto da lady, da inserire subito dopo il tag <BODY>:

<script language="JavaScript1.2">
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("NON SI COPIA LA BABBARIA DEL MIO BLOG!");
return false;
}
return true;
}
document.onmousedown=right;
if (document.layers) window.captureEvents(Event.MOUSEDOWN);
window.onmousedown=right;
</script>

valeriucciola, 17:23, commenti (2)?

domenica, 08 maggio 2005

allora, siccome lady me l'ha chiesto, questo qui e' il java script che genera una finestra all'entrata nella pagina. e' brevissimo. va inserito tra i tag <HEAD> e </HEAD> .

<script language="JavaScript">

</script>

valeriucciola, 17:15, commenti (1)?

giovedì, 05 maggio 2005

Vari effetti al passaggio del mouse sui links con i fogli di stile

PREMESSA

Tutto quello che e’ qui si può visualizzare correttamente su ogni browser perché privo di filtri.. magari faranno meno colpo ma secondo me sono carinissimi e basta trovare quello giusto per rendere una pagina (senza far impallare il caricamento) spiritosa, bellina e curata. I filtri sono molto complessi anche da imparare e spesso secondo me mettono i bastoni tra le ruote alla leggibilità e al caricamento corretto della pagina; INOLTRE sono visualizzabili solo con internet explorer, e a me che uso firefox sta proprio qui questa cosa.

SINTASSI

Partiamo innanzitutto da qui.

A:link {VALORI}

A:active {VALORI}

A:visited {VALORI}

A:hover {VALORI}

Questo e’ il codice base che va inserito poi nei fogli di stile. Se non ne sai niente di questo argomento non ti preoccupare, più in là in questo tutorial spiegherò per sommi capi cosa c’e’ da sapere minimamente per non combinare casini.

Come puoi vedere ci sono 4 tipi di links.

Il primo e’ un link immacolato, non visitato, sul quale nn sta passando il mouse e dal quale nn si sta aprendo nessuna pagina.
Il secondo e’ un link attivo, cioe che si visualizza nell’intervallo di tempo che passa tra il click e il caricamento della pagina clikkata. Si può dire che se programmi cose leggere, e se soprattutto l’adsl si andrà ancora diffondendo così tanto questo tipo di link diventerà inutile. Non vale neanche la pena, almeno, secondo me, mettere dei valori diversi dal link sopra.
Il terzo e’ il link visitato.
Il quarto e’ quello su cui lavoreremo di più. E’ il link che compare quando gli passi il mouse sopra.

Quando definisci un link puoi definire un sacco di parametri. Eccoli qui. Ogni volta che programmi un foglio di stile in teoria dovresti scriverli tutti ma in effetti non ne vale la pena. Nell’altra parte del tutorial ti spiego cosa sono tutte queste cose e tu puoi usare solo quelli che ti interessano per fare i tuoi effetti.

color: #codice;
font-weight: VALORE;
font-family: VALORE;
font-size: VALORE;
font-style: VALORE;
background-color: #codice;
text-transform: VALORE;
letter-spacing: VALORE;
text-decoration: VALORE;
cursor: VALORE;

I VALORI DEI LINKS (E DEL TESTO)

color: #codice;

Penso che hai capito che si tratta del colore dei links :)) bene, questo e' obbligatorio usarlo ogni volta che scrivi dei links. e poi guarda che anche col semplice cambio di colore al passaggio del mouse viene qualcosa di carino. in ogni caso, puoi anche aggiungere al colore qualcos'altro. sotto vedrai cosa.

font-weight: VALORE;

Si tratta dello spessore del testo. Le opzioni sono bold, bolder, lighter e normal. Bold e' grassetto, bolder un po' di più, lighter e' più esile della scrittura normale e normal e' la scrittura senza nessun cambiamento. un effetto che si potrebbe anche abbinare al cambio di colore sarebbe questo: il testo normale al passaggio del mouse diventa grassetto. o al contrario. cambiando insieme di colore :D

font-family: VALORE;

Se non vuoi che i tuoi links escano in scrittura times new roman (e che obbrobrio), devi impostare il carattere. di solito uno usa verdana, arial, arial narrow, courier... poi dipende da quello che vuoi fare. però tieni presente che e' inutile che ti metti a scrivere con font scaricati da internet le tue pagine: gli altri vedranno le scritte con una scrittura normale perchè con ogni probabilità non si sono scaricati il tuo stesso font. e trovo seccanti quelle pagine dove dicono scarica il font per visualizzare il mio sito. non credo che mai qualcuno scarichera' il carattere se lo installera' e poi verra' a navigare nella vostra pagina.

font-size: VALORE;

ci sono un bel po di modi in cui si puo definire la grandezza del testo. tipo, che ne so pixel inch punto cm. ma meglio pt (punto) perche' e' quello che si usa in word. quindi per una scrittura normale un 10-12 pt va benissimo. un effetto con i links potrebbe essere il cambio di grandezza dei links al passaggio del mouse.

font-style: VALORE;

Per scrivere in corsivo metti italic o oblique. Per un testo normale scrivi... normal :)))

background-color: #codice;

Mettere in evidenza dei links si può con quello che in word e' chiamato "evidenziatore". un effetto che ho usato spesso, devo dire. si puo anche fare che il colore dello sfondo del link cambi al passaggio del mouse.

text-transform: VALORE;

Per far cambiare le lettere ai tuoi links, che ad esempio sono scritti normalmente e poi al passaggio del mouse diventano tutte le lettere maiuscole. oppure al contrario. i valori sono uppercase per fare diventare maiuscole le lettere, lowercase per farle diventare minuscole e capitalize per far diventare maiuscola la lettera iniziale.

letter-spacing: VALORE;

Questo e' davvero molto carino: fa spazio tra una lettera e l'altra. se non capisci cosa intendo, e' una cosa di questo genere e si ottiene anche in maniera semplicissima. basta mettere il valore in pixel. ad esempio se vuoi una spaziatura di 3 pixel (ovviamente in queste cose e' meglio provarle per vedere se ti piacciono) scrivi dopo i due punti 3px;

text-decoration: VALORE;

Una cosa che piace molto, anche a me, sono le linee. I links si possono sbarrare al centro, sottolineare o sopralineare, oppure si possono combinare tutti questi effetti insieme, o a due a due. per la barratura al centro della parola si usa line-through , per la sottolineatura underline e per la sopralineatura overline.

cursor : NOME DEL CURSORE IDIOTA ;

Infine, se volete che il cursore cambi quando il mouse passa sul link. i nomi dei cursori sono diversi, comunque ci faro' un tutorial per scriverli tutti.

IN SINTESI:
Per definire dei links basta prendere gli attributi che ti piacciono da sopra e aggiungerli nel codice sotto esattamente dopo la parola <head>, ricordando che i links che si vedono appena apri la pagina sono A:LINK e A:ACTIVE , quello che si vede una volta che il link e' stato già cliccato e' A:VISITED e il link sul quale passi il mouse e' A:HOVER.

A:link {INSERISCIQUIITUOIVALORI}

A:visited {INSERISCIQUIITUOIVALORI}

A:active {INSERISCIQUIITUOIVALORI}

A:hover {INSERISCIQUIITUOIVALORI}

--!>

</style>

valeriucciola, 18:48, commenti (4)?