Già abbastanza diffuse qualche tempo fa, dall’ultima riedizione delle pagine (ormai sempre più simili a profili) di Facebook, le tab personalizzate sono diventate un must per chiunque voglia essere presente in maniera molto più forte sul social network. Ho avuto modo di sperimentare questo nuovo metodo che permette, attraverso la creazione di una applicazione Facebook e senza conoscere gran parte degli strumenti proprietari del social network, di avere una tab altamente personalizzata a con infinite possibilità di comunicazione.
In questo tutorial cercherò di spiegare come creare l’applicazione e personalizzarla, associarla a una pagina web e come pubblicarla e metterla come presentazione della propria pagina Facebook.Il primo passo è andare nella sezione developer di Facebook all’indirizzo http://developer.facebook.com/ e recarsi quindi nella sezione Applicazioni.
Creare applicazione per Facebook step 1
Viene quindi richiesta l’autorizzazione a procedere e permettere alle funzioni di sviluppatore di accedere ai propri dati: andiamo su Consenti.
Creare applicazione per Facebook step 2
Sono molte ora le cose che potremo fare con le applicazioni di Facebook e chi vorrà potrà provare molte cose oltre le semplici tab personalizzate, ma per ora ci basta questo. In alto a destra andiamo su Crea applicazione per creare la nostra tab.
Creare applicazione per Facebook step 3
Sarà necessario ora inserire un nome per l’applicazione e un codice (per utilizzare alcune caratteristiche di Facebook che non ci servono). Approfitto di questo articolo per creare una tab per gli amici di The Freak (visitate il loro sito su www.thefreak.it) io opto The Freak come nome e thefreakita come namespace.
Creare applicazione per Facebook step 4
Ora abbiamo creato la nostra applicazione e abbiamo davanti le impostazioni di base. Non ci servirà niente altro che queste per poter creare la tab. In questo pannello iniziamo col inserire una immagine per l’applicazione e una iconcina di 16×16 px che poi andrà a comparire nella sidebar della pagina sotto bacheca, foto e altro…
Creare applicazione per Facebook step 5
Ora la parte interessante!
Nella parte Select how your app integrates with Facebook possiamo scegliere quale tipo di applicazione crare: selezioniamo la riga Page Tab e possiamo inserire le informazioni della nostra applicazione. Fondamentalmente scegliamo il nome (nel mio caso The Freak) della tab e quindi l’indirizzo della pagina internet (nel mio caso http://www.thefreak.it/facebookapp/)che verrà visualizzata all’interno della nostra tab personalizzata.
Esattamente! Una tab personalizzata non è altro che una pagina web (con particolari caratteristiche) visualizzata in un frame all’interno della tab su Facebook. Vedremo tra un pò come crearla.
Creare applicazione per Facebook step 6
Salviamo le modifiche! Abbiamo creato la nostra app, bella e pronta per essere inserita come tab nella nostra pagina Facebook come welcome page piena di bei contenuti.
Clicchiamo ora, sulla sinistra, su Vai alla pagina del profilo della applicazione e, nella pagina della applicazione, clicchiamo sulla sinistra su Aggiungi alla mia pagina. Dall’elenco scegliamo la pagina che vogliamo usare e clicchiamo sul pulsante Add to Page: l’applicazione è stata aggiunta alla pagina selezionata.
Creare applicazione per Facebook step 7
Ora è possibile, nelle impostazioni della pagina, decidere che questa app venga visualizzata come prima cosa per i nuovi utenti e quindi offrire un messaggio per invogliarli a cliccare sul Mi piace.
Andiamo sulla pagina e su Modifica pagina e dal pannello Gestisci autorizzazioni selezioniamo come Prima scheda visualizzata la tab appena creata (nel caso The Freak).
Creare applicazione per Facebook step 8
Finito!
Nel prossimo articolo caratteristiche tecniche e informazioni su come creare al meglio e con stile questa pagina per la tab di Facebook!
Aggiornamento
Come si evince dal blog ufficiale dei developers Facebook, dal 1mo febbraio le pagine delle applicazioni saranno eliminate (anche se non proprio a dire il vero). Questo ha comportato, dopo l’uscita di questo articolo, che la maggior parte degli sviluppatori non ha trovato il link alla pagina dell’applicazione per poterla poi aggiungere come tab.
La soluzione e` avviare una procedura manuale, ovvero indirizzare il browser verso la pagina http://www.facebook.com/add.php?api_key=APPID&pages dove sostituire APPID con l’ID dell’applicazione. Lo trovate nella schermata di creazione, vicino l’icona.
Creare applicazione per Facebook step 9
A quel punto scegliere la pagina dove aggiungere e via…
ora vogliamo la seconda parte!! :D
grazie
Ahahah, grazie Laura. E` un piacere e un onore la tua presenza sul mio sito.
Considerando quanto tempo ho impiegato per scrivere queste quattro righe non aspettarlo molto presto il secondo articolo. Intanto, comunque, grazie a te: spero che la procedura funzioni e sia utile.
wow wow wow
ma tu sei un Genio!!!!!
Ahahah: grande Daniele! E tu sei un lecchino :D
Grazie amico, appena possibile, in relazione al secondo tutorial per le pagine Facebook (che fara` piacere anche a Laura) sistemero` l’applicazione.
per ora mi sono limitata a conservare l’articolo per quando lo dovrò applicare :)
ps metti un bel subscribe to comments? così posso seguire le risposte :D
Saggia indicazione: aggiuto il plugin e ora a tua disposizione!
Ciao! Guida utilissima, grazie tante.
Unico problema:
dove si trova questo benedetto tasto che dice “Vai alla pagina del profilo della applicazione”?
Nella pagina di modifica dell’applicazione, a lato c’è scritto:
“Link correlati
Use Debug Tool
Use Graph API Explorer
See App Timeline View
Promuovi con la pubblicità
Traduci la tua applicazione
Elimina l’applicazione”
Mi sai dire perchè???
Grazie e scusa il disturbo
Da un paio di giorni riscontro lo stesso problema nella creazione di nuove app mentre, per le vecchie create, ancora risulta tutto ok (con relativo link alla pagina applicazione). Suppongo possa essere un problema di Facebook e dei cambiamenti che stanno apportando, magari le applicazioni sono in “pending” e dovremo attendere un po` prima che permettano di aprirle. Intanto faccio una ricerca su questa cosa.
Ho svelato l’arcano: a causa della nuova politica sulle pagine e pagine delle applicazioni, non c’e` piu` quel link specifico ma viene “nascosto” in un’altra sezione. Provvedo ad aggiornare l’articolo appena possibile! Grazie della segnalazione.
Intanto potresti scrivermi il link? Vorrei tanto poter collegare la mia app alla mia pagina!
Grazie
Questa sera scrivo l’aggiornameto per permetterti di completare l’operazione. :-)
Ok perfetto.. sempre su questa pagina? così aggiorno finchè non appare!!!
Grazie
Si Paolo e grazie della fiducia. Se sei iscritto ai commenti e ricevi le email di aggiornamento stai sicuro che scrivo per informarti. Domattina provo a realizzare questa nuova app e quindi scrivo se il processo e` ancora valido: peccato che abbiano cambiato proprio ora che la cosa pareva semplice.
Alla fine sei riuscito a pubblicare l’aggiornamento? Se è su questa pagina io aggiorno ma ancora non lo visualizzo! Potresti intanto inviarmi per email quel link “nascosto in un’altra sezione” per favore?
Ancora grazie
Ancora non ho avuto tempo di scrivere una procedura univoca e corretta. Spero in settimana: chiedo venia.
ciao a tutti anch’io ho dei problemi ad associare la mia app alla pagina che ho creato!
avevo già fatto questi procedimenti per un altra applicazione e non c’è stato nessun problema e adesso funziona ancora…volevo sapere se per caso è cambiato qualcosa su facebook o la gestione delle applicazioni nuove è differente..grazie
saluti
f
Il problema e` che e` cambiata la gestione delle pagine relative all’applicazione: dal 1mo febbraio non saranno piu` concesse e verranno anche rimosse quelle precedentemente create. Cosi` la procedura per arrivare all’applicazione diventa diversa e un po` piu` contorta.
Appena sono in grado di fornire una procedura univoca e semplice la segnalo in aggiornamento a questo articolo.
Ancora niente! Io quel maledettissimo link non lo vedo ancora? Nel frattempo avete scoperto qualche altra via?
Articolo aggiornato: nuova procedura segnata causa chiusura delle pagine associate alle applicazioni. Grazie per l’attesa e scusate.
Sei il numero uno…ci stavo impazzendo…
Felice di essere di aiuto!
Ciao, sei l’unico che ha scritto del nuovo modo per collegare la tab alla pagina. Grazie da parte di tutti quelli che ci sono diventati matti! ;)
Ti ringrazio, ma non sono tutti miei i meriti: anche altri blog, prima di me, ne hanno parlato. Ma sono felice che la mia procedura sia utile!
Io ci sono arrivato solo dopo una settimana, ma duratte quella settimana ho cercato online e non ho trovato nulla. Probabilmente perché nei siti non ci sono tra i contenuti le keyword che cercano le persone. Secondo me se fai un articoletto con la procedura di collegamento della tab intitolato “facebook: perché ‘vai alla pagina del profilo’ non si vede” ricevi un sacco di visite ;-)
Innanzitutto grazie Andrea per la dritta sulla procedura manuale, ma volevo chiedervi avete per caso notato se le tab personalizzate delle vostre pagine sono ora visibili solo agli sviluppatori? nel senso che gli altri non riescono a vederle… help!
Perdonatemi avevo lasciato abilitato il Sandbox nella sezione Authentication della app. Buon natale a tutti!!!
Bhe, tutto ok allora: se qualcuno avesse lo stesso problema sarebbe da controllare!
Grazie di questo contributo che trovo utilissimo, se non il problema che alla visualizzazione della pagina di benvenuto,già installata su FB, mi appare l’erroe “The page cannot be displayed
The page you are looking for cannot be displayed because an invalid method (HTTP verb) was used to attempt access. ” ecc… ecc…
Ho provato a iserire il link sia con l’index.html finale che lasciando la directory prima dell’index. In entrambi i casi l’errore è lo stesso.
Spero in un vostro aiuto.
Grazie
Se hai correttamente eseguito la procedura, sei sicuro che l’URL che hai inserito -come riferimento alla pagina .html che si dovrebbe visualizzare in tab- sia corretto? Se ti viene visualizzata la tab e all’interno riscontri un errore 404 (pagina mancante) l’unica e` che la pagina… manca davvero!
Grazie della risposta.
Già è da un mese forse che provo a creare l’app e la 1ª volta mi risultava tutto nuovo.Ora ho fatto la procedura da capo e mi sembra di aver eseguito correttamente tutti i passi.
Il link aveva sia il formato: http://www.nomedelsito.com/cartella/index.html che il formato http://www.nomedelsito.com/cartella/.
In entrambi i casi cliccando col tasto destro sulla pagina che dava errore copiavo il link e incollandolo sullo spazio url del browser si caricava correttamente.
L’unico dubbio che mi è soto è la pagin SSL.
Il dominio è sotto Aruba e tale servizio non è offerto quindi non posso inserere un httpS. Sarà questo il motivo?
Notte.
Strano, strano davvero: anche nell’altro commento si parla di questo problema ma, stranamente, io non possiedo un certificato di quel tipo per nessuna delle pagine che ho creato…
ciao, intanto grazie mille per le dritte..
io però sono assolutamente a digiuno delle basi di ciò che hai scritto e quindi mi ritrovo in questa situazione:
- ho creato una pagina “fan” ma è ancora in costruzione quindi non pubblicata
- ho creato un app che diventerà la landing page dei non iscritti
- ho creato una pagina (pagina.html) situata fisicamente sul mio dominio
- ho aggiunto il nuovo tab alla pagina “fan”
purtroppo, però, cliccando sul tab, non mi compare praticamente nulla.. al momento la pagina.html alla quale punta il tab contiene solo un’immagine in formato .png
ho notato però che allo step 6 tu indichi una directory e non una pagina. E’ quello il motivo per cui io non visualizzio nulla?.. cioè nei campi “page tab” page secure tab” page edit tab” devo inserire il link alla pagina o alla directory che contiene la pagina?
scusa per la banalità della domanda
rafa
;)
Esattamente: il link che devi inserire deve essere completo non solo del nome pagina ma di tutta la path del sito, per esempio
http://www.nomedelsito.com/cartella/pagina.html. Se non hai messo questi tipo di indirizzo e` impossibile che trovi la pagina indicata e quindi la visualizzi!PS: complimenti per le foto e grazie per il commento!
si del path lo sapevo..
la domanda era rivolta al fatto che nel tuo esempio non c’è l’estensione html della pagina e quindi pensavo bisognasse indicare solo la directory..
invece ho scoperto che il mio problema sta nel non possedere il certificato ssl..
sto cercando soluzioni economiche.. tu hai qualcosa da consigliarmi??
ti ringrazio per i complimenti che ricambio calorosamente, soprattutto per il tempo e le risorse che dedichi alla condivisione delle tue conoscenze
rafa
;)
Neanche io ho un certificato SSL e non credo che serva. Io non ho messo la pagina in fondo al path per il semplice fatto che quella standard in questo caso e` index.php (vedi configurazione standard dei server linux o comunque informazioni base su come costruire un sito web): per essere sicuro metti nello spazio la stessa URL che, mettendola nel browser ti fa vedere la pagina per Facebook.
Ma la pagina deve avere estensione finale php o va bene anche in html.
esempio path/index.php o path/index.html?
E il path htttp:// e non httpS:// perché io non possiedo il 2°
Per la pagina va bene anche .html e per i path io ho messo sempre il http:// visto che neanche io ho un https://