Créer de superbes pétitions dans vos publications

WordPress est une excellente plate-forme polyvalente. Vous pouvez créer de nombreux sites Web ayant plusieurs objectifs: un site Web d'entreprise, une vitrine de la photographie, un portail d'informations, un site Web de restaurant avec des menus interactifs… Oh, et des blogs, bien sûr. Vous pouvez bloguer avec WordPress. Oublié ça.

Étrangement, les organisations à but non lucratif ont tendance à négliger cette flexibilité et à en tirer parti. Dans ce tutoriel, nous allons montrer comment créer un script de pétition simple pour montrer comment une organisation peut tirer parti de WordPress..


Que construisons-nous exactement??

Je suis un grand fan des codes abrégés (comme vous pouvez le constater dans mes précédents articles), nous allons donc créer un ensemble de codes abrégés et quelques fonctions utiles pour les codes abrégés à utiliser. Nous allons rassembler tous ces éléments dans un fichier appelé petition.php et l'utiliser comme un plugin WordPress.


Fonctions d'assistance

Puisque nous allons les utiliser dans nos codes courts, j'ai pensé qu'il serait préférable de les créer et de les expliquer d'abord..

Une fonction de validation de courrier électronique de base

Si vous utilisez PHP5 sur votre serveur, nous allons utiliser les validateurs de messagerie intégrés pour notre fonction:

 // fonction de validation d'adresse e-mail function fonction validate_email ($ email) if ($ email == ") return false; else return filter_var ($ email, FILTER_VALIDATE_EMAIL);

Et si vous utilisez quelque chose d'ancien comme PHP4, vous pouvez utiliser une fonction différente qui utilise des expressions régulières:

 // fonction de validation d'adresse e-mail function validate_email ($ email) if ($ email == ") return false; sinon $ eregi = preg_replace ('/([a-z0-9_.-]+)' . '@'. '([a-z0-9 .-] +) 2,255'. '.'. '([az] +) 2,10 / i', ", $ email);  retour vide ($ eregi)? vrai faux; 

Notez s'il vous plaît: Vous ne pouvez pas utiliser les deux!

La fonction pour soumettre les entrées

Nous pourrions créer et utiliser une table de base de données différente pour contenir les soumissions des pétitions, mais je ne pense pas que ce soit une bonne pratique. Et hé, qu'est-ce qui ne va pas avec les champs personnalisés??

 // soumet le signataire avec une clé méta 'petition_submission' à la soumission de la fonction de publication ($ name, $ email, $ date) global $ post; $ array = array ('name' => $ name, 'email' => $ email, 'date' => $ date); $ petition_meta = serialize ($ array); add_post_meta ($ post-> ID, 'petition_submission', $ petition_meta); retourne vrai; 

Comme vous pouvez le lire dans le code;

  • Nous avons pris le $ name, $ email et $ date variables dans la fonction (à partir du shortcode auquel nous arriverons dans une minute)
  • Rassemblez les trois variables en créant un tableau et en le sérialisant
  • Et enregistré les données en tant que champ personnalisé nommé 'pétition_submission'

Simple, non? Maintenant nous pouvons arriver à la un peu difficile partie.

La fonction pour récupérer les soumissions

Nous pouvons maintenant sauvegarder les soumissions, mais comment allons-nous les obtenir et faire quelque chose avec elles? Voici comment:

 // récupère les soumissions de la fonction post get_the_submissions ($ number = 5) $ petition_meta = get_post_custom_values ​​('petition_submission'); if ($ petition_meta) $ output = array_slice ($ petition_meta, $ number * -1); return array_reverse ($ output); 

Rappelez-vous quand j'ai dit que ça va être un peu difficile? J'ai menti:

  • Nous avons assigné les valeurs du post metas avec le 'petition_submission'clé d'une variable de tableau
  • Puis nous avons eu numéro $ (5 par défaut) de soumissions à partir de la fin du tableau (remarquez le -1)
  • Et nous sommes retournés le renversé liste de ce tableau en tranches pour le commander du plus récent au plus ancien

Extra: Sélecteurs CSS à utiliser

Nous allons utiliser des sélecteurs CSS dans le code, alors mettez-les dans votre style.css fichier de votre thème:

 #petition_form  #petition_form label font-weight: bold; taille de police: plus grande; hauteur de ligne: 150%;  #petition_form input display: block; marge: 5px 0; rembourrage: 3px;  #petition_name width: 200px;  #petition_email width: 200px;  #petition_submit padding: 5px;  .petition_success color: # 693;  .petition_error color: # A00;  .petition_list list-style: none; marge: 0; rembourrage: 0;  .petition_list li background-image: none! important;  .petition_list span display: inline-block; largeur: 45%; rembourrage: 1%; marge: 1%; couleur de fond: #FAFAFA;  .submission_name  .submission_date font-style: italic; couleur: # 888; 

