Bien que certains considèrent le partage comme l'un des principes fondamentaux d'Internet, il arrive que nous ne voulions partager certaines informations qu'avec un certain groupe de personnes..
Cette information, appelons-la «contenu premium» à toutes fins utiles, ne sera partagée qu'avec les utilisateurs qui nous donnent quelque choseen retour. Ce «quelque chose» peut être une adresse email, un don PayPal ou simplement un partage sur Facebook..
Dans ce tutoriel, j'expliquerai comment créer un plugin de Content Locker qui, avec un simple shortcode, nous permettra de choisir le contenu que nous voulons rendre premium..
Nous allons couvrir deux exemples:
Dans WordPress Social Invitations, nous utilisons un casier de contenu très similaire qui affiche le contenu uniquement pour les utilisateurs qui ont invité leurs amis..
Remarque: Au lieu d’ajouter du code au fichier de fonctions et / ou aux stylesheeet d’un thème, je vous recommande de créer un plugin pour l’ajouter à votre site. Cette méthode conserve tout au même endroit et vous permet d’utiliser le shortcode sur n’importe quel autre site..
Pour compléter ce tutoriel, vous aurez besoin de:
Commencez par ouvrir un nouveau fichier dans votre éditeur de texte et donnez-lui un nom. Dans les exemples que nous allons voir dans cet article, vous verrez que j'ai nommé le mien wptuts-content-locker.php
mais tu peux appeler le tien comme tu veux.
Dans le fichier, insérez le code suivant:
Ceci configure votre plugin et indique à WordPress son nom et sa version..
Ajout de la fonction Shortcode
Au-dessous du commentaire d’ouverture, nous devons ajouter la fonction qui créera le shortcode et le reliera au
add_shortcode
crochet d'action:// enregistre le shortcode qui accepte un paramètre add_shortcode ('premium-content', 'wptuts_content_locker'); // fonction shortcode fonction wptuts_content_locker ($ atts, $ content) extract (shortcode_atts (array ('method' => "), $ atts));; global $ post; // si la méthode n'est pas 'facebook', alors nous vérifie la présence d'un utilisateur connecté if ('facebook'! = $ method) if (is_user_logged_in ()) // Nous renvoyons le contenu, retournons do_shortcode ($ content); // Nous renvoyons un lien de connexion qui redirigera vers ce contenu. post après que l'utilisateur est connecté, retour 'Vous devez vous identifier)). '"> Connectez-vous pour voir ce contenu'; // Nous utilisons la méthode facebook else // Vérifiez si un cookie est déjà défini pour cette publication if (isset ($ _COOKIE ['wptuts-lock']] [$ post-> ID])) // Nous retournons le contenu return do_shortcode ($ content); // Nous demandons à l'utilisateur d'aimer post pour voir le contenu else return 'S'il vous plaît partager ce post pour voir le contenu';Nous pouvons maintenant utiliser notre shortcode comme ceci:
[contenu premium] le contenu Premium va ici [/ premium-contenu]
Mais attendez! Laissons un regard détaillé sur le code ci-dessus.
Comme vous pouvez le constater, notre shortcode accepte un argument qui divisera notre code en deux parties. Cet argument que j’ai appelé «méthode» distingue l’utilisation de l’approche «J'aime sur Facebook» ou de la vérification «simple utilisateur connecté»..
Les deux méthodes sont similaires dans la logique, comme vous pouvez le voir dans le graphique suivant:
Si l'utilisateur n'est pas connecté, nous affichons un lien de connexion à l'aide de
wp_login_url
fonction et nous passons aussi le post / page url. De cette façon, après que l'utilisateur se soit connecté, il sera redirigé vers le poste..La méthode Facebook est un peu plus complexe et implique l'utilisation de cookies. Nous les utilisons pour stocker l’ID de publication, afin de savoir quelles publications sont partagées par l’utilisateur et lesquelles ne le sont pas..
Le fichier JavaScript
Nous avons également besoin de javascript qui gérera la création de cookies et le rappel Facebook. Créons un fichier appelé
script.js
et collez le code ci-dessous:function createCookie (nom, valeur, jours) var expires; si (jours) var date = nouvelle date (); date.setTime (date.getTime () + (jours * 24 * 60 * 60 * 1000)); expires = "; expires =" + date.toGMTString (); else expires = ""; document.cookie = escape (nom) + "=" + escape (valeur) + expire + "; chemin = /"; (function ($) $ (function () FB.Event.subscribe ('edge.create', fonction (href) createCookie ('wptuts-lock [' + wptuts_content_locker.ID + ']', vrai, 9999 ); location.reload (););); (jQuery));Dans ce script, nous allons associer une fonction de rappel au FB.
événement edge.create
. Plus précisément, cette fonction créera le cookie que nous utilisons dans notre script principal pour vérifier si l'utilisateur a partagé la publication. Une fois le cookie créé, le script rechargera la page pour afficher le contenu premium.Ajouter les scripts à notre plugin
Nous devons maintenant ajouter notre fichier de script au plugin, mais créons d'abord un fichier CSS très basique pour styler notre plugin.
Créez un fichier appelé
style.css
et ajoutez le code suivant:/ * Feuille de style pour Tuts + Shortcode Content Locker * / .wptuts-content-locker width: 80%; bloc de visualisation; bordure: 3px en pointillé #ccc; rembourrage: 20px; text-align: center; marge: auto 20 pixels .wptuts-content-locker div.fb-like.fb_iframe_widget débordement: masqué;Maintenant, laissez enregistrer nos scripts dans le
wp_enqueue_scripts
crochet:// Enregistre la feuille de style et le javascript avec le hook 'wp_enqueue_scripts', qui peut être utilisé pour les CSS et l'interface frontales add_action ('wp_enqueue_scripts', 'wptuts_content_locker_scripts'); // fonction qui met en file d'attente le script uniquement si un shortcode est utilisé function wptuts_content_locker_scripts () global $ post; wp_register_style ('wptuts_content_locker_style', plugins_url ('style.css', __FILE__)); wp_register_script ('wptuts_content_locker_js', plugins_url ('script.js', __FILE__), array ('jquery'), ", true); if (has_shortcode ($ post-> post_content, 'premium-content')) wp_enqueue_style (' wputs_content_locker_style '); wp_enqueue_script (' wptuts_content_locker_js-fb ',' http://connect.facebook.net/en_US/all.js#xfbml=1 ', array (' jquery '), ", jQuery',", FALSE); wp_enqueue_script ('wptuts_content_locker_js'); wp_localize_script ('wptuts_content_locker_js', 'wptuts_content_locker', array ('ID' => $ post-> ID));Veuillez noter que nous utilisons le
has_shortcode
une fonction. De cette façon, nous allons inclure les fichiers JavaScript et CSS uniquement lorsque cela est nécessaire et non sur toutes les pages de notre site..Nous profitons également de la
localiser_script
fonction pour passer correctement l'ID de publication au fichier JavaScript.Conclusion et code
En environ 120 lignes de code, nous avons créé un plugin de contenu simple mais très utile. C'était facile, non?
La beauté de ce plugin est que vous pouvez l'ajuster pour fonctionner avec n'importe quelle méthode que vous pouvez penser. Par exemple, au lieu d’un Facebook similaire, vous pouvez demander aux utilisateurs de tweeter sur votre site, d’ajouter un lien de donation PayPal ou de n’importe quoi d’autre que vous pouvez imaginer..
Vous pouvez récupérer le code de GitHub ou essayer une démo.