Gravity Perks

Wat is Gravity Perks?

Gravity Perks is een verzameling add-ons (ook wel “perks” genoemd) voor Gravity Forms, de populaire WordPress-plugin voor het maken van formulieren. De set is onderdeel van GravityWiz. Deze add-ons breiden de functionaliteit van Gravity Forms uit en maken het mogelijk om geavanceerde functies en aanpassingen eenvoudig te implementeren zonder verder zelf code te moeten kennen.

Gravity Perks

Met Gravity Perks kun je veel extra functies toevoegen aan je Gravity Forms formulieren. Wat denk je bijvoorbeeld van het koppelen van je formulieren aan Google Spreadsheet? Of het automatisch bijwerken van bepaalde velden op basis van de url waar een bezoeker vandaan komt?

Je kunt per gewenste optie een add-on installeren. Wat kun je met Gravity Perks? Een deel van de mogelijkheden:

Voorwaardelijke logica toevoegen aan velden en bevestigingen.
Gegevens van formulieren automatisch laten bijwerken op basis van andere invoer.
Inzendingen op basis van formulier- of veldwaarden laten beperken.
Betalingsgateways en multi-step formulieren toevoegen.
Dynamische veldbeperkingen en aanmeldingen voor e-mailintegraties beheren.

Wat kost Gravity Perks?

Gravity Perks is beschikbaar via een jaarlijks abonnementssysteem. De prijzen variëren afhankelijk van het aantal WordPress websites en de functies die je nodig hebt. Een individueel pakket begint bij $59 per jaar voor één website, terwijl een “Ultimate” pakket voor onbeperkte websites $299 per jaar kost.

Meer informatie en een volledig overzicht van de functies en prijzen vind je op de Gravity Perks website.

Je kent Gravity Forms. En misschien ken je Gravity Perks ook? Als je de mogelijkheden van Gravity Forms uit wilt breiden kun je gebruik maken van snippets. Kleine stukjes code waarmee je functionaliteit beïnvloed of toevoegt.

Gravity Forms snippets

Snippets zijn te vinden via Google. Nog gemakkelijker is de Gravity Forms snippets library van Gravitywiz. In deze online database vind je meer dan 900+ kant en klare snippets inclusief de uitleg. Direct te kopiëren voor in jouw WordPress website.

Wil je bijvoorbeeld checken of alle verplichte checkboxen aangevinkt zijn of dat het adres op de juiste manier ingevuld is. Daar is een snippet voor. Je plaatst de snippets in de functions.php van je thema of in de Code Snippets plugin bijvoorbeeld.

Bekijk de snippet library

Als je jouw database op wilt schonen dan kun je dit met een plugin doen. Als je gebruik maakt van WooCommerce kan het zijn dat je een grote tabel hebt met geplande en afgeronden acties aangezien WooCommerce regelmatig standaard acties uitvoert en dit logt.

Met een eenvoudig SQL commando via PHPMyadmin kun je alle logs die WP-Cron heeft gemaakt met de status mislukt, geannuleerd en compleet wissen. Je kunt deze acties bekijken via WooCommerce > Status > Scheduled actions.

Schedules actions via SQL verwijderen

Het volgende SQL commando zal alle rijen uit de database verwijderen met deze statussen van wp_actionscheduler_actions:


DELETE FROM `wp_actionscheduler_actions` WHERE `status` IN ('complete','failed','canceled')

Om de gehele wp_actionscheduler_logs te legen voer het volgende SQL commando uit:


TRUNCATE `wp_actionscheduler_logs`

Wil je een extra tabblad bij een WooCommerce product toevoegen? Dit kan met een WordPress plugin uiteraard. Maar met een paar regels code in je functions.php is het ook opgelost.

Tab toevoegen WooCommerce product

Om een tab toe te voegen kun je gebruik maken van de woocommerce_product_tabs filter hook voor WooCommerce.

add_filter( 'woocommerce_product_tabs', 'custompft_add_tabs' );

/**
 *
 * Custom product tab toevoegen.
 *
 */
function lmpr_add_tabs( $tabs ) {
	$tabs['lmpr_content'] = array(
		'title'    => __( 'NAAM TAB', 'text-domain' ),
		'priority' => 50,
		'callback' => 'lmpr_tab_content',
	);

	return $tabs;
}

/**
 * Tab content.
 */