N'hésitez pas à éditer les valeurs par défaut des propriétés :)


Codes courts

Nous avons complété les fonctions d'assistance et le code CSS. Passons maintenant à la partie amusante - les codes abrégés!

Nous pourrions faire avec un seul grand shortcode pour joindre le formulaire, lister les entrées et montrer le nombre de soumissions mais… pourquoi tuer tout le plaisir? De plus, des codes courts séparés pour ces trois éléments nous permettraient de les utiliser n'importe où dans notre contenu..

T'ai-je dit comment je amour codes courts?

Le Shortcode pour le formulaire de pétition

Cette fonction est longue, je vais donc expliquer le code dans le code, avec des commentaires PHP:

 function petition_form_sc ($ atts) // extrait les paramètres de shortcode extract (shortcode_atts (array (// la valeur de texte du bouton d'envoi 'submit' => 'Soumettre'), // le texte du message d'erreur 'error' => 'Votre adresse e-mail n'est pas valide. Veuillez saisir à nouveau le formulaire avec un nom et une adresse e-mail valides.', // le texte lorsque la soumission est réussie 'success' => 'Votre soumission a été enregistrée. Merci vous! '), $ atts)); // les éléments HTML de notre formulaire de pétition $ form = '
'; // si le formulaire est "POST" ed… if ($ _SERVER ['REQUEST_METHOD'] == 'POST') //… récupère le nom… $ name = $ _POST ['petition_name']; //… et l'adresse e-mail… $ email = $ _POST ['petition_email']; //… et la date de "tout à l'heure", avec le format de date de vos options WP. $ date = date (get_option ('date_format')); // validez d'abord l'adresse e-mail! if (validate_email ($ email) == true) // l'adresse e-mail est valide! rappelez-vous la fonction ci-dessous? soumission ($ nom, $ email, $ date); // nous avons envoyé les variables avec la fonction submission (), maintenant nous imprimons le message de réussite SANS LA FORME: return '
'. $ succès. '
'; // (si vous souhaitez que le formulaire soit imprimé à nouveau après la soumission, ajoutez simplement. $ formulaire avant le point-virgule.) else // l'adresse de messagerie n'est PAS valide! nous devrions imprimer le message d'erreur AVEC LE FORMULAIRE: return '
'. $ erreur. '
'. $ forme; // et si le formulaire n'est pas "POST" ed (signifiant que le visiteur vient de visiter la page), affichez simplement le formulaire! else return $ form; add_shortcode ('petition_form', 'petition_form_sc');

J'ai essayé d'être aussi clair que possible, mais si vous croyez avoir oublié quelque chose, n'hésitez pas à me demander en commentant cet article.!

Le Shortcode pour la liste des soumissions

La partie "dernières entrées" est la partie preuve que les gens se joignent à votre cause, nous devons donc énumérer au moins un certain nombre de soumissions.

Ce n'est pas une fonction courte non plus, donc je vais encore expliquer le code avec des commentaires:

 function petition_list_sc ($ atts) // extrait les paramètres de shortcode extract (shortcode_atts (array (// on pourrait définir un nombre par défaut) mais rappelez-vous, nous l'avions déjà fait dans la fonction get_the_submissions () :) 'nombre' => "), $ atts)); // récupère les dernières soumissions de $ number… $ submit = get_the_submissions ($ number); //… et list 'em! $ output ='
    '; if ($ soumissions) foreach ($ soumissions en tant que $ soumission) // désérialiser les données $ signer = désérialiser ($ soumission); // désérialiser les données AGAIN, je ne sais pas pourquoi… $ signataire = désérialiser ($ signataire); // vous voudrez peut-être changer cette partie, mais le format par défaut a fière allure avec le CSS dans ce tutoriel. $ output. = '
  • '; $ output. = ''. $ signataire ['nom']. ''; $ output. = ''. $ signataire ['date']. ''; $ output. = '
  • '; $ output. = '
'; return $ output; add_shortcode ('petition_list', 'petition_list_sc');

Encore une fois, n'hésitez pas à demander tout ce que vous voulez demander en commentant cet article..

Le Shortcode pour le nombre de pétitions

C'est une très petite fonction, juste pour avoir le nombre d'entrées soumises:

 fonction petition_count_sc () $ petition_meta = get_post_custom_values ​​('petition_submission'); nombre de retour ($ petition_meta);  add_shortcode ('petition_count', 'petition_count_sc');

Comme vous pouvez le voir, il jette simplement les champs personnalisés dans un tableau et le compte et renvoie le nombre.


Conclusion

Je tiens à souligner qu’il s’agit d’un exemple très simple pour montrer aux organisations qu’elles peuvent tirer parti de WordPress en utilisant des scripts tels que ceux-ci. Si vous pouvez penser à une amélioration de ce script (ou de ce tutoriel), veuillez partager vos impressions dans les commentaires ci-dessous. Merci d'avoir lu!