Capire onde sfruttare al meglio i codici di base dell'HTML per poter potenziare direttamente gli interventi.

Inserire un codice HTML, in un html personalizzato o sandbox, prelevato da un sito hosting in cui abbiamo caricato un immagine o da un sito web, è molto semplice, ma dovete sapere che in quel codice molte voci si possono correggere naturalmente sapendo dove andare a mettere mano.

AVVERTENZA IMPORTANTE: nel correggere i codici NON eliminate mai le virgolette " "; le freccette <>; o gli uguali =; o altri simboli, altrimenti il codice non funziona.

Ebbene ecco i codici più comuni; <br>; <hr>;<font family>;<font color><size><width><height><filter><color>

<br>: se stiamo scrivendo un intervento in html la scritta va a capo automaticamente, se invece vogliamo andare a capo noi dobbiamo scrivere<br> Es: siamo andati a <br> Roma. la parola Roma andrà nella riga sotto cioè a capo.

<hr> Serve per creare un linea divisoria. Quindi se trovate questa scritta <hr color="red"> significa che la linea divisoria è rossa. Ma se noi la vogliamo blu? basta correggere -red- in blue- o altro colore ma sempre scritto in inglese.

<font-family: arial> indica il tipo di scritta. Se noi vogliamo cambiare la scritta correggiamo -arial- in un altro tipo che troviamo in word o formato. Es: arial black; Verdana o tahoma, oppure quella che più vi piace. 

<font color="red" size="5" face="verdana"> Variando rispettivamente -red; 5; verdana; o quello che più ci interessa , noi correggiamo il colore, la grandezza e il tipo di testo. Questo codice lo potete trovare anche suddiviso singolarmente Es:<font-color>; <font-size>; <font-face>. Comunque ciò che segue questi "font" lo potete variare ugualmente.

<width> indica la larghezza. Se questa parola è seguita da un numero Es:<width: 150> quel numero lo possiamo aumentare o diminuire, di conseguenza allarghiamo o accorciamo quello a cui la parola è riferita. Se troviamo scritto <width:100%> significa che viene utilizzata la larghezza massima.

<height> indica l'altezza. Se questa parola è seguita da un numero Es:<height: 150> quel numero lo possiamo aumentare o diminuire, di conseguenza aumentiamo o riduciamo quello a cui la parola è riferita.

<filter> indica una sfumatura del testo. Filter è seguito dalle seguenti parole: mask; glow; shadow; dropshadow che stanno ad indicare il tipo di sfumatura; ogni filtro è seguito da un codice sempre chiuso fra parentesi tonde,naturalmente sia il "color" che i "numeri", all'interno di esse, li potete variare tranquillamente. 

<color> indica il colore. i colori vanno sempre scritti in inglese oppure con i codici esadecimali(#00ff00).

<DIV style="FONT-SIZE:numpt; FILTER: shadow(Color=color1 Direction=num1); WIDTH: 100%; COLOR:color2; FONT-
                                                                   FAMILY:carattere">
                                           <P style="LINE-HEIGHT: 150%">testo</P></DIV>

Al posto di num mettete un numero da 10 a 50
1- al posto di color1 mettete il colore dell'ombra. Utilizzate il nome dei colori in inglese o i codici Hex reperibili da questo
                                                           sito: http://www.visibone.com/colorlab/
                                          2- Al posto di num1 mettete un numero per la lunghezza dell'ombra da 1 a 5
                                                3- al posto di color2 il colore della scritta interna
                                                         4- Al posto di carattere il tipo di scrittura
                                                          5- Al posto di testo il testo della scritta  

Questo che vedete sopra è il codice di un tipo di scrittura, che potete copiare e incollare nel vostro intervento, a cui potete fare le varie prove. Prima di effettuare le variazioni riempite tutte le parti come riportato in descrizione e poi effettuate le variazioni.

Per rendervi conto della variazione clikkate su HTML, che si trova a destra della barra degli strumenti, ogni volta che effettuate una correzione.

RIASSUMENDO: 1) aprite un intervento; 2) clikkate sul bottone HTML; 3) inserite il codice; 4) riempite le parti; 5)effettuate le correzioni; 6) per vedere il risultato clikkate ancora su HTML.

<div style="FONT-SIZE: 28pt; FILTER: DropShadow(Color=Black, OffX=3, OffY=3, Positive=1); WIDTH: 100%; COLOR: #0000ff; FONT-FAMILY: Bauhaus 93"><P style="LINE-HEIGHT: 150%">Scritta blu.-scrivi testo</p></div

Questo che vedete sopra è il codice da inserire nel vostro intervento blog

<div style="width: 100%; font-size: 24px; font-family: Arial Black; color: green; Filter: Mask(Color=#00FF00)"><P style="LINE-HEIGHT: 150%">Scrivi qui il tuo testo -</p></div>

Questo che vedete sopra è il codice da inserire nel vostro intervento blog

