Shortcodes

Shortcodes zijn korte codes die ervoor zorgen dat er een blok met vooraf aangemaakte code op pagina’s ingeladen worden. Shortcodes kunnen direct in een editor worden geplaatst of je kunt gebruik maken van het blok ‘Shortcodes’ om ze toe te voegen. Het thema komt standaard met een selectie shortcodes die hieronder uitgelegd worden. Tussen een shortcode tag kan content geplaatst worden en sommige shortcodes kunnen gebruik maken van parameters.

[rewave-data]Identifier[/rewave-data]

Met deze shortcode kun je gegevens inladen die je ingesteld hebt bij de ‘Thema instellingen’ onder het kopje ‘Algemeen’. De volgende lijst kan worden gebruikt als identifier:

year | Laat het huidige jaar zien.
webname | Website naam.
company | Bedrijfsnaam.
street | Straatnaam en huisnummer.
zipcode | Postcode.
city | Stad.
phone | Telefoonnummer.
info | Volledige e-mail link naar het info mailadres (vanuit thema instellingen > e-mails).
sales | Volledige e-mail link naar het verkoop mailadres (vanuit thema instellingen > e-mails).
service | Volledige e-mail link naar het klantenservice mailadres (vanuit thema instellingen > e-mails).

Voorbeeld: [rewave-data]city[/rewave-data]

[rewave-socials]

Voegt automatisch de social media icoontje toe op de locatie van de shortcode. De social media die worden weergeven komen uit ‘Thema instellingen’ onder het kopje ‘Social media’. Als er iets is ingevuld wordt de social media link weergeven. De shortcode maakt gebruik van 3 optionele parameters:

classes | Voeg extra classes toe voor eventuele stijling.
icon-align | Hoe moeten de icoontjes worden uitgelijnd op desktop [Keuze uit start/center/end].
icon-align-mobile | Hoe moeten de icoontjes worden uitgelijnd op mobiel [Keuze uit start/center/end].

Voorbeeld: [rewave-socials icon-align=”center” icon-align-mobile=”end”]

[rewave-usp]Content[/rewave-usp]

Voegt een USP blok toe inclusief icoontje. Deze shortcode wordt voornamelijk gebruikt in de footer. Deze shortcode bevat een optionele parameter en een verplichte parameter:

icon | Classes van het icoontje dat weergeven moet worden [VERPLICHT].
classes | Voeg extra classes toe voor eventuele stijling.

Voorbeeld: [rewave-usp icon =”fa fa-edit”]Deze tekst wordt weergeven naast het icoontje[/rewave-usp]

[rewave-advantages]Content[/rewave- advantages]

Voegt een voordeel blok in inclusief titel, tekst en icoontje. Wordt bijvoorbeeld vaak gebruikt in de ‘Over ons’ pagina. Deze shortcode bevat twee verplichte parameters en een optionele:

icon | Classes van het icoontje dat weergeven moet worden [VERPLICHT].
title | Titel voor het blok [VERPLICHT].
classes | Voeg extra classes toe voor eventuele stijling.

Voorbeeld: [rewave-advantages icon =”fa fa-edit” title=”Dit is de titel van het voordeel.”]Deze tekst wordt weergeven onder de titel en geeft aan wat het voordeel is.[/rewave- advantages ]

[rewave-categories]

Deze shortcode voegt een blok toe met de beschikbare categorieën. Dit blok maakt gebruik van hetzelfde menu als het hoofdmenu van het thema. Deze shortcode heeft twee optionele parameters:

id | Voegt de identifier toe aan het blok.
classes | Voeg extra classes toe voor eventuele stijling.

Voorbeeld: [rewave-categories id =”categorie-blok-id”]

[rewave-product-slider]Product shortcode[/rewave-product-slider]

Deze shortcode veranderd de standaard WooCommerce product shortcodes in een product slider als je mobiel kijkt. Deze shortcode bevat een verplichte parameter en drie optionele parameters:

slide | Class naam van het slide blok (meestal .product). Hiermee wordt de scroll lengte en de maat van het vak bepaald [VERPLICHT].
duration | Geef in getallen aan hoe lang de slide animatie is. Dit staat standaard op 200.
id | Voegt de identifier toe aan het blok.
class | Voeg extra classes toe voor eventuele stijling.

Voorbeeld: [rewave-product-slider slide=”.product”][best_selling_products per_page=”5″ columns=”5″ orderby=”popularity”][/rewave-product-slider]

[rewave-row]Kolom shortcode[/rewave-row]

Deze shortcode voegt een Bootstrap rij toe te voorbereiding van de kolom shortcode die erin gevoegd kan worden. Deze shortcode maakt gebruik van twee optionele parameters:

id | Voegt de identifier toe aan het blok.
classes | Voeg extra classes toe voor eventuele stijling.

Voorbeeld: [rewave-row][rewave-col]kolom tekst 1[/rewave-col][rewave-col]kolom tekst 2[/rewave-col][rewave-row]

[rewave-col]Content[/rewave-col]

Deze shortcode moet worden gebruikt in combinatie met de [rewave-row] shortcode voor optimaal resultaat. Een kolom kan maximaal 12 breed zijn. Je kunt zo bijvoorbeeld 2 kolommen toe voegen van 6 breed waardoor ze precies even breed naast elkaar staan. Deze shortcode bevat een verplichte parameter en twee optionele parameters:

col | Kolom indeling voor diverse schermen zie de breakpoints die je kunt gebruiken op Bootstrap. Je kunt breakpoints scheiden door middel van een ‘,’ [VERPLICHT].
id | Voegt de identifier toe aan het blok.
classes | Voeg extra classes toe voor eventuele stijling.

Voorbeeld: [rewave-row][rewave-col col=”sm-12,md-6”]Column tekst 1[/rewave-col][rewave-col col=”sm-12,md-6”]Column tekst 2[/rewave-col][rewave-row]

[rewave-countdown]

Deze shortcode maakt een countdown timer aan. Deze shortcode bevat een verplichte en twee optionele parameters:

date | Datum voor de deadline van de countdown. Gebruik hiervoor de volgende indeling JAAR/MAAND/DAG (bijv. 2021/11/01) [VERPLICHT].
time | Tijd voor de countdown. Gebruik hiervoor de volgende indeling UUR:MINUTEN:SECONDEN (bijv. 12:15:00).
id | Uniek id voor de shortcode.

Voorbeeld: [rewave-countdown date=”2021/11/01” time=”12:00:00”]