Les formulaires de dons caritatifs peuvent être personnalisés de diverses manières grâce à l'API interne de Charitable. L'une des fonctionnalités les plus demandées est d'ajouter un ou plusieurs champs personnalisés au formulaire de don Charitable. Dans cet article, nous allons vous montrer quelques exemples d'ajout de champs personnalisés avec des extraits de code.
Même si vous n'êtes pas développeur, l'ajout d'extraits de code est facile. Vous avez la possibilité d'installer un plugin d'extraits de code de votre choix, mais comme Charitable fonctionne très bien avec WPCode... nous supposerons que vous l'utilisez pour cet article.
Note : Si vous ÊTES développeur, vous savez que les extraits de code peuvent être ajoutés au functions.php d'un thème WordPress ou dans son propre plugin... si vous choisissez cette voie, nous vous recommandons de suivre nos instructions sur les meilleures pratiques pour écrire du code avec Charitable. Vous devriez également consulter notre documentation Charitable_Donation_Field.
Utilisation de WPCode
La première étape consiste à installer WPCode lui-même. Vous pouvez installer et activer la version gratuite comme vous le feriez avec n'importe quel autre plugin WordPress. Cependant, Charitable dispose d'un processus intégré plus simple. Veuillez lire notre documentation sur l'installation et la navigation dans les extraits de code avec WPCode.
N'oubliez pas qu'une fois ajouté (via l'écran d'extrait Charitable ou en copiant-collant le code) dans WPCode, vous devez lui donner un titre descriptif, vous assurer que le type de code est « extrait PHP », et que vous avez sélectionné l'insertion automatique/exécution partout. Rendez l'extrait actif/activé. Voici un exemple :

Ajout d'une case à cocher
L'extrait de code pour une seule case à cocher n'est pas très différent de celui d'un champ de texte. Remarquez l'utilisation de « checkbox » comme « type ». Vous pouvez également consulter ce code dans notre bibliothèque d'extraits WPCode.
/**
* Collect a checkbox field in the donation form.
*
* This snippet only works in Charitable 1.5 or above.
*
* Related examples:
*
* @see Register a text field (detailed example) - https://github.com/Charitable/library/blob/master/donation-form/register-new-donation-field-1.5.php
* @see Register multiple fields - https://github.com/Charitable/library/blob/master/donation-form/register-multiple-donation-fields.php
* @see The old way to add fields - https://github.com/Charitable/library/blob/master/donation-form/legacy/add-checkbox-field-to-donation-form.php
*/
function wpchar_charitable_register_new_checkbox_field() {
if ( ! class_exists("Charitable_Donation_Field" ) ) {
return;
};
/**
* Define a new checkbox field.
*/
$field = new Charitable_Donation_Field( 'new_checkbox_field', array(
'label' => __( 'New Checkbox Field', 'charitable' ),
'data_type' => 'user',
'donation_form' => array(
'type' => 'checkbox',
'show_before' => 'phone',
'required' => false,
),
'admin_form' => true,
'show_in_meta' => true,
'show_in_export' => true,
'email_tag' => array(
'description' => __( 'The new checkbox field' , 'charitable' ),
),
) );
/**
* Register the checkbox field.
*/
charitable()->donation_fields()->register_field( $field );
}
add_action( 'init', 'wpchar_charitable_register_new_checkbox_field' );
Voici les champs clés à personnaliser :
- Libellé. Changez le texte « Mon champ personnalisé » entre guillemets par ce que vous voulez que les donateurs voient sur le formulaire de don public.
- donation_form -> type. C'est le type de champ de don (texte, sélection, case à cocher, sélecteur de date, etc.). Consultez notre documentation pour une liste complète des types de champs de don pris en charge.
- donation_form -> required. Si vous souhaitez que ce champ soit obligatoire, définissez-le sur true.
- email_tag. Si vous souhaitez inclure la valeur saisie dans ce champ dans votre e-mail avec une balise d'e-mail dans Charitable, ajoutez une description ici afin de la voir apparaître dans les paramètres de l'e-mail. Par défaut, Charitable utilise la valeur de la clé comme balise (« my_custom_field » dans ce cas).
Une fois ce code (via l'écran d'extrait Charitable ou en copiant-collant le code) dans WPCode, assurez-vous de lui donner un titre descriptif, de vous assurer que le type de code est « extrait PHP », et que vous avez sélectionné l'insertion automatique/exécution partout. Rendez l'extrait actif/activé.
Une fois celui-ci actif, visitez un formulaire de don (généré automatiquement par Charitable ou via un shortcode) et vous devriez voir votre case à cocher. 🎉
Plusieurs cases à cocher
L'ajout de plusieurs cases à cocher nécessite l'ajout d'« options » au fragment et la modification du type en « multi-checkbox ».
Le script ci-dessous ajoute DES CASES À COCHER MULTIPLES (en utilisant « multi-checkbox » et peut également être trouvé dans notre bibliothèque de fragments WPCode et vous pouvez également consulter d'autres exemples plus concrets d'utilisation de cases à cocher qui ajoutent un peu plus de logique, comme cet exemple d'ajout d'une case à cocher de refus de reçu de don).
/**
* Add three checkboxes (the same group) in the donation form.
*
* This snippet only works in Charitable 1.5 or above.
*
*/
function wpchar_charitable_register_new_checkboxes_field() {
if ( ! class_exists("Charitable_Donation_Field" ) ) {
return;
};
/**
* Define a new checkbox field.
*/
$field = new Charitable_Donation_Field( 'new_checkboxes_field', array(
'label' => __( 'New Checkboxes Field', 'charitable' ),
'data_type' => 'user',
'donation_form' => array(
'type' => 'multi-checkbox',
'show_before' => 'phone',
'required' => false,
'options' => array (
'option_1_value' => 'Option One',
'option_2_value' => 'Option Two',
'option_3_value' => 'Option Three',
),
),
'admin_form' => true,
'show_in_meta' => true,
'show_in_export' => true,
'email_tag' => array(
'description' => __( 'The new checkbox field' , 'charitable' ),
),
) );
/**
* Register the checkbox field.
*/
charitable()->donation_fields()->register_field( $field );
}
add_action( 'init', 'wpchar_charitable_register_new_checkboxes_field' );
Cela devrait apparaître comme ceci sur votre formulaire de don :






Laisser un commentaire