<div style="width: 100%; font-size: 24px; font-family: Tahoma; color: red; Filter: Glow(Color=#00FF00, Strength=8)"><P style="LINE-HEIGHT: 150%">Scrivi qui il tuo testo</p></div>

Questo che vedete sopra è il codice da inserire nel vostro intervento blog

Ci saranno momenti di gloria anche per noi grandi guerrieri provenienti dalle terre del nord

Volete inserire una foto di vostro piacimento in un intervento blog e scriverci sopra il vostro intervento praticamente come questa che vedete.                                                

Bene: prima di tutto dovete scaricare -Windows Live Writer- su come scaricarlo andate su consigli blog--->inserire windows live writer di questo stesso blog. Chiaramente una volta scaricato dovete imparare ad usarlo, ma vedrete subito che è molto semplice, praticamente si usano maggiormente due sole voci che sono: "visualizza" per inserire i codici HTML; e "formato" per inserire le scritte e i colori. Vedrete che dopo due prove sarete abbastanza pratici per affrontare il nostro intervento.

Vi dico questo perchè con questo programma potete fare cose che in un intervento del blog non sono neanche menzionate.

Questo è il codice HTML che dovete inserire:

<DIV align=center><DIV style="WIDTH:800px"

<IMG height=600 src="indirizzo internet della foto" width=800 align=right>

<DIV style="BORDER#00000 4px solid; FLOAT:left, WIDTH: 800px;HEIGHT:460px;OVERFLOW:none">

<P>qui mettete il vostro testo</P></DIV></DIV></DIV>

Dove c'è scritto "indirizzo internet" dovete inserire l'indirizzo (URL) della foto;

Per prendere l'indirizzo dovete cliccare col tasto destro del mouse sulla fotografia, dalla finestra che si apre cliccate su proprietà e li trovate l'URL.

Dove c'è scritto "qui mettete il vostro testo" lo cancellate e ci inserite i caratteri della scrittura che li prendete da:formato--->carattere e dalla scheda che appare selezionate:tipo di carattere; stile; punti e colore. Il codice che vi apparirà sarà:<font face="tipo di carattere" size="punti"><strong>qui inserite il vostro testo</strong></font>.

Naturalmente se volete allargare o allungare l'immagine di sfondo, dovrete correggere i valori di tutti WIDTH e HEIGHT che vedete, dello stesso numero, ossia se aumentate di 100 un valore anche gli altri dovranno essere aumentati di 100, lo stesso dicasi se diminuite.

N.B. il codice sopra riportato potete inserirlo anche nell'intervento blog, avrete lo stesso effetto ad eccezione della scritta perchè in writer la puoi cambiare e colorare, nel blog no. Chiaramente l'intervento va scritto dove  c'è "mettete qui  il vostro testo". 

L'elenco di sinistra c'è il nome del Modulo;

Quello di destra l'azione da intraprendere:

Clicchiamo su personalizza che si trova in alto a destra dello spaces, dal menù a tendina clicchiamo su riorganizza o nascondi moduli a questo punto ci troviamo in modalità "modifica" del nostro spaces.

clicchiamo su modifica del nostro HTML e ci si aprirà un rettangolo bianco come questo

 dove dovremo inseriremo il nostro codice html ed un eventuale testo  o frase di nostro gradimento.

Poi prendiamo la nostra foto e la carichiamo sul nostro computer alla cartella immagini. Poi ci colleghiamo al sito: http://www.imageshack.us/  che vediamo nella foto qui sopra e clicchiamo su sfoglia e carichiamo la nostra foto. Fatto questo clicchiamo su "host it" ed aspettiamo il caricamento. Avvenuto il caricamento copiamo il link con a fianco scritto- hotlink for website- che si trova in fondo alla pagina ,e lo incolliamo nel rettangolo bianco.

Fatto questo clicchiamo su pubblica in alto a sinistra.

per inserire un HTML personalizzato clicchiamo su - personalizza -che si trova in alto a destra dello spaces, dal menù a tendina che si apre clicchiamo su aggiungi moduli e vi apparirà questa         schermata:                                       

scorrete fino a "ALTRO" e alla voce HTML personalizzato cliccate su AGGIUNGI posto alla sua destra.

Fatto questo cliccate su SALVA che si trova in alto a destro dello spaces.

per spostare i moduli all'interno del blog dovete andare in modalità "modifica" che significa andare su PERSONALIZZA, nel menù a tendina che si aprirà cliccare su RIORGANIZZA O NASCONDI MODULI, attendete fino a che vi apparirà una striscia gialla dove nella parte destra c'è scritto SALVA e ANNULLA.

Andate con la freccetta del mouse nella parte alta del modulo che volete spostare, quando la freccetta cambierà forma cioè diventa color nero ed a la forma di quattro freccette opposte come vedete in figura

cliccate sul tasto sinistro del mouse e tenendolo premuto spostate il modulo dove credete più opportuno, a questo punto lasciate il tasto sinistro del mouse.

potete ripetere l'operazione quante volte volete fino a che trovate il punto esatto.

