Come personalizzare la fan page facebook con icone social media

Vuoi realizzare una pagina Facebook o una Strategia  di Social Media Marketing?

 

UPDATE 2011: Facebook non permette più questa personalizzazione!

Vuoi personalizzare la tua fan page facebook con immagini, elementi grafici ed animazioni? Viste le numerose richieste via mail, skype e posta-fb, ecco qui una piccola guida che spiega come inserire in un profilo pubblico le icone dei social media e più in generale, del codice html. Alla fine dovresti ottenere qualcosa di simile alla screen shot che vedi qui sotto. Pronto? Via!
Per prima cosa procurati le immagini delle icone con una ricerca su google; basta un click per trovare centinaia di possibilità cromatiche e pacchetti scaricabili in base alle tue necessità e gusti.
Avvertenza: fai sempre attenzione alla licenza e alle condizioni d’uso imposte dal creative commons.
Una volta fatto il download delle icone definitive, caricale su un sito di hosting gratuito: imageshack va benissimo! Copia l’indirizzo riportato sotto a “Collegamento diretto” (http://…) ed incollalo su un foglio di word; fai la stessa procedura per tutte le immagini che vorrai avere nella tua fan page. Puoi usare anche il comodo ImageShackUploader per caricamenti multipli, annotandoti sempre l’indirizzo http di ogni singola immagine.
Ad ogni icona ora va attribuita una specifica sintassi html in modo da collegare immagine e relativo collegamento ipertestuale; vediamo il codice per creare l’icona che punta alla mia fan page facebook e l’icona per il mio account twitter: tu dovrai personalizzare i campi evidenziati in giallo (inserendo i tuoi indirizzi http di facebook e twitter) e gli indirizzi http delle tue immagini caricate su imageshack, che avevi copiato su word. Se vuoi puoi anche modificare i testi dopo i comandi “img alt=”, cioè in questo caso “Iscriviti alla fan page Facebook” e “Seguimi su Twitter”.
Usa la stessa sintassi di codice per ciascuna icona social che vuoi inserire che vorrai usare.  Ci sei fino a qui? Fantastico, ora possiamo iniziare a settare facebook! Entra nella fan page che vuoi customizzare e aggiungi l’applicazione FBML Statico seguendo queste istruzioni:
1.    Clicca su “Modifica la pagina”
2.    Scorri in basso nel riquadro “Altre Applicazioni” e clicca su “Sfoglia”
3.    Nel campo di “Ricerca Applicazioni” in alto a sinistra digita static fbml e premi invio
4.    Clicca su FBML Statico di Facebook
5.    Clicca su “Aggiungi alla mia Pagina”
6.    Torna alla fan page e clicca su “Modifica la pagina”
7.    Nel link “FBML Statico” clicca su “Modifica”
8.   Nel campo “Titolo del riquadro” scrivi il nome del box/tab (ad esempio io ho scelto “Social media”)
9.    Copia/incolla il codice html che hai creato nel campo “FBML”
10.    Clicca su “Salva Modifiche”
Se vuoi vedere il codice FBML come box sulla sinistra della pagina o come scheda tabella riquadro:
1.    Vai su “Modifica la pagina”
2.    Cerca l’applicazione FBML che ora si chiamerà come hai deciso tu prima (Nome – FBML)
3.    Clicca su “Impostazione applicazione”
4.    Verifica che Riquadro sia “aggiunto” e Scheda sia “aggiunta”, poi clicca su ok
5.    Nel menù  di navigazione principale clicca sul titolo del tuo nuovo riquadro FBML (cercalo con il “+” se non compare)
6.    Se vuoi il nuovo FBML come box a sinistra della pagina clicca sulla matita che compare e seleziona “Sposta nel box”
7.    Se invece lo vuoi riportare nel menù principale in alto come scheda, clicca su “Sposta nella tabella riquadri”

Tieni conto che FBML non esegue comandi in javascript e che la larghezza massima di una pagina può essere 760 pixel. Si può ottenere lo stesso effetto grafico in un profilo personale ma anzichè usare FBML devi settare  Profile HTML, Profile Box oppure semplicemente Extended Info. Maggiori info le trovi qui.

I limiti all’utilizzo di questo approccio sono imposti solo dalla fantasia e le aziende infatti iniziano già a sfruttare schede html e applicazioni, invece della bacheca, come vere e proprie home page del profilo pubblico (vedi ad esempio puma o coca-cola). Possibili sviluppi futuri di questi strumenti? Vedo  sicuramente opportunità di CRM per raccolta feed-back e survey online. Vedo però anche ottimi spunti di marketing come: azioni tattiche di comunicazione,  campagne lancio di nuovi prodotti e  promozione, utilizzo per piattaforme teaser, alimentazione database e strategie di direct.

Jacopo Pasquini

Consulente e docente di marketing e comunicazione digitale, specializzato in Web Marketing e UX Design. Ho iniziato a navigare su Internet nel 1997 con un modem 56k, oggi lavoro come freelance per aziende, agenzie, università.

Newsletter

Email

18 Comments
  • micheleferrucci

    18 gennaio 2010 at 17:46 Rispondi

    Io purtroppo sono contro Facebook..non vedo l’ora che arrivi il profilo business anche per Twitter e allora san cazzi per Zuckerberg.
    Anche perchè dopo le liste, la @ e i re-tweet, si è capito da un bel pezzo che in Europa manco un pò di informazione ma una volta creata un pò di awareness, Twitter potrebbe a mio avviso davvero uccidere messagistica sms, mail, e Facebook stesso.

    • Doctor Brand

      18 gennaio 2010 at 18:13 Rispondi

      Ah beh Michele, con me sfondi una porta aperta: le possibilità e gli scenari di twitter sono incredibili (dai servizi per la pubblica amministrazione al customer care). Intanto è disponibile anche in italiano…finchè rimane di nicchia però è dura! Speriamo che il 2010 porti fortuna al microblogging.

      • michele

        18 gennaio 2010 at 18:18 Rispondi

        Bè chiaro, basta solo vedere come H3G gestisce l’account italiano: continue reply, retweet e compagnia bella..bel modo di gestire Twitter e di prendersi una buona fetta di mercato giovanile [dopo soprattutto l’esclusiva su iPhone, la 3 si è sempre di più avvicinata, anche a livello di ricariabili ed offerte, agli under 20]!
        Mi spiace molto invece, riguardante il discorso del Customer Care, della continua “epic fail” annuale che Google sforna: prima compra Orkut e fa la fine che fa, poi compra Jaiku per spodestare il monopolio Twitter nel microblogging e Jaiku è ora praticamente morto [se non per i feed che riportano poi a quelli di Twitter] per mano di mr. G, ed ora anche Google Wave, che secondo me aveva un potenziale immenso per trattare la tematica del Customer Care e per l’assistenza di ogni tipo, sta per andare a farsi benedire.
        Cosa significa questo? Non so, scusa se divago un pò, lo so che non si parla di Google ma mi è venuto spontaneo dopo le tue parole.. Avrei una risposta ma me la riservo a quando dedicherai un articolo a mr. G 🙂

        • Doctor Brand

          19 gennaio 2010 at 18:55 Rispondi

          Ahahaha, ok Michele ci sto! 🙂

          Per il customer care su twitter esempi come Dell sono diventati un benchmark di riferimento internazionale: http://www.dell.com/twitter

          Timidi tentativi di comunicazione pubblica italiana su twitter invece:
          twitter.com/atacmobile
          twitter.com/twitorino

    • Tenebrae

      26 gennaio 2010 at 12:23 Rispondi

      ciao doctor, grazie per la segnalazione e complimenti per l’articolo di cui sicuramente anch’io avrò bisogno, visto che prima o poi dovrò decidermi a creare una fan page anche per il mio blog

  • Giovanni

    2 aprile 2010 at 10:24 Rispondi

    Salve Doctor, io ho appena seguito tutto ciò che hai scritto per la mia fan page..
    volevo chiederti però una cosa..
    Ho appena creato la mia Scheda perfettamente con Static HTML e ora è inserito dopo Bacheca e Info..
    Come faccio a farla diventare PAGINA INIZIALE per tutti i fan che entreranno nella mia fan page ??
    per farti capire meglio, intendo come la fan page di CocaCola, che appena entra nella sua page, ti indirizza automaticamente al bottone COCACOLA CLICK TO ENTER ^^”

    Spero di essere stato abbastanza chiaro..

    • Doctor Brand

      2 aprile 2010 at 11:01 Rispondi

      Ciao Giovanni,

      vai su:

      modifica la pagina
      Impostazioni bacheca
      Modifica
      Visualizza le impostazioni
      Scheda di arrivo predefinita per tutti gli altri:
      (seleziona il nome della scheda)

      ATTENZIONE: questo “atterraggio” nella pagina iniziale che hai creato tu sarà visibile solo per chi ancora non è tuo fan…una volta diventato fan “atterra” sulla bacheca!

      • Giovanni

        2 aprile 2010 at 11:19 Rispondi

        Ora ho capito tutto ^^
        Graazie mille..

  • Antonio

    30 aprile 2010 at 20:32 Rispondi

    Grazie è stato molto utile il tuo articolo! 🙂

  • matteo

    10 maggio 2010 at 17:07 Rispondi

    ciao, ho seguito i tuoi suggerimenti.
    ho un problema: non riesco ad inserire l’icona di twitter sulla landing page, mi esce la scritta seguimi
    mentre per la landing page quando clicco sull’immagine non si apre la pagina della bacheca.

    potresti aiutarmi
    grazie
    ciao

  • matteo

    11 maggio 2010 at 11:11 Rispondi

    ce l’ ho fatta
    wow

  • Stefania Paglino

    18 agosto 2010 at 19:40 Rispondi

    Ciao
    le tue indicazioni sono state utilissime!
    GRAZIE!!!

    Ho solo un problema: le icone mi risultano tutte in verticale. Come posso fare ad affiancarle in tre per riga?

    http://www.facebook.com/home.php?#!/pages/Palermo-Italy/Cronachedigustoit/245628369690?__a=6&ajaxpipe=1

    • Doctor Brand

      19 agosto 2010 at 9:08 Rispondi

      Ciao Stefania, hai un piccolo problema di HTML, probabilmente qualche “br” o “p” di troppo tra un’immagine e un’altra.Prova a risolvere leggendo qui http://www.guidautile.com/manuale/html/testo_a_… o facendo una piccola ricerca su google.

      • Stefania Paglino

        20 agosto 2010 at 9:59 Rispondi

        Perfetto!!!! RISOLTO!
        Grazie 1000 per l’aiuto, purtroppo non conosco html.. ma grazie al tuo aiuto me la sono cavata lo stesso!!!! :-))))))

  • Guido Greggio

    7 dicembre 2010 at 17:55 Rispondi

    Ciao. ho seguito le tue istruzioni ma non mi compare la scritta “diventa fan” o simili, mi compare solo il logo (es youtube) …
    dove sbaglio?
    premetto che sto cercando righe di testo da cui prendere spunto perchè io non me ne intendo…
    grazie in anticipo.

    • Doctor Brand

      7 dicembre 2010 at 21:31 Rispondi

      ciao guido, con le nuove impostazioni di facebook questa personalizzazione della fan page non è più possibile, mi spiace! 🙁

Hello. Add your message here. Pasquini Associati
Corso UX Design Firenze Early Booking 199€