function lmpr_tab_content() {
	$lmpr_content = get_post_meta( get_the_ID(), '_lmpr_product_lmpr_content', true );
?>

Als je een WooCommerce webshop hebt kan het zijn dat je op verschillende plaatsen bijvoorbeeld producten wilt tonen. Dit kunnen producten zijn met een tag, uit een bepaalde productcategorie of met een specifieke attribuut of kleur.

WooCommerce shortcodes voordelen

Shortcodes maken het mogelijk om snel producten, categorieën, winkelwagens, en meer toe te voegen aan je website. Ze besparen tijd en moeite omdat je geen ingewikkelde code hoeft te schrijven. Shortcodes zijn flexibel en aanpasbaar, wat betekent dat je de lay-out en presentatie van je inhoud kunt afstemmen op de behoeften van je webshop. Bovendien zijn ze eenvoudig te gebruiken en integreren ze goed met verschillende thema’s en plugins.

Nadelen van WooCommerce shortcodes

Een van de nadelen is dat WooCommerce shortcodes soms beperkend kunnen zijn in termen van aanpassingsmogelijkheden. Voor zeer specifieke of complexe aanpassingen kan het nodig zijn om extra code of een WordPress plugin te gebruiken. Daarnaast kunnen te veel shortcodes op een pagina de laadtijd beïnvloeden, wat kan leiden tot een minder optimale gebruikerservaring. Het is ook belangrijk om ervoor te zorgen dat je thema en plugins up-to-date zijn om compatibiliteitsproblemen te voorkomen.

Meer over WooCommerce shortcodes inclusief praktische voorbeelden vind je in dit artikel.

Er zijn twee manieren om in de WooCommerce checkout een veld toe te voegen. De makkelijke optie is de no-code oplossing van een plugin. En verder in dit artikel vind je de uitleg hoe je dit kunt doen zonder een plugin.

No-code oplossingen

Je kunt eenvoudig aangepaste afrekenvelden toevoegen met gratis plugins zoals:

Code oplossingen

Om afrekenvelden aan te passen zonder WordPress plugin, gebruik je de filterhook woocommerce_checkout_fields. Deze hook is gedefinieerd in woocommerce/includes/class-wc-checkout.php:300 en bevat slechts één parameter.

Elk veld moet een array zijn en bevat enkele sleutels zoals:

label: Tekst die als label van het veld wordt weergegeven
id: Unieke id
priority: Nummer voor de volgorde van weergave
type: Type invoerveld (tekst, nummer, select, checkbox)
class: Klassen voor styling (bijv. form-row-wide, form-row-first)
required: Boolean waarde, veld vereist of niet
description: Informatie na het invoerveld
custom_attributes: Extra HTML-attributen als key-value paren

Tekstveld in de WooCommerce checkout


add_filter( 'woocommerce_checkout_fields', 'change_checkout_fields' );

function change_checkout_fields( $fields ) {
	$fields['billing']['custom_field_license'] = array(
		'label'       => __( 'License Code', 'custom-text-domain' ),
		'class'       => array( 'form-row-wide' ),
		'required'    => true,
		'placeholder' => __( 'Please insert license code', 'custom-text-domain' ),
		'id'          => 'custom_field_license',
		'priority'    => 40,
	);
	return $fields;
}

Nummer veld in de WooCommerce checkout


$fields['billing']['custom_randon_value'] = array(
 'type'              => 'number',
 'label'             => __( 'Random Number', 'custom-text-domain' ),
 'required'          => true,
 'class'             => array( 'form-row-wide' ),
 'description'       => __( 
 'Please insert random number (1-25)', 'custom-text-domain' ),
 'custom_attributes' => array(
 'min' => 1,
 'max' => 25,
 ),
 'id'                => 'custom_randon_value',
 'priority'          => 40,
 );

Selectieveld in de WooCommerce checkout


$fields['billing']['custom_field_license_type'] = array(
 'type'        => 'select',
 'class'       => array( 'form-row-wide' ),
 'input_class' => array( 'country_select' ),
 'label'       => __( 'License Type', 'custom-text-domain' ),
 'required'    => true,
 'placeholder' => __( 'Please choose license type', 'custom-text-domain' ),
 'options'     => array(
 'basic'      => __( 'Basic', 'custom-text-domain' ),
 'enterprise' => __( 'Enterprise', 'custom-text-domain' ),
 ),
 'id'          => 'custom_field_license_type',
 'priority'    => 41,
 );

Extra velden WooCommerce checkout opslaan

Voeg deze code toe in de functions.php van je WordPress thema of de Code Snippets plugin.


add_action( 'woocommerce_checkout_update_order_meta', 'save_data' );

function save_data( $order_id ) {

	if ( ! isset( $_POST['custom_field_license'] ) ) {
		return;
	}

	$license = sanitize_text_field( $_POST['custom_field_license'] );
	update_post_meta( $order_id, '_order_custom_license', $license );
}

Extra velden WooCommerce bestelling zichtbaar maken

Voeg deze code toe in de functions.php van je WordPress thema of de Code Snippets plugin.


add_action( 
 'woocommerce_admin_order_data_after_billing_address', 
 'display_custom_data' 
);  function display_custom_data( $order ) {
 $license = $order->get_meta( '_order_custom_license', true );
 ?>
:


<?php }

Wat is Google reCAPTCHA?

reCAPTCHA is een beveiligingsdienst die door Google is ontwikkeld om te bepalen of een gebruiker een mens of een bot is. Het helpt websites te beschermen tegen spam en misbruik door geautomatiseerde software te blokkeren. reCAPTCHA analyseert gebruikersgedrag en verschillende signalen om vast te stellen of de interactie legitiem is.

reCAPTCHA v2 en v3

reCAPTCHA v2

Deze versie vraagt gebruikers om een specifieke taak uit te voeren, zoals het aanklikken van afbeeldingen die aan bepaalde criteria voldoen of het aanvinken van een “Ik ben geen robot”-vakje. Dit vereist directe interactie van de gebruiker om de menselijke aanwezigheid te bevestigen.

reCAPTCHA v3

De reCAPTCHA v3 versie, gelanceerd op 29 oktober 2018, verbetert de gebruikerservaring door het elimineren van interactieve uitdagingen zoals het klikken op afbeeldingen of selectievakjes. In plaats daarvan werkt reCAPTCHA v3 op de achtergrond, waar het gebruikersgedrag analyseert en een score tussen 0,0 en 1,0 toekent om de waarschijnlijkheid te bepalen dat een gebruiker menselijk is. Deze score helpt websitebeheerders bij het nemen van passende maatregelen, zoals het vereisen van extra verificatiestappen of het naadloos toestaan van toegang.

Deze versie werkt zonder gebruikersinteractie. Het analyseert het gedrag van de gebruiker op de achtergrond en geeft een score van 0,0 tot 1,0, waarbij een hogere score aangeeft dat de gebruiker waarschijnlijk menselijk is. Dit zorgt voor een naadloze gebruikerservaring zonder onderbrekingen.

reCAPTCHA-sleutels aanmaken

Om reCAPTCHA te integreren in je WordPress website, heb je twee sleutels nodig: een site-sleutel en een geheime sleutel. Deze sleutels worden door Google eenmalig na het aanmaken verstrekt en zijn essentieel voor de werking van reCAPTCHA op je website.

De stappen om aan de sleutels te komen zijn:

Ga naar de reCAPTCHA-website: Bezoek de reCAPTCHA-website en klik op de knop “Admin Console” om je aan te melden bij je Google-account.
Registreer je website: Eenmaal ingelogd, zie je een formulier om je website te registreren. Vul de volgende gegevens in:
- Label: Geef een naam aan je reCAPTCHA (bijvoorbeeld “Lamper Design reCAPTCHA”).
- reCAPTCHA-type: Kies tussen reCAPTCHA v3, reCAPTCHA v2 (“I’m not a robot” Checkbox) of een andere versie afhankelijk van je behoefte.
- Domeinen: Voeg de domeinen toe waarop je reCAPTCHA wilt gebruiken. Dit kunnen meerdere domeinen zijn.
- E-mailadressen: Voeg extra eigenaars toe als je wilt dat anderen ook toegang hebben tot de reCAPTCHA-instellingen.
Accepteer de servicevoorwaarden: Vink het vakje aan om akkoord te gaan met de reCAPTCHA-servicevoorwaarden.
Verzenden: Klik op de knop “Verzenden” om de registratie te voltooien.
Krijg je sleutels: Na succesvolle registratie ontvang je een site-sleutel en een geheime sleutel. Deze sleutels worden weergegeven op de volgende pagina.
Implementeer reCAPTCHA op je website:
- Site-sleutel: Voeg deze sleutel toe aan de HTML-code van je website waar je reCAPTCHA wilt weergeven.
- Geheime sleutel: Gebruik deze sleutel in je server-side code om de reCAPTCHA-respons te verifiëren.

Voor gedetailleerde instructies over het implementeren van reCAPTCHA in verschillende programmeertalen en platforms, kun je de officiële documentatie van Google raadplegen.

Als je een WordPress website hebt dan heb je een aantal zaken nodig om deze zichtbaar te maken voor het grote publiek. Dit zijn in ieder geval:

Een hosting pakket op een server bij een hosting provider;
Een domeinnaam.

Het hostingpakket moet gekoppeld zijn via DNS aan de domeinnaam. Je hoeft de domeinnaam niet te registreren bij dezelfde provider waar je ook je hostingpakket afneemt. Als voorbeeld, veel van onze klanten nemen een hostingpakket van ons af bij Kinsta en hebben hun domeinnaam in eigen beheer bij een andere provider. Via de DNS instellingen van het A-record kunnen wij hun domeinnaam laten verwijzen naar onze servers.

Als je wilt weten of een .nl domeinnaam nog vrij is dan kun je dit o.a. controleren bij de SIDN. Mocht een domeinnaam niet meer vrij zijn dan kun je hier vaak ook zien wie de registrant is.

Domeinnaam registreren

Wat heb je nodig om een domeinnaam te registreren? Dit is afhankelijk van de domeinnaam extensie die je kiest. In principe zijn er honderden providers beschikbaar waar je een domein kunt registeren. Wij registreren onze domeinen bij Xynta of Transip.

Domeinnaam kosten

Gemiddeld betaal je voor een .nl domeinnaam ongeveer tien euro per jaar. Een .shop domein bijvoorbeeld kan wel vijfentwintig euro per jaar kosten. Per domein extensie verschilt dit dus. Let hierop wat je nodig hebt.

De Perfmatters plugin is ontwikkeld met eenvoud in gedachten. Geen gedoe met code of je functions.php bestand. Prestatie-optimalisaties hoeven niet ingewikkeld te zijn en daarom kan alles met één klik worden in- of uitgeschakeld.

De belangrijkste manier waarop deze plugin helpt om je WordPress website te versnellen, is door scripts uit te schakelen die mogelijk niet op je website worden gebruikt. Bijvoorbeeld, standaard laden emoji’s op elke pagina van je website. Als je ze niet gebruikt, vertraagt dit je site onnodig. Door ze uit te schakelen, wordt het script niet langer geladen, wat het totale aantal HTTP-verzoeken en de paginagrootte vermindert.

WordPress database optimaliseren

Een andere nuttige functie is onze database-optimalisatie. Na verloop van tijd beginnen dingen zoals revisies, automatische concepten, spamreacties en transients je database te vullen en voor je het weet, beïnvloedt dit de prestaties van je site. Met de Perfmatters plugin kun je deze eenvoudig opschonen en zelfs limieten instellen om te voorkomen dat het opnieuw gebeurt. Dit zorgt voor een snelle en responsieve database.

Perfmatters opties

Veel van de opties van Perfmatters kunnen eenvoudig worden toegepast door ze in te schakelen. Hier is een kort overzicht van enkele aanbevelingen:

Schakel emoji’s, embeds en dashicons uit

Schakel onnodige scripts en assets uit die je mogelijk niet gebruikt op je site, zoals emoji’s, embeds, dashicons, enz.

Schakel revisies uit of beperk deze

Schakel de post revisies uit of beperk het aantal revisies dat WordPress opslaat om te voorkomen dat je database oncontroleerbaar groeit.

Verander het autosave-interval

Houd minder auto-concepten door het autosave-interval te wijzigen. Dit vermindert ook de irritante “er is een recentere versie” waarschuwing.

Schakel de Heartbeat API uit en pas deze aan

Heartbeat kan een hoge CPU-belasting veroorzaken en een groot aantal AJAX-oproepen genereren. Je kunt Heartbeat uitschakelen en ook de frequentie wijzigen.

Schakel reacties en URL’s uit

Geen blog? Schakel reacties site-wide uit om spam te verminderen, of verwijder auteur reactie-links om te voorkomen dat mensen alleen een backlink proberen te krijgen.

Schakel Google Maps uit

Google Maps kan de prestaties van je site negatief beïnvloeden. Je kunt Google Maps selectief uitschakelen en het alleen laden waar je het nodig hebt.

Schakel WooCommerce winkelwagenfragmenten (AJAX) uit

De wc-ajax=get_refreshed_fragments verzoeken kunnen enorme vertragingen veroorzaken op WooCommerce-sites. Schakel winkelwagenfragmenten op je site uit.

Dit is slechts een deel van de opties. Wij als WordPress agency zijn erg blij met de resultaten die we krijgen als we PerfMatters gebruiken op een project.

Perfmatters.io website bezoeken