‘Slimme’ citaten

Pull quotes zijn citaten uit een wat langere tekst die vaak in ’t groot worden weergegeven. Met name kranten(websites) maken er graag gebruik van.

Wil je op je eigen website iets soortgelijks doen zonder twee keer net dezelfde tekst te moeten vermelden, dan kan dat op de manier die Chris Coyier beschrijft. (Noot: de exacte code in dat wat oudere artikel bevat enkele typefouten.)

Vertalen we die aanpak naar WordPress vandaag, dan bekom je zoiets:

jQuery(function() {
  jQuery('span.pullquote').each(function() {
    jQuery(this).parent('p').prepend(jQuery('<blockquote class="alignright"></blockquote>').text(jQuery(this).text()));
  });
});

Dit stukje JavaScript kopieert alle tekst die tussen (op zichzelf betekenisloze) <span>-tags met de klasse pullquote staat naar een nieuw <blockquote>-element. Hoe dat vervolgens wordt weergegeven, bepaalt je WordPress-thema. Meestal hoef je niks meer te doen. Een voorbeeld:

<p><span class="pullquote">Dit stukje tekst is 'n citaat.</span> Het wordt automatisch uit de tekst 'getrokken' en door WordPress gestyled.</p>