Comment construire une porte de fan Facebook de base sans payer pour l'hébergement

Publicité

Aimez-le ou détestez-le, tout le monde et leur chien sont sur Facebook de nos jours; donc comme tout ce qui est populaire dans la vie, il a été complètement renversé par les types de marketing. Une utilisation incroyablement efficace d'une page de marque hébergée sur Facebook est d'inciter les gens à aimer la page en créant du contenu secret réservé aux membres; communément appelé «porte de ventilateur». Il est rempli de vidéos exclusives, de téléchargements ou peut-être d'un coupon de magasinage - nous en utilisons un ici à MakeUseOf pour donner à nos fans un accès facile à tous les compétitions en cours.

Ce type d'application Facebook de base était relativement simple à créer dans le passé, mais Facebook exige maintenant que toutes les applications d'onglet de page aient une version sécurisée - un HTTPS accéder à l'URL, mais c'est encore 100 $ par an en plus de vos coûts d'hébergement existants pour votre site. Même si vous gérez une petite boutique de commerce électronique, vous pouvez utiliser PayPal comme fournisseur de paiement et n'avez donc pas besoin de certificats SSL. Mais ne vous inquiétez pas, car Facebook s'est également associé à

Heroku - une société d'hébergement cloud - ce qui signifie que vous pouvez créer votre propre application Facebook de base et l'héberger gratuitement sur un serveur sécurisé. Vouloir en savoir davantage? Continuez à lire pendant que je crée une application de base de page de fan-gate Facebook, hébergée gratuitement, sur Heroku.

S'inscrire en tant que développeur

Avant de créer des applications, vous devez être un développeur enregistré. Aller à developers.facebook.com pour commencer et cliquez sur le vert S'inscrire bouton en haut à droite si ce n'est pas déjà fait. Vous avez besoin d'un numéro de téléphone pour vous inscrire, mais sinon c'est gratuit.

Si vous êtes déjà inscrit, cliquez sur Applications dans la barre d'outils supérieure pour obtenir un aperçu de vos applications actuelles.

Créer une nouvelle application

C'est ici que le plaisir commence. Cliquer sur Créer une nouvelle application. La dénomination n'a pas vraiment d'importance, mais choisissez évidemment quelque chose de pertinent. Le champ d'espace de noms sera ajouté à l'URL de votre page de fans lorsque l'utilisateur clique sur cet onglet; vous pouvez le laisser vide, mais ils verront alors l'ID d'application dans l'URL, ce qui est un peu plus laid. L'espace de noms doit également être unique, alors ne vous embêtez pas avec quelque chose comme "testapp" ou vous obtiendrez une erreur. Enfin, cochez la case qui indique que vous souhaitez un hébergement gratuit de Heroku.

Après avoir rempli le captcha, vous serez invité à choisir le type d'hébergement que vous souhaitez dans Heroku - sélectionnez PHP et acceptez. Facebook créera automatiquement un nouveau compte pour vous sur Heroku si vous n'en avez pas déjà un, et pré-remplira les paramètres d'URL dans vos bases, ce qui est sympa de leur part. En fait, il est très difficile de gâcher cette étape.

À partir de la page des détails de l'application, vous souhaiterez également définir le type d'application comme un «onglet de page» et vous assurer que les URL pertinentes y sont également entrées - encore une fois, cela devrait être automatique. Enregistrez ensuite.

Heroku First Steps

Une fois terminé, vous recevrez un e-mail de Heroku avec des détails sur la façon de changer votre mot de passe, et téléchargez la «ceinture d'outils» Heroku pour votre système. Pour ceux d'entre vous qui ne connaissent pas Heroku, ce n'est pas un hôte traditionnel dans le sens où vous pouvez vous connecter à une adresse FTP et télécharger des fichiers; à la place, Heroku fonctionne avec Git, un système de contrôle de version. Une fois que vous avez installé la ceinture d'outils, vous devez d'abord cloner le site sur votre disque local - cela vous donne un répertoire qui est un miroir de ce qui est hébergé sur Heroku. Chaque fois que vous apportez des modifications à ces fichiers, vous les synchronisez à nouveau pour mettre à jour Heroku.

Les instructions pour effectuer cette première synchronisation sont contenues dans votre e-mail de bienvenue. Votre URL d'hébergement est complètement arbitraire - dans mon cas, c'était bois sec-7743 - il est généré de manière aléatoire et n'a aucune importance car les utilisateurs ne le verront pas. Ouvrez le répertoire nouvellement créé et regardez autour de vous.

Heroku a mis en place beaucoup de fonctionnalités, mais nous n'en avons pas besoin de la plupart. S'ouvrir index.php et regardez autour de vous. Recherchez les lignes suivantes près du début du fichier:

$ facebook = new Facebook (array ('appId' => AppInfo:: appID (), 'secret' => AppInfo:: appSecret (), 'sharedSession' => true, 'trustForwarded' => true,));

et immédiatement après cela, copiez-les:

$ signed_request = $ facebook-> getSignedRequest (); $ aimé = $ signé_requête ['page'] ['aimé'];

Ne vous inquiétez pas si c'est trop compliqué pour vous - je vous donnerai bientôt un modèle fini. Une demande signée est envoyée à votre application à partir de Facebook, qui comprend des informations sur l'utilisateur - s'il a un accès administrateur et s'il a aimé la page ou non. Si vous voulez savoir précisément ce qui est envoyé, ajoutez ce qui suit:

