Adding a newsletter subscription form to your Facebook company page
You can add a subscription form to your Facebook company/product page by adding a new tab that will load the newsletter signup form.
...
Aggiungere un modulo di iscrizione al proprio profilo Facebook
Puoi aggiungere un modulo di iscrizione alla tua pagina aziendale su Facebook aggiungendo un nuovo tab che contiene una pagina caricata esternamente.
Puoi vedere un esempio sulla pagina di Facebook di MailUp, nota il nuovo tab "MailUp Newsletter" (o visita la pagina).
In a nutshell:
- Create a subscription form that posts to your MailUp account. There are several ways to do so (see below).
- Host it on a page reachable on the HTTPS protocol
- Use that URL in Facebook to create a new Facebook page tab
Here are all the details.
About Facebook page tabs
Facebook Page Tabs allow you to load on Facebook a page hosted elsewhere, controlled by you. This gives you great flexibility on both appearance and functionality.
The tab is basically an iFrame containing another page, hosted on a secure URL outside of Facebook.
There are a couple of important limitations to keep in mind:
...
pochi passi:
- Crea un modulo d'iscrizione (vedi qui di seguito come) collegato alla lista su MailUp
- Inserisci il codice in una pagina raggiungibile via protocollo HTTPS
- Usa l'URL della pagina contenente il modulo per creare un nuovo tab di Facebook
I tab delle pagine Facebook
I moduli (tab) di Facebook sono delle pagine che permettono di inserire dei contenuti presenti su altri siti e controllati da te, uno strumento flessibile e funzionale per poter svolgere varie attività sul canale social.
Si tratta di un iFrame contenente un'altra pagina, presente su un URL sicuro all'esterno di Facebook.
Esistono delle limitazioni da tenere in conto quando si crea un tab:
- La pagina deve essere ospitata su una pagina supportata dal protocollo HTTPS
- La pagina non può essere HTML ma una pagina dinamica, ad esempio fatta con *.aspx, *.php, *.asp, or other dynamic page)
As far as we are concerned, this means that you can load a newsletter subscription form, controlling both contents and look & feel of the form.
Preparing the signup form
The newsletter signup form:
- Must be hosted on the HTTPS protocol. MailUp-hosted forms are not hosted on HTTPS, so you can't just use one of those hosted form pages. That said, you can certainly take the form code and use it in a page hosted on the HTTPS protocol.
- You can create the form in a variety of ways:
- Copy the HTML source code from a MailUp-hosted form
- Copy the HTML source code from a custom form
- Use the code from the quick form feature
- Create a newsletter signup form from scratch: the form can contain anything, as long as the syntax is correct and compatible with your MailUp account. Technically savvy users: see detailed syntax options here
How to create a Facebook Page Tab
Now that you have the form ready, you will use it to populate a Facebook Page Tab.
A Page Tab is considered an App by Facebook, so you will need to create a new app. Here are the simple steps to follow:
...
- .
Questo significa che puoi aggiungere un modulo d'iscrizione e controllarne sia il contenuto sia l'aspetto.
Preparare il modulo di iscrizione
Il modulo d'iscrizione:
- Deve essere su protocollo HTTPS. I moduli d'iscrizione base di MailUp non sono su server HTTPS e non possono semplicemente essere utilizzati ma è invece possibile prendere il codice e metterlo su una pagina con il protocollo HTTPS.
- Puoi creare il modulo in vari modi:
- copiare il codice sorgente HTML da un modulo non modificabile
- copiare il codice sorgente HTML da un modulo modificabile
- usare il codice copiato dai moduli base
- creare un modulo di iscrizione nuovo, che può contenre qualunque campo desideri purchè la sintassi sia corretta e compatibile con la sintassi diMailUp (vedi dettagli tecnici sulla sintassi da utilizzare)
Creare il tab di Facebook
In questa fase inserisci il modulo che hai appena creato in un tab di Facebook.
Facebook considera i tab delle App e quindi la prima attività è quella di crearne una, in questo modo:
- Vai alla pagina https://developers.facebook.com/apps
- Click on Clicca su Create New App
- Enter the name of the application (this is not the name that will be shown on the Tab) and a Namespace. Facebook will check availability and correct syntax.
- You have created a new app.
- Now, under App Type, select Page Tab in order to create a Facebook tab Enter the required paramenters. For example, in this screen shot you see some sample data used for our newsletter signup form. Of course, you need to change those parameters with your own.
- Note that the icon must be 111 x 74 pixels, and remember that the page must be hosted on the HTTPS protocol
- Also note the width of the page, which should be compatible with the selected option (810px or 520px)
- Click on Save Changes to continue
- Now go back to the top part of the page (Basic Info)
Specify the app domain, without specifying the protocol (e.g. www.mailup.com and not Inserisci il nome dell'App (non è il nome che verrà mostrato nel tab) e un Namespace. Facebook controllerà se è disponibile e se la sintassi è corretta. - Hai appena cerato una nuova App.
- Sotto "App Type", seleziona Page Tab
- Inserisci i parametri richiesti (vedi l'esempio sotto)
- Nota che:
- l'icona deve essere di 111 x 74 pixel
- la pagina deve essere su protocollo HTTPS
- la larghezza della pagina deve essere compatibile con l'opzione scelta (810 px o 520 px)
- Clicca su Save Changes per continuare
- Ritorna alla sezione iniziale chiamata Basic Info
- Specifica il dominio dell'app, cioè quello in cui è presente la pagina caricata nel tab, senza specificarne il protocollo (esempio www.mailup.com non https://www.mailup.com). This must be the domain that is hosting the page loaded in the Page Tab.
- Keep the Sandobx setting Enabled while you are testing. Just remember to disable it when you want to go live. When it's enabled, the new tab will be shown on the Facebook page only to its admins.
- Save the changes
- You can now tell Facebook to add the tab to the page. To do so, load in your browser the following URL, where YOUR_APP_ID is your app id (found at the top of the App page), and YOUR_URL is the secure path used for the Page Tab URL.
- Mantieni la selezione del Sandbox mode in Enabled mentre procedi con i test e ricordati di disabilitarlo quando la vuoi rendere pubblica (in questo modo il tab sarà visibile solamente agli amministratori della pagina Facebook)
- Salva le modifiche
Adesso puoi aggiungere il tab inserendo nel browser l'URL seguente (mettendo il tuo app ID che trovi in alto nella pagina dell'app al posto de IL_TUO_APP_ID e il percorso per il tuo tab Facebook al posto de IL_TUO_URL):
YOUR
https://www.facebook.com/dialog/pagetab?app_id=IL_TUO_APP_ID&display=popup&redirect_uri=
YOURIL_TUO_URL
Please note the "uri" parameter is not a typo: that's the correct syntax (if you used "url" you would receive an error)
- Load the URL in your browser address field and press Enter. Select the page that you wish to load this tab on, if you manage more than one page.
- The new Page Tab is now available on Facebook, allowing Facebook users to sign up to your newsletter(s) right from your Facebook company page.
...
Info Il parametro "uri" non è un errore di battitura ma la sintassi corretta (se inserisci url, riceverai un errore) - Inserisci l'URL nel browser, clicca su invia e seleziona la pagina in cui desideri inserire questo tab (se ne hai più di una che gestisci)
- Il tuo nuovo tab è disponibile e permette di iscriversi alle tue comunicazioni da Facebook
Risoluzione di problemi
405 Error - HTTP verb used to access the page is not allowed
If you received a 405 error when loading the page tab, the problems is very likely that you are attempting to load an HTML page. You must instead load a dynamic page.
For details, please seeSe ricevi un errore 405 probabilmente stai cercando di inserire una pagina HTML nel tab, mentre vengono accettate solo pagine dinamiche.
Per maggiori dettagli (in inglese): http://stackoverflow.com/questions/6841139/server-error405-http-verb-used-to-access-this-page-is-not-allowed