WC Vendors heeft een formulierhulplijnklasse die het mogelijk maakt om de frontend te genereren uit gedefinieerde velden. Deze worden gebruikt op alle formulieren die door WC Vendors Pro worden aangeboden. Dit kunnen aangepaste meta- of bestaande meta-velden van plug-ins van derden zijn. Alle formuliervelden worden gedefinieerd met een statische aanroep naar de formulierhulplijnklasse en het parsen van een array met opties. Alle voorbeeldcode om het veld te laten functioneren wordt meegeleverd, inclusief het definiëren van het veld, het opslaan van het veld en het weergeven ervan op een relevant formulier.
Alle frontend formulieren ondersteunen de automatische vastlegging en opslag van aangepaste meta-velden als ze een vooraf gedefinieerd voorvoegsel gebruiken voor de meta-sleutel die relevant is voor het formulier dat u wilt aanpassen. Tenzij u een reden heeft om uw benoemde meta-sleutels te definiëren, wordt het sterk aanbevolen om onze automatische geïntegreerde code te gebruiken om uw nieuwe formuliervelden op te slaan.
Ondersteunde velden
Er zijn verschillende velden die worden ondersteund door de formulierhelper, wat het genereren van formuliervelden binnen onze frontend gemakkelijker maakt. Alle formulieren in WC Vendors Pro gebruiken dit systeem om de formuliervelden op de frontend weer te geven. Er zijn een paar vereiste velden om een veld te genereren, terwijl er optionele velden zijn die flexibiliteit bieden over wat er wordt weergegeven.
Formulierhelper Velden
- Input ( text, hidden, checkbox )
- TextArea
- Select
- Select2
- Geneste selectie
- Land Selectie
- Verzendknop
- Bestandsuploader
Let op
De volgende coddefinities zijn slechts voorbeelden, en u zult de codevoorbeelden moeten wijzigen om de waarden weer te geven die u nodig heeft.
Invoerveld
WCVendors_Pro_Form_Helper::input()
Dit veldtype wordt gebruikt om een standaard tekstveld, een verborgen tekstveld of een selectievakje weer te geven. Er zijn slechts drie instellingen vereist om het invoerveld weer te geven, terwijl de optionele instellingen u flexibiliteit en controle geven over een reeks verschillende opties. De volgende tabel schetst de verschillende attributen die beschikbaar zijn bij het maken van een invoerveld. Deze worden gedefinieerd als een array van attributen, waarbij het gedefinieerde attribuut de array-sleutel is en de waarde de gewenste uitvoer is.
| Instelling | Vereist | Beschrijving |
| post_id | ja | Dit is de id van het bericht of product waarmee u wilt interageren. |
| id | ja | Dit is de corresponderende meta-sleutel of databaseveld |
| waarde | nee | Dit is de waarde uit de database, als deze niet is gedefinieerd, wordt de id gebruikt om intern get_post_meta() aan te roepen |
| label | nee | Dit is het label dat op de pagina wordt weergegeven |
| klasse | nee | Dit is de HTML-code die de openings-tags voor de wrappercontainer definieert |
| placeholder | nee | Dit is de placeholdertekst die wordt weergegeven |
| wrapper_class | nee | Dit is de klasse voor de wrappercontainer |
| wrapper_start | nee | Dit is de HTML-code die de sluitingstags voor de wrappercontainer definieert |
| wrapper_end | nee | Dit is het veldtype: tekst (standaard), verborgen, checkbox |
| cbvalue | nee | Dit is de waarde van de checkbox, alleen vereist als u het type als checkbox hebt gedefinieerd |
| type | nee | Dit is het veldtype: tekst (standaard), verborgen, checkbox |
| show_label | nee | Hiermee kunt u het label voor de invoer weergeven en verbergen |
Tekstveld
U hoeft het type-attribuut niet in de argumenten op te geven, aangezien dit het standaard veldtype is. De volgende code is een voorbeeld van een tekstinvoer die wordt gedefinieerd, dit toont de producttitel die u op al onze productformulieren ziet. Een tekstveld is het standaard invoertype, daarom hoeft u het type-attribuut hiervoor niet op te geven.
Voorbeeld tekstveld
WCVendors_Pro_Form_Helper::input( array( 'post_id' => $post_id, 'id' => 'post_title', 'label' => __( 'Product Name', 'wcvendors-pro' ), 'value' => $product_title, ) );
Verborgen veld
Verborgen velden worden in formulieren gebruikt om informatie bij uw formulier bij te houden en op te slaan wanneer u geen invoer van de gebruiker nodig hebt. Er zijn momenten waarop integraties met plug-ins van derden dit veldtype vereisen. Dit veldtype kan ook worden gebruikt als u een waarde voor uw verkopers wilt vastleggen, zoals de prijs of categorieën.
Voorbeeld verborgen veld
WCVendors_Pro_Form_Helper::input( array( 'post_id' => $post_id, 'type' => 'hidden', 'id' => 'post_id', 'value' => $post_id ) );
Checkbox
Selectievakjes worden gebruikt in de verschillende formulieren. Gebruik de volgende definitie om een selectievakje te definiëren. Vanwege de manier waarop selectievakjes worden uitgevoerd, wanneer het selectievakje na eerder te zijn aangevinkt, niet is aangevinkt, is een extra stap nodig die vereist dat u de opslagactie van de instellingenpagina of het opslaan van het product haakt om te controleren of de waarde er niet is om deze te verwijderen.
Voorbeeld selectievakje
add_action( 'wcvendors_settings_after_seller_info', 'checkbox_check' );
function checkbox_check(){
$key = '_wcv_custom_settings_checkbox3';
$value = get_user_meta( get_current_user_id(), $key, true );
WCVendors_Pro_Form_Helper::input( apply_filters( $key, array(
'id' => $key,
'label' => __( 'Fairtrade', 'wcvendors-pro' ),
'type' => 'checkbox',
'desc_tip' => true,
'value' => $value,
'description' => __('Check this box if you are fairtrade.', 'wcvendors-pro'),
) )
);
}
function fairtrade( $vendor_id ) {
if ( ! isset( $_POST[ '_wcv_custom_settings_checkbox3' ] ) ){
delete_user_meta( $vendor_id, '_wcv_custom_settings_checkbox3' );
}
}
add_action ('wcv_pro_store_settings_saved','fairtrade');
Tekstgebied
WCVendors_Pro_Form_Helper::textarea()
Het tekstgebiedveld stelt u in staat om tekstgebiedvelden op verschillende formulieren te maken. De volgende tabel schetst de verschillende attributen die beschikbaar zijn bij het maken van een tekstgebiedveld. Deze worden gedefinieerd als een array van attributen, waarbij het gedefinieerde attribuut de array-sleutel is en de waarde de gewenste uitvoer is.
| Instelling | Vereist | Beschrijving |
| post_id | ja | Dit is de id van het bericht of product waarmee u wilt interageren. |
| id | ja | Dit stelt de CSS-klasse in, laat een spatie tussen klassen om er meerdere op te geven |
| waarde | nee | Dit is de waarde uit de database, als deze niet is gedefinieerd, wordt de id gebruikt om intern get_post_meta() aan te roepen |
| label | nee | Dit is het label dat op de pagina wordt weergegeven |
| klasse | nee | Dit is de HTML-code die de openings-tags voor de wrappercontainer definieert |
| placeholder | nee | Dit is de placeholdertekst die wordt weergegeven |
| kolommen | nee | Het aantal kolommen dat het tekstgebied zal hebben |
| rijen | nee | Het aantal rijen dat het tekstgebied zal hebben |
| wrapper_start | nee | Dit is de HTML-code die de sluitingstags voor de wrappercontainer definieert |
| wrapper_end | nee | Dit stelt de CSS-klasse in en laat een spatie tussen klassen om er meerdere op te geven |
| stijl | nee | De stijl tag |
Voorbeeld tekstgebiedveld
WCVendors_Pro_Form_Helper::textarea( apply_filters( 'wcv_product_description', array( 'post_id' => $post_id, 'id' => 'post_content', 'label' => __( 'Product description', 'wcvendors-pro' ), 'value' => $product_description, 'placeholder' => __( 'Please add a full description of your product here', 'wcvendors-pro' ), 'custom_attributes' => $custom_attributes, ) ) );
Select
WCVendors_Pro_Form_Helper::select( )
Het selectieveld stelt u in staat om een eenvoudige dropdown te maken, terwijl u de opties of de taxonomie specificeert om automatisch uit de WordPress-backend te vullen.
Voorbeeld selectieveld
WCVendors_Pro_Form_Helper::select( array( 'post_id' => $post_id, 'id' => '_download_type', 'class' => 'select', 'label' => __( 'Download Type', 'wcvendors-pro' ), 'desc_tip' => 'true', 'description' => sprintf( __( 'Choose a download type - this controls the <a href="%s">http://schema.org</a>.', 'wcvendors-pro' ), 'http://schema.org/' ), 'options' => array( '' => __( 'Standard Product', 'wcvendors-pro' ), 'application' => __( 'Application/Software', 'wcvendors-pro' ), 'music' => __( 'Music', 'wcvendors-pro' ) ), // 'custom_attributes' => $custom_attributes, ) );
Select2
WCVendors_Pro_Form_Helper::select2()
Het select2-veld biedt een verbeterde selectie die meer bruikbaarheid en opties biedt om meerdere waarden te selecteren. Dit kan worden gebruikt om uw eigen opties te definiëren, zoals het bovenstaande selectievoorbeeld, of om aan te sluiten bij een gedefinieerde taxonomie zoals in het onderstaande voorbeeld. Dit maakt gebruik van het populaire select2-framework om dit te bereiken.
Voorbeeld Select2-veld
WCVendors_Pro_Form_Helper::select2( array( 'post_id' => $post_id, 'id' => 'product_cat[]', 'taxonomy' => 'product_cat', 'class' => 'category-select2', 'show_option_none' => $show_option_none, 'taxonomy_args' => array( 'hide_empty' => 0, 'orderby' => 'order', 'exclude' => $exclude, ), 'label' => ( $multiple ) ? __( 'Categories', 'wcvendors-pro' ) : __( 'Category', 'wcvendors-pro' ), ) );
Bestandsuploader
WCVendors_Pro_Form_Helper::file_uploader()
De formulierhelper biedt een basis bestandsoplader waarmee u één bestand per invoer aan het formulier kunt toevoegen. Dit is handig als u extra bestanden aan een product of de winkel wilt toevoegen. Er worden verschillende bestandsformaten ondersteund
- Afbeelding
- Document
- Audio
- Video
De bestandsextensies voor de bovenstaande bestandsformaten worden bepaald op basis van welke bestandstypen uw WordPress-installatie toestaat. Als u het bestandstype voor het tweede argument niet definieert, is het standaardbestandstype 'afbeelding'
Voorbeeld veld voor het uploaden van afbeeldingsbestanden
function wcv_image_uploader( ){
echo '<hr />';
echo '<h3>Image Uploader</h3>';
$value = get_user_meta( get_current_user_id(), '_wcv_custom_settings_image_example', true );
WCVendors_Pro_Form_Helper::file_uploader( array(
'id' => '_wcv_custom_settings_image_example',
'header_text' => __('Image uploader', 'wcvendors-pro' ),
'add_text' => __('Add image file', 'wcvendors-pro' ),
'remove_text' => __('Remove image file', 'wcvendors-pro' ),
'image_meta_key' => '_wcv_custom_settings_image_example',
'save_button' => __('Add image file', 'wcvendors-pro' ),
'window_title' => __('Select an Image', 'wcvendors-pro' ),
'value' => $value
), 'image'
);
}
Voorbeeld van code-uitvoer
Voorbeeld veld voor het uploaden van documentbestanden
function wcv_doc_uploader( ){
echo '<hr />';
echo '<h3>Document Uploader</h3>';
$value = get_user_meta( get_current_user_id(), '_wcv_custom_settings_doc_example', true );
WCVendors_Pro_Form_Helper::file_uploader( array(
'id' => '_wcv_custom_settings_doc_example',
'header_text' => __('Document uploader', 'wcvendors-pro' ),
'add_text' => __('Add document', 'wcvendors-pro' ),
'remove_text' => __('Remove document', 'wcvendors-pro' ),
'file_meta_key' => '_wcv_custom_settings_doc_example',
'save_button' => __('Add document', 'wcvendors-pro' ),
'window_title' => __('Select a document', 'wcvendors-pro' ),
'value' => $value
), 'document'
);
}
Voorbeeld van code-uitvoer
Voorbeeld veld voor het uploaden van audiobestanden
function wcv_audio_uploader( ){
echo '<hr />';
echo '<h3>Audio Uploader</h3>';
$value = get_user_meta( get_current_user_id(), '_wcv_custom_settings_audio_example', true );
WCVendors_Pro_Form_Helper::file_uploader( array(
'id' => '_wcv_custom_settings_audio_example',
'header_text' => __('Audio uploader', 'wcvendors-pro' ),
'add_text' => __('Add audio', 'wcvendors-pro' ),
'remove_text' => __('Remove audio', 'wcvendors-pro' ),
'file_meta_key' => '_wcv_custom_settings_audio_example',
'save_button' => __('Add audio', 'wcvendors-pro' ),
'window_title' => __('Select audio', 'wcvendors-pro' ),
'value' => $value
), 'audio'
);
}
Voorbeeld van code-uitvoer
Voorbeeld veld voor het uploaden van videobestanden
function wcv_video_uploader( ){
echo '<hr />';
echo '<h3>Video Uploader</h3>';
$value = get_user_meta( get_current_user_id(), '_wcv_custom_settings_video_example', true );
WCVendors_Pro_Form_Helper::file_uploader( array(
'id' => '_wcv_custom_settings_video_example',
'header_text' => __('Video uploader', 'wcvendors-pro' ),
'add_text' => __('Add video', 'wcvendors-pro' ),
'remove_text' => __('Remove video', 'wcvendors-pro' ),
'file_meta_key' => '_wcv_custom_settings_video_example',
'save_button' => __('Add video', 'wcvendors-pro' ),
'window_title' => __('Select video', 'wcvendors-pro' ),
'value' => $value
), 'video'
);
}
Voorbeeld van code-uitvoer
Automatisch opslaan van velden
Om te profiteren van onze automatische functie voor het opslaan van velden, moet u uw aangepaste metatags definiëren met onze vooraf gedefinieerde voorvoegsels. Alle voorvoegsels die beginnen met een '_' worden verborgen voor het bewerkingsformulier in het WordPress-dashboard. Als u wilt dat het veld op de backend wordt weergegeven zodat beheerders het kunnen bewerken, laat dan de underscore weg van het voorvoegsel.
Wat betekent dit? Het betekent dat als u uw formulierveld definieert en de id begint met het relevante voorvoegsel hieronder, de formuliercontroller de metatag automatisch opslaat.
Beschikbare voorvoegsels voor veldtypen
| Formuliernaam | Voorvoegsel Naam | Voorbeeld |
| Product | _wcv_custom_product_ | _wcv_custom_product_ingredients |
| Product | wcv_custom_product_ | wcv_custom_product_delivery_time |
| Instellingen & Aanmelding | _wcv_custom_settings_ | _wcv_custom_settings_bankname |
| Instellingen & Aanmelding | wcv_custom_settings_ | wcv_custom_settings_bankname |
| Kortingsbon | _wcv_coupon_post_meta_ | _wcv_coupon_post_meta_newfield |
Voorbeeld Automatisch Opslaan Productveld
WCVendors_Pro_Form_Helper::input( array( 'post_id' => $object_id, 'id' => '_wcv_custom_product_ingredients', 'label' => __( 'Ingredients', 'wcvendors-pro' ), 'placeholder' => __( 'Ingredients', 'wcvendors-pro' ), 'desc_tip' => 'true', 'description' => __( 'The product ingredients', 'wcvendors-pro' ), ) );
Voorbeeld Automatisch Opslaan Formulierveld Instellingen & Aanmelding
add_action( 'wcvendors_settings_after_seller_info', 'checkbox_check' );
function checkbox_check(){
$key = '_wcv_custom_settings_checkbox3';
$value = get_user_meta( get_current_user_id(), $key, true );
WCVendors_Pro_Form_Helper::input( apply_filters( $key, array(
'id' => $key,
'label' => __( 'Fairtrade', 'wcvendors-pro' ),
'type' => 'checkbox',
'desc_tip' => true,
'value' => $value,
'description' => __('Check this box if you are fairtrade.', 'wcvendors-pro'),
) )
);
}
Dit werkt voor elk veldtype dat geen multi-select is.
Taxonomie Opslaan
Als je een aangepaste taxonomie hebt gedefinieerd, ondersteunen we het automatisch opslaan hiervan. Het enige wat je hoeft te doen is de veld-ID definiëren met hetzelfde formaat als individuele velden. De taxonomie naam blijft wat je hebt gedefinieerd bij het registreren van de taxonomie. Je hoeft deze voorvoegsels alleen te gebruiken voor de veldnamen op het formulier.
| Formuliernaam | Voorvoegsel Naam | Voorbeeld |
| Product | _wcv_custom_taxonomy_ | _wcv_custom_taxonomy_subjects |
| Product | wcv_custom_taxonomy_ | wcv_custom_taxonomy_subjects |
Voorbeeld Automatisch Opslaan Product Taxonomie
Het volgende is een voorbeeld van een aangepast gedefinieerde taxonomie.
WCVendors_Pro_Form_helper::select2( array(
'post_id' => $object_id,
'id' => '_wcv_custom_taxonomy_subjects[]',
'class' => 'select2',
'custom_tax' => true,
'label' => __('Subjects', 'wcvendors-pro'),
'show_option_none' => __('Select Subject(s)', 'wcvendors-pro'),
'taxonomy' => 'subjects',
'taxonomy_args' => array(
'hide_empty' => 0,
),
'custom_attributes' => array( 'multiple' => 'multiple' ),
)
);
Acties
Elke formulierinvoer heeft een _before_ en _after_ actie waarmee je kunt inhaken op het formulier voordat of nadat het element wordt gerenderd. Alle hierboven gedefinieerde formuliertypen bieden deze toegang. De veld-ID wordt aan het einde van de acties toegevoegd, zodat je specifieke gedefinieerde velden kunt targeten.
Acties Voor
| Veld | Actie |
| input | do_action( ‘wcv_form_input_before_’. $field[ ‘id’ ], $field ); |
| select | do_action( ‘wcv_form_select_before_’. $field[ ‘id’ ], $field ); |
| select2 | do_action( ‘wcv_form_select2_before_’. $field[ ‘id’ ], $field ); |
| nested_select | do_action( ‘wcv_form_nested_select_before_’. $field[ ‘id’ ], $field ); |
| textarea | do_action( ‘wcv_form_textarea_before_’. $field[ ‘id’ ], $field ); |
| product_media_uploader | do_action( ‘wcv_form_product_media_uploader_before_product_media_uploader’, $post_id ); |
| file_uploader | do_action( ‘wcv_form_file_uploader_before_’. $field[ ‘id’ ], $field ); |
| submit | do_action( ‘wcv_form_submit_before_’. $field[ ‘id’ ], $field ); |
| country_select2 | do_action( ‘wcv_form_country_select2_before_’. $field[ ‘id’ ], $field ); |
| wcv_terms_checklist | do_action( ‘wcv_form_wcv_terms_checklist_before_’. $field[ ‘id’ ], $field ); |
| custom_field | do_action( ‘wcv_form_custom_field_before_’. $field[ ‘id’ ], $field ); |
Acties Na
| Veld | Actie |
| input | do_action( ‘wcv_form_input_after_’. $field[ ‘id’ ], $field ); |
| select | do_action( ‘wcv_form_select_after_’. $field[ ‘id’ ], $field ); |
| select2 | do_action( ‘wcv_form_select2_after_’. $field[ ‘id’ ], $field ); |
| nested_select | do_action( ‘wcv_form_nested_select_after_’. $field[ ‘id’ ], $field ); |
| textarea | do_action( ‘wcv_form_textarea_after_’. $field[ ‘id’ ], $field ); |
| product_media_uploader | do_action( ‘wcv_form_product_media_uploader_after_product_media_uploader’, $post_id ); |
| file_uploader | do_action( ‘wcv_form_file_uploader_after_’. $field[ ‘id’ ], $field ); = |
| submit | do_action( ‘wcv_form_submit_after_’. $field[ ‘id’ ], $field ); |
| country_select2 | do_action( ‘wcv_form_country_select2_after_’. $field[ ‘id’ ], $field ); |
| wcv_terms_checklist | do_action( ‘wcv_form_wcv_terms_checklist_after_’. $field[ ‘id’ ], $field ); |
| custom_field | do_action( ‘wcv_form_custom_field_after_’. $field[ ‘id’ ], $field ); |
Voorbeeld
Als u de ID van het veld weet, kunt u de actie gebruiken. De ID van het veld Posttitel is bijvoorbeeld post_title, dus de acties ervoor en erna zouden als volgt zijn. U zou dan de informatie definiëren om ervoor of erna uit te voeren, met de geparseerde functies.
add_action( ‘wcv_form_input_before_post_title’, ‘add_field_before_post_title’ );
add_action( 'wcv_form_input_before_post_title', 'add_field_before_post_title' ); add_action( 'wcv_form_input_after_post_title', 'add_field_after_post_title');