WordPress Custom Fields 101: tips, trucs en hacks

Aangepaste velden zijn een handige WordPress-functie waarmee u verschillende aanvullende gegevens / informatie aan uw WordPress-berichten en -pagina’s kunt toevoegen.


Veel populaire WordPress-plug-ins en thema’s gebruiken aangepaste velden om belangrijke gegevens op te slaan. U kunt ook aangepaste velden gebruiken om uw eigen gegevens op te slaan en deze vervolgens op uw website te gebruiken.

In dit artikel laten we u zien hoe u aangepaste WordPress-velden gebruikt met enkele tips, trucs en hacks.

Aangepaste velden gebruiken in WordPress met praktische voorbeelden

Aangezien dit een lang artikel is, hebben we een toegevoegd voor een gemakkelijkere navigatie.

    Wat zijn WordPress Custom Fields?

    Aangepaste WordPress-velden zijn metagegevens die worden gebruikt om aanvullende informatie toe te voegen met betrekking tot de post of pagina die u bewerkt.

    Wanneer u een nieuw bericht, een nieuwe pagina of een ander inhoudstype schrijft, slaat WordPress het standaard op in twee verschillende gebieden.

    Het eerste deel is de inhoud van uw inhoud die u toevoegt met de berichteditor.

    Het tweede deel is de informatie over die specifieke inhoud. Bijvoorbeeld titel, auteur, datum, tijd en meer. Dit informatiebit van de post wordt metadata genoemd.

    WordPress voegt automatisch alle vereiste metadata toe aan elk bericht of elke pagina die u maakt.

    U kunt ook uw eigen metagegevens maken en opslaan met behulp van de aangepaste velden.

    Standaard is de optie voor aangepaste velden verborgen op het berichtbewerkingsscherm. Om het te bekijken, moet u op het menu met drie stippen in de rechterbovenhoek van het scherm klikken en ‘Opties’ in het menu selecteren.

    Opties voor berichteditor

    Hierdoor wordt een pop-up weergegeven waarin u de optie ‘Aangepaste velden’ onder de geavanceerde panelen moet controleren. Klik daarna op ‘Inschakelen & Opnieuw laden knop om de berichteditor opnieuw te laden.

    Paneel met aangepaste velden inschakelen en weergeven

    De berichteditor wordt opnieuw geladen en u kunt het paneel met aangepaste velden onder de inhoudseditor zien.

    Metabox voor aangepaste velden onder de berichteditor

    Aangepaste velden kunnen worden gebruikt om informatie toe te voegen met betrekking tot het bericht, de pagina of elk inhoudstype. Deze meta-informatie kan worden weergegeven in uw thema.

    Om dat te doen, moet u echter uw WordPress-themabestanden bewerken.

    Daarom wordt deze tutorial aanbevolen voor gebruikers die bekend zijn met het bewerken van themabestanden. Het is ook handig voor aspirant WordPress-ontwikkelaars die willen leren hoe ze aangepaste velden op de juiste manier kunnen gebruiken in hun eigen thema’s of plug-ins.

    Dat gezegd hebbende, laten we eens kijken hoe u aangepaste velden in WordPress kunt toevoegen en gebruiken.

    Aangepaste velden toevoegen in WordPress

    Eerst moet u het bericht of de pagina bewerken waar u het aangepaste veld wilt toevoegen en naar het metavak voor aangepaste velden gaan.

    Aangepaste veldnaam en waarde toevoegen

    Vervolgens moet u een naam voor uw aangepaste veld opgeven en vervolgens de waarde invoeren. Klik op de knop Aangepast veld toevoegen om het op te slaan.

    Het veld wordt als volgt opgeslagen en weergegeven in het metavak van aangepaste velden:

    Aangepast veld opgeslagen

    U kunt dit aangepaste veld op elk gewenst moment bewerken en vervolgens op de updateknop klikken om uw wijzigingen op te slaan. U kunt het indien nodig ook verwijderen.

    Nu kunt u uw bericht opslaan om uw aangepaste veldinstellingen op te slaan.

    Aangepaste velden weergeven in WordPress-thema’s

    Om uw aangepaste veld op uw website weer te geven, moet u uw WordPress-themabestanden bewerken. Als je dit nog niet eerder hebt gedaan, bekijk dan onze handleiding over het kopiëren en plakken van code in WordPress.

    Eerst moet u het themabestand vinden dat u moet bewerken om uw aangepaste veld weer te geven. Idealiter zou je het op een enkele postpagina willen weergeven. U moet het bestand single.php of content-single.php bewerken.

    U moet uw aangepaste veldencode invoeren in de WordPress-lus. Zoek naar de regel die er als volgt uitziet:

    <?php terwijl (have_posts ()): the_post (); ?>

    Zorg ervoor dat u uw code vóór de volgende regel toevoegt:

    <?php ondertussen; // einde van de lus. ?>

    Nu moet je deze code toevoegen aan je themabestand:

    <?php echo get_post_meta ($ post->ID, ‘sleutel’, waar); ?>

    Vergeet niet de sleutel te vervangen door de naam van uw aangepaste veld. We hebben deze code bijvoorbeeld gebruikt in ons demo-thema:

    Het humeur van vandaag: <?php echo get_post_meta ($ post->ID, ‘Mood’, waar); ?>

    Je kunt nu je wijzigingen opslaan en het bericht bezoeken waar je het aangepaste veld hebt toegevoegd om het in actie te zien.

    Aangepaste veldgegevens weergegeven in een WordPress-thema

    Nu kunt u dit aangepaste veld ook in al uw andere WordPress-berichten gebruiken.

    Maak eenvoudig een nieuw bericht of bewerk een bestaand bericht. Ga naar het metavak van aangepaste velden en selecteer uw aangepaste veld in het vervolgkeuzemenu en voer de waarde in.

    Aangepast veld opnieuw gebruiken

    Klik op de knop ‘Aangepast veld toevoegen’ om je wijzigingen op te slaan en publiceer of update je bericht.

    Kan aangepast veld niet vinden in vervolgkeuzemenu op berichtbewerkingsscherm

    Standaard laadt WordPress in dit formulier slechts 30 aangepaste velden.

    Als u WordPress-thema’s en plug-ins gebruikt die al aangepaste velden gebruiken, bestaat de kans dat deze eerst in het vervolgkeuzemenu verschijnen en dat u uw nieuw gemaakte aangepaste veld niet kunt zien.

    Om dit probleem op te lossen, moet je de volgende code toevoegen aan het functies.php-bestand van je thema of een sitespecifieke plug-in.

    add_filter (‘postmeta_form_limit’, ‘meta_limit_increase’);
    function meta_limit_increase ($ limit) {
    retourneer 50;
    }

    De bovenstaande code verandert die limiet in 50. Als je je aangepaste veld nog steeds niet kunt zien, probeer dan die limiet nog verder te verhogen.

    Een gebruikersinterface voor aangepaste velden maken

    Zoals u kunt zien, moet u, zodra u een aangepast veld hebt toegevoegd, het veld selecteren en de waarde ervan invoeren telkens wanneer u een bericht schrijft.

    Als u veel aangepaste velden heeft of meerdere gebruikers die op uw website schrijven, dan is dit geen ideale oplossing.

    Zou het niet fijn zijn als u een gebruikersinterface zou kunnen maken waar gebruikers een formulier kunnen invullen om waarden toe te voegen aan uw aangepaste velden?

    Dit is wat zoveel populaire WordPress-plug-ins al doen. De SEO-titel en het metabeschrijvingvak in de populaire All in One SEO-plug-in is bijvoorbeeld een aangepaste metabox:

    Alles in één SEO Pack Meta Box

    De eenvoudigste manier om dit te doen, is door de plug-in Advanced Custom Fields te gebruiken.

    Aangepaste velden toevoegen met geavanceerde aangepaste velden

    Het eerste dat u hoeft te doen, is de plug-in Advanced Custom Fields installeren en activeren. Raadpleeg onze stapsgewijze handleiding voor het installeren van een WordPress-plug-in voor meer informatie.

    Na activering moet je bezoeken Aangepaste velden »Veldgroepen pagina en klik op de knop nieuwe toevoegen.

    Nieuwe veldgroep toevoegen

    Een veldgroep is als een container met een set aangepaste velden. Hierdoor kunt u meerdere panelen met aangepaste velden toevoegen.

    Nu moet u een titel voor uw veldgroep opgeven en vervolgens op de knop ‘Veld toevoegen’ klikken.

    Nieuw veld toevoegen

    U kunt nu een naam voor uw aangepaste veld opgeven en een veldtype selecteren. Met geavanceerde aangepaste velden kunt u allerlei soorten velden maken, waaronder tekst, afbeelding uploaden, aantal, dropdown, selectievakjes en meer.

    Een nieuwe fielld toevoegen

    Scroll naar beneden en je ziet andere opties voor dat specifieke veld. U kunt ze naar uw eigen wensen aanpassen.

    U kunt desgewenst meerdere velden aan uw veldgroep toevoegen. Als u klaar bent, klikt u op de publicatieknop om uw wijzigingen op te slaan.

    Je kunt nu een bericht bewerken of een nieuw bericht maken en je ziet een nieuw paneel voor je aangepaste velden onder de inhoudseditor.

    Aangepast veldpaneel op het berichtbewerkingsscherm

    Voor gedetailleerde stapsgewijze instructies, zie onze gids over het toevoegen van aangepaste metaboxen in WordPress-berichten en berichttypen.

    Verberg lege aangepaste velden met voorwaardelijke verklaring

    Tot dusver hebben we besproken hoe u een aangepast veld kunt maken en dit in uw thema kunt weergeven.

    Laten we nu kijken hoe we kunnen controleren of het aangepaste veld niet leeg is voordat het wordt weergegeven. Om dat te doen, zullen we onze code aanpassen om eerst te controleren of het veld gegevens bevat.

    <?php

    $ mood = get_post_meta ($ post->ID, ‘Mood’, waar);

    if ($ mood) { ?>

    Het humeur van vandaag: <? echo $ stemming; ?>

    <?php

    } anders {
    // niets doen;
    }

    ?>

    Vergeet Mood niet te vervangen door uw eigen aangepaste veldnaam.

    Meerdere waarden toevoegen aan een aangepast veld

    Aangepaste velden kunnen opnieuw in hetzelfde bericht worden gebruikt om meerdere waarden toe te voegen. U hoeft het alleen maar opnieuw te selecteren en een andere waarde toe te voegen.

    Meerdere waarden toevoegen aan een aangepast veld

    De code die we in de bovenstaande voorbeelden hebben gebruikt, kan echter slechts één waarde weergeven.

    Om alle waarden van een aangepast veld weer te geven, moeten we de code wijzigen en ervoor zorgen dat de gegevens in een array worden geretourneerd. U moet de volgende code toevoegen aan uw themabestand:

    <?php
    $ mood = get_post_meta ($ post->ID, ‘Mood’, false);
    if (count ($ mood)! = 0) { ?>

    Het humeur van vandaag:

      <?php foreach ($ mood as $ mood) {
      echo ‘
    • ‘. $ mood.’
    • ‘;
      }
      ?>

    <?php
    } anders {
    // niets doen;
    }
    ?>

    Vergeet Mood niet te vervangen door uw eigen aangepaste veldnaam.

    In dit voorbeeld ziet u dat we de laatste parameter van de functie get_post_meta hebben gewijzigd in false. Deze parameter definieert of de functie al dan niet een enkele waarde moet retourneren. Door het op false in te stellen, kan het de gegevens als een array retourneren, die we vervolgens in een foreach-lus hebben weergegeven.

    Berichten weergeven met een specifieke aangepaste sleutel

    Met WordPress kunt u berichten weergeven met aangepaste sleutels en hun waarden. Als u bijvoorbeeld een aangepaste archiefpagina probeert te maken om alle berichten met specifieke aangepaste sleutels weer te geven, kunt u de klasse WP_Query gebruiken om berichten te zoeken die overeenkomen met die velden.

    U kunt de volgende code als uitgangspunt gebruiken.

    $ args = array (
    ‘meta_key’ => ‘Humeur’,
    ‘meta_value’ => ‘Gelukkig’
    );
    $ the_query = nieuwe WP_Query ($ args);

    <?php
    // de vraag
    $ the_query = nieuwe WP_Query ($ args); ?>

    <?php if ($ the_query->have_posts ()): ?>


    <?php while ($ the_query->have_posts ()): $ the_query->de post(); ?>

    <?php the_title (); ?>

    <?php the_content (); ?>

    <?php ondertussen; ?>

    <?php wp_reset_postdata (); ?>

    <?php anders: ?>

    <?php _e (‘Sorry, geen berichten kwamen overeen met uw criteria.’); ?>

    <?php endif; ?>

    Vergeet niet de parameters meta_key en meta_value te vervangen door uw eigen waarden.

    Naam gastauteur toevoegen met aangepaste velden

    Wil je een gastpost toevoegen, maar wil je geen nieuw gebruikersprofiel toevoegen om slechts één post toe te voegen? Een eenvoudigere manier om dat te doen is door de naam van de gastauteur toe te voegen als een aangepast veld.

    Eerst moet je de volgende code toevoegen aan het functies.php-bestand van je thema of een sitespecifieke plug-in.

    add_filter (‘the_author’, ‘guest_author_name’);
    add_filter (‘get_the_author_display_name’, ‘guest_author_name’);
    functie guest_author_name ($ name) {
    wereldwijde $ post;
    $ author = get_post_meta ($ post->ID, ‘gast-auteur’, waar);
    if ($ auteur)
    $ name = $ auteur;
    $ naam retourneren;
    }

    Deze code koppelt een functie aan the_author en get_the_author_display_name filters in WordPress.

    De functie controleert eerst op de naam van de gastauteur. Als het bestaat, wordt de naam van de auteur vervangen door de naam van de gastauteur.

    Nu moet je het bericht bewerken waar je de naam van de gastauteur wilt weergeven. Ga naar het metavak van aangepaste velden en voeg de naam van de gastauteur toe.

    Aangepast veld voor gastauteur toevoegen

    Raadpleeg ons artikel voor meer informatie over het herschrijven van de naam van de gastauteur met aangepaste velden in WordPress.

    Bijdragers aan een artikel weergeven met aangepaste velden

    Op veel populaire blogs en nieuwssites dragen meerdere auteurs bij aan het schrijven van een artikel. WordPress staat echter toe dat slechts één auteur aan een bericht wordt gekoppeld.

    Een manier om dit probleem op te lossen is door de Co-Authors Plus-plug-in te gebruiken. Raadpleeg onze handleiding voor meer informatie over het toevoegen van meerdere auteurs aan een WordPress-bericht.

    Een andere manier om dat te doen is door bijdragers toe te voegen als een aangepast veld.

    Eerst moet je het bericht bewerken waarin je co-auteurs of bijdragers wilt weergeven. Scrol omlaag naar het metavak voor aangepaste velden en voeg auteursnamen toe als aangepast veld voor co-auteur.

    Aangepast veld voor co-auteur toevoegen

    Voeg nu deze code toe aan uw themabestanden waar u co-auteurs wilt laten zien.

    <?php

    $ coauthors = get_post_meta ($ post->ID, ‘co-auteur’, false);
    if (count ($ coauthors)! = 0) { ?>

    • Bijdragers
    • <?php foreach ($ coauteurs als $ coauteurs) { ?>
      <?php echo ‘

    • ‘. $ coauteurs.’
    • ‘;
      }
      ?>

    <?php
    } anders {
    // niets doen;
    }
    ?>

    Om auteursnamen gescheiden door komma’s weer te geven, kunt u de volgende aangepaste CSS toevoegen.

    .coauteurs ul {
    display: inline;
    }
    .coauteurs li {
    display: inline;
    lijststijl: geen;
    }
    .coauteurs li: after {
    inhoud:","
    }
    .coauteurs li: last-child: after {
    inhoud: "";
    }
    .coauteurs li: eerste kind: na {
    inhoud: ":";
    }

    Zo zag het eruit op onze demosite.

    Medeauteurs weergegeven met aangepaste velden

    Toon aangepaste velden buiten de lus in WordPress

    Tot dusver hebben we u alle voorbeelden laten zien waarin aangepaste velden worden weergegeven in de WordPress-lus. Wat als je ze buiten de lus moest laten zien? Bijvoorbeeld in de zijbalk van een enkele post.

    Voeg de volgende code toe om de aangepaste velden buiten de WordPress-lus weer te geven:

    <?php
    globale $ wp_query;
    $ postid = $ wp_query->post->ID KAART;
    echo get_post_meta ($ postid, ‘key’, true);
    wp_reset_query ();
    ?>

    Vergeet niet de sleutel te vervangen door uw aangepaste veldnaam.

    Aangepaste koptekst, voettekst, zijbalk weergeven met aangepaste velden

    Meestal gebruiken de meeste WordPress-thema’s op alle pagina’s dezelfde koptekst, voettekst en zijbalk. Er zijn meerdere manieren om verschillende zijbalken, kopteksten of voetteksten voor verschillende pagina’s op uw website weer te geven. Zie onze gids voor het weergeven van verschillende zijbalken voor elk WordPress-bericht of elke pagina.

    Een manier om dit te doen is door aangepaste velden te gebruiken. Bewerk het bericht of de pagina waar u een andere zijbalk wilt weergeven en voeg vervolgens de zijbalk toe als aangepast veld.

    Aangepaste zijbalk toevoegen aan een bericht met behulp van een aangepast veld

    Nu moet je je WordPress-themabestanden zoals single.php bewerken waar je de aangepaste zijbalk wilt weergeven. U zoekt de volgende code:

    <?php get_sidebar (); ?>

    Vervang deze regel door de volgende code:

    <?php
    globale $ wp_query;
    $ postid = $ wp_query->post->ID KAART;
    $ sidebar = get_post_meta ($ postid, "zijbalk", waar);
    get_sidebar ($ zijbalk);
    wp_reset_query ();
    ?>

    Deze code zoekt eenvoudig naar het aangepaste veld in de zijbalk en geeft het vervolgens weer in uw thema. Als je bijvoorbeeld toevoegt wpbpage als uw aangepaste veld voor de zijbalk, zal de code zoeken naar het bestand zijbalk-wpbpage.php om weer te geven.

    U moet het sidebar-wpbpage.php-bestand in uw themamap maken. Je kunt de code uit het zijbalk.php-bestand van je thema als uitgangspunt kopiëren.

    Het manipuleren van RSS-feedinhoud met aangepaste velden

    Wilt u extra metagegevens of inhoud weergeven aan uw RSS-feedgebruikers? Met behulp van aangepaste velden kunt u uw WordPress RSS-feed manipuleren en aangepaste inhoud aan uw feeds toevoegen.

    Eerst moet u de volgende code toevoegen aan het functies.php-bestand van uw thema of een sitespecifieke plug-in.

    functie wpbeginner_postrss ($ content) {
    globale $ wp_query;
    $ postid = $ wp_query->post->ID KAART;
    $ coolcustom = get_post_meta ($ postid, ‘coolcustom’, waar);
    if (is_feed ()) {
    if ($ coolcustom! == ”) {
    $ content = $ content."

    ".$ coolcustom."
    ";
    }
    anders {
    $ content = $ content;
    }
    }
    $ inhoud retourneren;
    }
    add_filter (‘the_excerpt_rss’, ‘wpbeginner_postrss’);
    add_filter (‘the_content’, ‘wpbeginner_postrss’);

    Maak nu gewoon een aangepast veld met de naam “coolcustom” en voeg elke gewenste waarde toe. Je kunt het gebruiken om advertenties, afbeeldingen, tekst of wat je maar wilt weer te geven.

    Bewerk de titel van de RSS-feed met aangepaste velden

    Soms wilt u misschien extra tekst toevoegen aan een berichttitel voor gebruikers van RSS-feeds. Bijvoorbeeld als u een gesponsorde post of een gastpost publiceert.

    Eerst voeg je de volgende code toe aan het functies.php-bestand van je thema of een sitespecifieke plug-in.

    functie wpbeginner_titlerss ($ content) {
    globale $ wp_query;
    $ postid = $ wp_query->post->ID KAART;
    $ gpost = get_post_meta ($ postid, ‘guest_post’, waar);
    $ spost = get_post_meta ($ postid, ‘sponsored_post’, waar);

    if ($ gpost! == ”) {
    $ content = ‘Gastpost:’. $ content;
    }
    elseif ($ spost! == ”) {
    $ content = ‘Gesponsorde post:’. $ content;
    }
    anders {
    $ content = $ content;
    }
    $ inhoud retourneren;
    }
    add_filter (‘the_title_rss’, ‘wpbeginner_titlerss’);

    Vervolgens moet je het bericht bewerken waar je de extra tekst in het titelveld wilt weergeven en guest_post en sponsored_post toevoegen in aangepaste velden.

    Gesponsorde en gastpost aangepaste velden

    Als een van deze twee aangepaste velden wordt gevonden met de waarde “true”, wordt de juiste tekst vóór de titel toegevoegd. Deze techniek kan op verschillende manieren worden gebruikt om te passen wat je maar wilt.

    Wil je meer coole RSS-feedhacks leren? Zie onze gids over het toevoegen van inhoud en het manipuleren van uw WordPress RSS-feeds.

    Stel de vervaldatum in voor berichten in WordPress met behulp van aangepaste velden

    Wilt u een vervaldatum instellen voor sommige berichten op uw WordPress-site? Dit is handig in situaties waarin u alleen inhoud voor een bepaalde periode wilt publiceren, zoals het uitvoeren van enquêtes of tijdelijke aanbiedingen.

    Een manier om dit te doen is door handmatig de inhoud van het bericht te verwijderen of door een plug-in zoals Post Expirator-plug-in te gebruiken.

    Een andere manier om dit te doen, is door aangepaste velden te gebruiken om berichten na een bepaalde tijd automatisch te laten vervallen.

    U moet uw themabestanden bewerken en toevoegen om de WordPress-lus als volgt te wijzigen:

    <?php
    if (have_posts ()):
    while (have_posts ()): the_post ();
    $ expirationtime = get_post_meta ($ post->ID kaart, "vervaldatum", false);
    if (count ($ expirationtime)! = ”) {
    if (is_array ($ expirationtime)) {
    $ expirestring = implode ($ expirationtime);
    }

    $ secondsbetween = strtotime ($ expirestring) -time ();
    if ($ secondstussen >= 0) {
    echo ‘Dit bericht verloopt op’. $ expirestring. ”;
    de inhoud();
    } anders {
    echo "Sorry dit bericht is verlopen!"
    }
    } anders {
    de inhoud();
    }
    uiteindelijk;
    stop als;
    ?>

    Opmerking: u moet deze code bewerken zodat deze bij uw thema past.

    Nadat u deze code heeft toegevoegd, kunt u het aangepaste vervalveld toevoegen aan het bericht dat u wilt laten vervallen. Zorg ervoor dat u de tijd in dit formaat toevoegt mm / dd / jjjj 00:00:00.

    Een vervaldatum toevoegen met een aangepast veld

    Stijl individuele berichten met behulp van aangepaste velden

    Wil je het uiterlijk van een individueel bericht wijzigen met CSS? WordPress wijst automatisch elk bericht een eigen klasse toe die u kunt gebruiken om aangepaste CSS toe te voegen.

    Met aangepaste velden kunt u echter uw eigen aangepaste klassen toevoegen en deze vervolgens gebruiken om berichten anders op te maken.

    Eerst moet je een bericht bewerken dat je anders wilt stylen. Ga naar het veld met aangepaste velden en het aangepaste veld na de klasse.

    Aangepast veld na de les

    Vervolgens moet u uw WordPress-themabestanden bewerken en deze code aan het begin van de WordPress-lus toevoegen.

    <?php $ custom_values ​​= get_post_meta ($ post->ID, ‘post-class’); ?>

    Nu moet je een regel vinden met de functie post_class (). Hier is hoe het eruit zag in ons demo-thema:

    " <?php post_class (); ?>>

    Wijzig deze regel om uw aangepaste veldwaarde op te nemen, zoals deze:

    " <?php post_class ($ custom_values); ?>>

    Als u nu de broncode van de post onderzoekt met de Inspect-tool, ziet u uw aangepaste veld CSS-klasse toegevoegd aan de postklasse.

    Aangepast veld postklasse

    Nu kunt u deze CSS-klasse gebruiken om aangepaste CSS toe te voegen en uw bericht anders te stijlen.

    Dat is alles, we hopen dat dit artikel je heeft geholpen meer te leren over aangepaste WordPress-velden. Misschien wilt u ook onze ultieme stapsgewijze handleiding bekijken om de snelheid en prestaties van WordPress voor beginners te verbeteren.

    Jeffrey Wilson Administrator
    Sorry! The Author has not filled his profile.
    follow me
      Like this post? Please share to your friends:
      Adblock
      detector
      map