Introduzione nella home page di Blogger Scrivi un commento!

Blogger (blogspot.com): inserire un’Introduzione nella home page

BloggerCon questo articolo provo a rispondere alla domanda di Annarita (la blogger di Web 2.0 and something else): “Come inserire un box di informazioni solo nella Home Page di un blog basato su Blogger, prima dei post?”… beh, basta premere il pulsante qui a sinistra :mrgreen:

Box informazioni su Blogger
Nella home page di How-toLog ho inserito un box di informazioni (è presente anche su TechLog)

Pubblico la soluzione, perché può essere utile anche a te (se scrivi su un blog di blogspot.com) ;)

Installare lo Widget dell’Introduzione su Blogger

Inserire lo widget di benvenuto nella Home Page di Blogger / Blogspot è semplice… basta un click su questo bottone! ;)

Dopo averlo aggiunto, si aprirà la pagina del layout di Blogger, dalla quale, volendo, è possibile spostare lo widget. Puoi anche inserirne più di uno! ;)

Ho cercato di dare al riquadro un colore di sfondo neutro, che si adatti a qualsiasi template. Se vuoi cambiare i colori, devi modificare il template di Blogger.

Codice CSS (aspetto dell’introduzione)

Puoi lasciare l’aspetto così com’è, oppure evidenziare il box introduttivo con bordi colorati, colore e immagini di sfondo, font… il limite è la tua fantasia (e la tua conoscenza dei CSS). :mrgreen:

Cambiare colori dello sfondo e del bordo dell’introduzione

Vuoi cambiare solo i colori del bordo e dello sfondo dell’introduzione? Apri il template di Blogger, attivando i modelli widget, e trova questa riga:

<div class='HomePageIntro' style='background: #efefef; border: 1px solid #ccc; margin-top: 1em;margin-bottom:1em;padding:1em;'>

Per cambiare il colore di sfondo, devi modificare il valore in esadecimale #efefef, mentre per cambiare il colore del bordo devi modificare l’altro valore, #ccc. Puoi utilizzare un qualsiasi color picker per ottenere il codice HTML dei colori.

Modifica avanzata dell’introduzione tramite foglio di stile

Per delle modifiche più avanzate devi conoscere i CSS. Torna nel codice HTML, come ti ho mostrato nel paragrafo precedente; non c’è bisogno, però, di espandere i modelli widget. Cerca il seguente testo:

</b:skin>

Questo tag rappresenta la fine del codice relativo alla presentazione grafica. Ora posiziona il cursore a destra dell’ultima parentesi graffa chiusa - } - vai a capo ed inserisci la seguente regola:

div.HomePageIntro {
... proprietà CSS ...
}

Ti ricordo che sono state definite regole interne al div HomePageIntro, che sovrascrivono le regole appena immesse. Ti consiglio, pertanto di rimuoverle. Espandi i modelli widget e cerca (di nuovo):

<div class='HomePageIntro' style='background: #efefef; border: 1px solid #ccc; margin-top: 1em;margin-bottom:1em;padding:1em;'>

Rimuovi l’attributo style, in questo modo:

<div class='HomePageIntro'>

Se vuoi saperne (molto) di più, ti propongo la guida CSS di base di HTML.it. :)

Terminata la personalizzazione grafica, salva e controlla i risultati, riaprendo la home page del tuo blog su blogspot.com.

Cosa inserire nell’introduzione?

Anche qui, puoi sbizzarrirti. I consigli che ti darò sono del tutto personali, e, soprattutto, opinabili (se hai altre idee, fai sapere). ;)

  • Descrizione del sito: un visitatore, arrivato nella home page, deve sapere subito di cosa parla il sito - e la tagline, cioè quel breve testo posto di solito sotto il titolo del blog, potrebbe non bastare. Soprattutto, un utente non abituato ai blog potrebbe ritrovarsi spiazzato, ritrovandosi davanti solo l’elenco degli ultimi articoli.
    Puoi terminare l’introduzione con l’invito ad iscriversi al feed o alla newsletter, e con un link “maggiori informazioni” che punti ad una pagina “about“, se ne hai preparata una.
    Inoltre, inserendo una descrizione nel box può anche essere un’occasione per utilizzare una tagline più breve… ;)
  • Parole chiave con cui si è scelto di ottimizzare l’home page: se è presente solo l’elenco degli ultimi post, che è dinamico per natura, l’insieme delle keyword cambierà inevitabilmente nel tempo… Inserendo le parole chiave più importanti nell’introduzione, invece, inserirai un insieme di keyword costanti. ;)
    E un sistema di statistiche relativo alla sola home page, che ci dica con quali parole chiave viene trovata più spesso, può essere utile per la scelta delle Keyword. ;)
  • Link alle pagine più importanti del blog: per fornire un aiuto per la navigazione al visitatore, e per mettere in rilievo quelle pagine o post che altrimenti resterebbero nascoste.

È tutto! :D

Articoli simili:

Se questo articolo ti è stato utile, segnalalo sul tuo sito! Puoi inoltre seguire comodamente gli aggiornamenti di Techlog tramite il feed RSS; infine puoi lasciare un commento se ti serve aiuto (o anche solo per un saluto); anche qui non serve registrarsi (sono abilitati anche i commenti anonimi; l'E-Mail serve, eventualmente, per ricevere le notifiche delle nuove risposte). ;-)

Leave a Reply


SMS Gratis