print_r ($ signe_demande);

et vous obtiendrez une impression complète de l'objet de demande signé.

À ce stade, je dois admettre que j'avais vraiment du mal à faire fonctionner la demande signée - il semblait que Heroku supprimait les données de la page charger, et ce n'est qu'après le chargement de l'API JS (10 bonnes secondes après le chargement initial de la page) que la page s'actualisait et indiquait le "bon" statut. Grâce à cette question de débordement de pile, la solution semblait supprimer le code qui applique HTTPS pour les utilisateurs non sécurisés. Supprimez le bloc de code suivant au début du modèle:

// Appliquer https sur la production. if (substr (AppInfo:: getUrl (), 0, 8)! = ' https://' && $ _SERVER ['REMOTE_ADDR']! = '127.0.0.1') {header ('Emplacement: https://'. $ _SERVER ['HTTP_HOST']. $ _SERVER ['REQUEST_URI']); sortie(); }

Maintenant, lorsque la page est chargée, vous avez une variable booléenne - c'est un vrai ou un faux - qui vous indique si l'utilisateur a aimé la page ou non. Vous pouvez l'utiliser avec un simple si instruction pour afficher le contenu une ou b:

php if ($ aimé): echo ('fan'); // c'est votre contenu secret else: echo ('not a fan'); // ceci est montré aux fans potentiels endif; 

Placez cela juste après l'ouverture faire index.php. Maintenant, si vous avez prévisualisé votre page sur Heroku, vous remarquerez qu'elle a énormément de fonctionnalités supplémentaires, montrant les pages que vous avez aimé, des boutons pour publier des mises à jour, etc. - nous n'en avons pas vraiment besoin, alors j'ai tout supprimé, y compris le SDK JavaScript pour Facebook, en ne laissant que le CSS et notre accès pour les fans. Voici le code dépouillé que j'ai fini par utiliser (c'est une image - copiez-collez de PasteBin si vous le souhaitez):

Vous devez modifier les sections qui disent «pas un fan» et «fan» pour contenir votre contenu par défaut et secret respectivement. Si vous préférez conserver votre contenu dans un fichier séparé, utilisez:

include ("secret.html");

pour importer des fichiers externes.

Synchroniser avec Heroku

Une fois que vous avez apporté toutes les modifications nécessaires à votre fichier, vous devez synchroniser la sauvegarde avec Heroku - nous le faisons en «poussant» notre copie locale vers la «branche principale» de Heroku. Assurez-vous que vous êtes dans le bon répertoire à partir de la ligne de commande, tapez:

git commit -am "modifie les messages"

(vous pouvez remplacer le message de modifications par une note à vous-même des modifications que vous avez réellement apportées cette fois - il est recommandé de conserver ces enregistrements)

et alors

git push heroku master

Attendez la fin de la commande, car cela peut prendre un certain temps.

Dernière étape: ajouter l'application à votre page

Maintenant que l'application est créée, nous devons l'ajouter en tant qu'onglet à la page de votre marque. Curieusement, cela se fait à l'aide d'une URL spécialement conçue:

https://www.facebook.com/dialog/pagetab? app_id = YOUR_APP_ID & redirect_uri = YOUR_APP_URL_ON_HEROKU

Remplacer YOUR_APP_ID avec l'ID figurant sur les détails de votre application, et YOUR_APP_URL_ON_HEROKU avec l'URL de votre hébergement Heroku. Le chargement de cette URL spéciale lancera alors la boîte de dialogue «ajouter à votre page», à partir de laquelle vous pouvez sélectionner la page de marque appropriée à laquelle ajouter l'onglet de votre page.

Alors bonjour - ce sera un nouveau bouton sur votre page, comme ceci:

Comme vous pouvez le voir, nous n'avons pas encore spécifié d'image pour l'onglet, elle est donc laissée par défaut - vous pouvez le faire à partir de la page des détails de votre application. C'est fondamentalement ça cependant; si vous chargez cet onglet, mon remplaçant index.php vous montrera soit comme ventilateur ou un pas fan. Ou tout ce que vous l'avez personnalisé pour le montrer:

Je l'admets - ce processus a été plus difficile que prévu, mais il évite complètement d'héberger quoi que ce soit sur votre propre serveur ou d'être certifié SSL. Si vous avez des questions ou des problèmes, posez-les dans les commentaires et j'essaierai de vous aider. Si les commentaires sont fermés, rendez-vous sur notre site de réponses; et s'il vous plaît, si vous avez trouvé ce tutoriel utile, partagez-le sur votre réseau social préféré. De plus, vous voudrez probablement consulter notre guide gratuit et complet sur le marketing des médias sociaux Votre guide du marketing des médias sociauxÀ l'heure actuelle, il y a une attaque de personnes et d'entreprises se tournant vers les médias sociaux. La concurrence est féroce et aucune entreprise ne peut perdre du temps ou de l'argent à le faire. Lire la suite et envisagez d'ajouter Pinterest Le guide Pinterest non officielCe guide Pinterest vous montrera rapidement comment utiliser Pinterest et toutes ses fonctionnalités. Ce guide décrit tout ce qu'il y a à savoir sur Pinterest. Lire la suite à votre stratégie aussi.