Terminate tutte le operazioni andate in alto a destra dello spaces dove c'è la striscia gialla e cliccate su salva.

Per prima cosa dovete scaricare un "sandbox"(per il suo inserimento andate a: suggerimenti blog - cosa è il sandbox - in questo stesso blog).

Poi andate al sito: http://www.myspaceclock.net/ vi apparirà questa schermata:                                                                                 

"choose sire" serve per ingrandire o ridurre l'orologio;

"choose color" serve per cambiare colore;

"choose your clock" serve per cambiare il tipo di orologio.

fate tutte le prove che volete, fino a raggiungere il risultato che più vi aggrada. Fatto tutto.....

sotto a "copy HTML code" appare il codice HTML che voi dovete copiare e incollare sul "sandbox" che avete scaricato in precedenza.

Fatto tutto RICORDATEVI di cliccare su "salva" che si trova in alto a destra del vostro spaces.

codice:

<div style="width: 100%; font-size: 24px; font-family: Arial Black; color: red; Filter: Shadow(Color=#0000FF, Direction=225)"><P style="LINE-HEIGHT: 150%">Scrivi qui il tuo testo </p></div>

volete una scritta come questa?

Copiate e incollate il codice sopra riportato nel vostro intervento blog.

per inserire la scritta cliccate su "HTML" e incollate il codice.

Cancellate "scrivi qui il tuo testo" e mettete quello che volete scrivere voi.

variazioni:

Al posto di "24px" potete mettere un numero più grande per ingrandire la scritta es: 30px,

Al posto di "arial black" potete mettere un'altra scritta reperibile su wordpad, oppure sotto la voce "stile" dell'intervento stesso.

Al posto di "red" potete mettere un'altro colore es:yellow, o il colore che più vi piace ma sempre in inglese. 

Al posto di "#0000FF" potete utilizzare il nome del colore in inglese, oppure utilizzare i CODICI HEX reperibili al sito: http://www.visibone.com/colorlab/

Fate tutte le prove che volete. Soddisfatti del risultato scrivete il vostro testo o usatelo solo per il titolo del vostro intervento.

per nascondere il titolo ed i bordi dei moduli andate in modalita' modifica cliccando in alto a destra su -personalizza---->aggiungi moduli-.

Andate sul modulo che volete modificare e cliccate sul triangolino bianco in alto a destra, sul menu a tendina che si aprirà vi saranno due diciture ossia impostazioni e nascondi cliccate su impostazioni e vedrete questa scheda

 mettete il segno di spunta su ciò che volete nascondere e cliccate su salva.

Fatto questo cliccate ancora su salva che si trova in alto a destra dello  space all'interno della striscia gialla.

per entrare in modifica del vostro space dovete cliccare su personalizza che si trova in alto a destra dello space,

vi si aprira' una tendina , cliccate su  aggiungi moduli  e attendete che vi appaia  la schermata  che  vedete qui sotto,

da questa posizione potete effettuare modifiche al vostro space oppure aggiungere elenchi e tutto quello che e' riportato nella scheda bianca.

Terminate le modifiche cliccate su -salva- che si trova sempre in alto a destra.

per centrare un titolo o una foto dovete mettere il seguente codice davanti al codice html che avete

<div align=center>

racchiudetelo sempre tra le due freccette

Windows live writer è un'applicazione che facilita la pubblicazione di contenuti completi nel  BLOG.

1. Ti bastano pochi minuti per creare un blog avvincente e ricco.
2. Puoi visualizzare l'anteprima del tuo blog prima di pubblicarlo.
3. Creare gli interventi stando non in linea.
4. Inserire tabelle, mappe e video.
5. Configurarlo con il tuo blog.

                                                 E MOLTO DI PIU'

Per scaricarlo cliccate:QUI   oppure   http://get.live.com/betas/writer_betas

Entrati nel sito cliccate su DOWNLOAD, cambiate lingua se vi si presenta in inglese.

Scaricatelo è gratis ed una volta imparato ad usarlo vi renderete conto dei notevoli vantaggi che esso comporta.                                                      

Un'altra possibilità di scaricarlo si trova in fondo alla pagina degli interventi blog.

DOPO UN BRUTTO INIZIO DOVE GIA SI GRIDAVA CHE ERAVAMO FUORI DAGLI EUROPEI , IN QUESTA SECONDA RIPRESA ABBIAMO DIMOSTRATO CHE A PALLONE CI SAPPIAMO GIOCARE ANCHE NOI, E SE NON FOSSE CHE LA IELLA CI PERSEGUITA AVREMMO SICURAMENTE VINTO, ACQUISTANDO UN PO' DI QUELLA TRANQUILLITA'  CHE CI AVREBBE AIUTATO A SUPERARE IL PRIMO TURNO SENZA TANTI AFFANNI. SPERIAMO CHE OLTRE AL GIOCO ANCHE LA FORTUNA CI VENGA INCONTRO......STAREMO A VEDERE.