Wil je een leesvoortgangsbalk toevoegen aan WordPress?

Een leesvoortgangsbalk is een mooie manier om de gebruikerservaring van je site te verbeteren door lezers een visuele indicator te geven van hun voortgang door een bericht.

Als je er een aan je site wilt toevoegen, zijn er een heleboel mooie gratis of betaalbare plugins die je helpen een voortgangsbalk toe te voegen en de vormgeving ervan af te stemmen op de rest van je site.

In dit artikel hebben we 8 van de beste opties verzameld, waarvan er 6 helemaal gratis zijn.

Hieronder geven we de details van elke plugin, samen met een korte inleiding over hoe voortgangsbalken werken en waarom ze nuttig kunnen zijn voor je site.

Wat is een leesvoortgangsbalk?

Een leesvoortgangsbalk doet vrijwel precies wat de naam zegt – hij laat de bezoekers van je site zien hoe ver ze al gevorderd zijn door de content van je bericht.

Gewoonlijk plak je een horizontale balk bovenaan of onderaan de pagina. Naargelang gebruikers door het bericht scrollen, loopt de balk “vol” om aan te geven hoe dicht ze bij het einde van de content zijn.

Sommige plugins geven je ook de mogelijkheid om een verticale voortgangsbalk te maken aan de linker- of rechterkant vna de content. In deze gevallen lijkt het bijna op een schuifbalk. Het belangrijkste verschil is echter dat de voortgangsbalk gebaseerd is op de lengte van de eigenlijke content, terwijl de schuifbalk van de browser gebaseerd is op de volledige lengte van de pagina.

Hier zijn twee praktijkvoorbeelden van de manier waarop sites doorgaans leesvoortgangsbalken gebruiken…

HubSpot voegt een oranje voortgangsbalk toe die direct onder zijn sticky header verschijnt:

Een voorbeeld van een leesvoortgangsbalk van HubSpot.
Een voorbeeld van een leesvoortgangsbalk van HubSpot.

Je kunt echter experimenteren met verschillende plaatsingen van de voortgangsbalk, afhankelijk van je site.

Waarom een leesvoortgangsbalk aan WordPress toevoegen?

Op een hoog niveau is een leesvoortgangsbalk een manier om de bruikbaarheid en gebruikerservaring op je site te verbeteren, wat rechtstreeks effect kan hebben op belangrijke metrics zoals tijd besteed op pagina en bouncerate.

Laten we het eerst eens hebben over gebruikerservaring in het algemeen.

De meeste mensen willen weten waar ze aan beginnen voordat ze tijd investeren in je artikel. Is het een artikel van 5 minuten dat ze tussen hun taken door kunnen lezen of is het een lang artikel van 20 minuten dat serieuze aandacht vereist?

Een voortgangsbalk geeft lezers een goed idee van wat ze van je artikel kunnen verwachten als ze beginnen te lezen. Om hierbij te helpen voegen sommige sites naast de voortgangsbalk ook een geschatte leestijd toe, wat verschillende van de onderstaande plugins ondersteunen.

Als je bezoekers eenmaal beginnen te lezen, kan de voortgangsbalk hen ook aanmoedigen het artikel tot het eind te lezen. Als een lezer bijvoorbeeld ziet dat hij al door 80% van de content heen is, zal hij aangemoedigd worden om de laatste 20% af te maken omdat hij het grootste deel van het bericht al heeft gelezen.

Deze verbeteringen in de gebruikerservaring kunnen positieve effecten hebben op twee belangrijke statistieken:

  • Dwell time – door lezers aan te moedigen een bericht tot het eind te lezen als ze eenmaal begonnen zijn met lezen, kun je de tijd die ze op de pagina doorbrengen verlengen.
  • Bounce rate – door de tijd die bezoekers op je pagina doorbrengen te verhogen, vergroot je de kans dat een bezoeker verder gaat met je site (misschien door nog een bericht te lezen), wat kan helpen je bouncepercentage te verlagen.

Als je voortgangsbalken combineert met andere tactieken om de gebruikerservaring te verbeteren, zoals een kwaliteitsnavigatiestructuur en slim gebruik van paginering, kun je een heel mooie, boeiende ervaring voor bezoekers creëren.

8 beste leesvoortgangsbalk WordPress plugins

Laten we nu eens ingaan op de 8 beste voortgangsbalk WordPress plugins die je helpen een leesvoortgangsbalk aan je site toe te voegen.

Hoewel je algemene voortgangsbalk plugins kunt vinden waarmee je voor van alles een aangepaste voortgangsbalk kunt maken, is dit bericht specifiek gericht op plugins die leesvoortgangsindicatoren toevoegen op basis van de lengte van de content van een pagina.

Wat prijzen betreft zijn 6 van deze plugins helemaal gratis, terwijl de 2 overgebleven plugins betaalbaar zijn en wat extra flexibiliteit toevoegen die je in de meeste gratis opties niet vindt.

Het beste van alles is dat al deze plugins met vrijwel elk WordPress thema zouden moeten werken.

Read Meter

Read Meter
Read Meter

Read Meter is een leesvoortgangsbalkplugin van Brainstorm Force, hetzelfde team achter het populaire Astra WordPress thema (dat onze lijst van de snelste WordPress thema’s haalde).

Met de plugin kun je automatisch een leesvoortgangsbalk toevoegen die helemaal bovenaan of onderaan de pagina blijft staan. Je hebt ook de mogelijkheid om de geschatte leestijd van het bericht samen met de voortgangsbalk te tonen.

Dit is alles wat je krijgt met Read Meter:

  • Plaatsing bovenaan of onderaan – toon de voortgangsbalk bovenaan of onderaan het scherm van een gebruiker.
  • Berichttype targeting – je kunt ervoor kiezen de leesvoortgang alleen voor bepaalde berichttypes (ook aangepaste berichttypes) toe te voegen. Je kunt ze bijvoorbeeld wel op blogposts tonen, maar niet op pagina’s.
  • Leestijd – voeg automatisch de geschatte leestijd toe aan verschillende delen van het bericht (bv. onder de titel) of plaats het handmatig met een shortcode.
  • Aanpasbare kleuren – je kunt de kleuren en stijl van elk element aanpassen zodat het bij je site past.

Prijs: Read Meter is 100% gratis.

Reading progressbar

Reading progressbar plugin.
Reading progressbar

Samen met Read Meter is Reading progressbar een van de meest populaire voortgangsbalkplugins op WordPress.org. In tegenstelling tot Read Meter geeft deze plugin je echter geen optie om de geschatte leestijd toe te voegen – deze is uitsluitend om een voortgangsbalk toe te voegen.

Hij geeft je echter wel wat extra targeting flexibiliteit die Read Meter niet biedt. Je kunt bijvoorbeeld je voortgangsbalk richten op specifieke templates, naast targeting op berichttype.

Dit is alles wat je krijgt met Reading progressbar:

  • Flexibele plaatsing – je kunt je voortgangsbalk automatisch bovenaan of onderaan de pagina plakken. Er is ook een aangepaste plaatsingsmogelijkheid waarmee je hem aan elk CSS element kunt vastplakken. Als je bijvoorbeeld een sticky header hebt, kun je hem onder je navigatiemenu in de header plakken in plaats van helemaal bovenaan de pagina (zoals het HubSpot voorbeeld hierboven).
  • Aanpasbaar ontwerp – verander de hoogte en kleuren van je voortgangsbalk zodat ze bij je site passen.
  • Targeting opties – je kunt je voortgangsbalk alleen op bepaalde templates en/of berichttypes tonen.

Prijs: Reading progressbar is 100% gratis.

Worth the Read

Worth the Read plugin.
Worth the Read

Worth the Read is een van de meest aanpasbare voortgangsbalk WordPress plugins, wat het een goede optie maakt als je de vorige plugins te beperkend vindt.

Het bevat enkele unieke plaatsings- en targetingmogelijkheden die de meeste andere plugins niet bieden, samen met enkele andere unieke accenten. Het geeft je ook de mogelijkheid om een geschatte leestijd toe te voegen als je dat graag wilt.

Dit is alles wat je krijgt met Worth the Read:

  • Horizontale of verticale plaatsingsmogelijkheden – plaats een horizontale voortgangsbalk boven of onderaan het scherm OF een verticale voortgangsbalk links of rechts van het scherm. De verticale optie is uniek omdat de meeste andere plugins dat niet ondersteunen.
  • Berichttype targeting – laat je leesvoortgangsbalk alleen op bepaalde berichttypes verschijnen.
  • Apparaat targeting – je hebt de mogelijkheid om de voortgangsbalk uit te schakelen voor mobiele apparaten en tablets (of desktops).
  • Comments tijdens scrollen – je hebt de optie om commentaar in de leesvoortgang op te nemen, wat prettig kan zijn als je actieve commentaarsecties hebt met nuttige informatie.
  • RTL ondersteuning – het is een van de weinige plugins waarmee je naar RTL (right-to-left) kunt overschakelen, wat goed kan zijn voor sites in RTL talen.
  • Stijlopties – pas de kleuren aan, de dikte, de ondoorzichtigheid, enzovoort. Als je de commentaren hebt ingeschakeld, kun je zelfs een aparte kleur gebruiken om op de voortgangsbalk aan te geven wanneer de commentaarsectie begint.
  • Geschatte leestijd – als je leestijd inschakelt, kun je de werking ervan aanpassen en automatisch of handmatig plaatsen met een shortcode.

Prijs: Worth the Read is 100% gratis.

Catch Scroll Progress Bar

Catch Scroll Progress Bar plugin.
Catch Scroll Progress Bar

Catch Scroll Progress Bar is een andere lichtgewicht optie om een standaard voortgangsbalk aan je site toe te voegen.

Het houdt de dingen vrij eenvoudig, met alleen de minimale opties die je nodig hebt om je voortgangsbalk te plaatsen en te stijlen.

Dit is alles wat je krijgt met Catch Scroll Progress Bar:

  • Plaatsing bovenaan of onderaan – plak je voortgangsbalk bovenaan of onderaan de pagina.
  • Berichttype targeting – plaats je voortgangsbalk alleen bij bepaalde berichttypes.
  • Template targeting – binnen die berichttypes toon je hem alleen op bepaalde templates. Je kunt ze bijvoorbeeld wel aan enkele berichten toevoegen, maar niet aan de archief pagina.
  • Kleur en stijl opties – pas de kleuren, ondoorzichtigheid, en hoogte van je voortgangsbalk aan.

Prijs: Catch Scroll Progress Bar is 100% gratis.

WP Reading Progress

WP Reading Progress plugin.
WP Reading Progress

WP Reading Progress is een andere gratis voortgangsbalk WordPress plugin die verkrijgbaar is bij WordPress.org.

Net als de vorige plugin geeft hij je alleen de minimale instellingen die nodig zijn om je leesvoortgangsbalk aan te passen. Maar voor de meeste mensen is dat alles wat je nodig hebt, wat het tot een andere solide optie maakt.

Dit is alles wat je krijgt met WP Reading Progress:

  • Flexibele plaatsing – plak de balk automatisch bovenaan of onderaan de pagina. Of je kunt hem handmatig aan elke CSS selector vastplakken.
  • Berichttype targeting – zet een voortgangsbalk alleen op bepaalde berichttypes. Er is ook een optie om deze aan/uit te zetten op archief pagina’s.
  • Stijlaanpassing – je kunt de kleur en dikte van de voortgangsbalk aanpassen. Je kunt echter maar één kleur kiezen en er zijn geen opties voor ondoorzichtigheid.

Prijs: WP Reading Progress is 100% gratis.

Reading Time

Reading Time plugin.

Reading Time is de eerste leesvoortgangsplugin op deze lijst die alleen in een premium versie te krijgen is.

Hij is echter nog steeds heel betaalbaar en biedt levenslange updates via Envato’s CodeCanyon marktplaats.

Er zijn 2 belangrijke redenen waarom je Reading Time zou willen overwegen in plaats van de gratis alternatieven:

  • 8+ vooraf ingestelde stijlen – je krijgt een aantal unieke stijlopties, zoals het gebruik van verticale balken in plaats van een effen vulling in de voortgangsbalk (zie foto hierboven).
  • Geavanceerde targetingregels – naast het targeten op berichttypes en templates, kun je je voortgangsbalk ook targeten op heel specifieke regels, zoals gebruikersrollen, URL’s, apparaten, en meer.

Je krijgt ook alle “standaard” features die je van een plugin zou verwachten:

  • Flexibele plaatsing– behalve automatische plaatsing boven of onder kun je ook aangepaste targeten gebruiken om je voortgangsbalk aan elke CSS selector te plakken.
  • Stijlopties – behalve de 8+ voorgeprogrammeerde stijlen krijg je ook algemene opties om de kleuren en hoogte van je voortgangsbalk aan te passen.

Prijs: Reading Time kost $15, met levenslange updates voor een enkele site en 6 maanden ondersteuning.

Reading Position Indicator

Reading Position Indicator plugin.
Reading Position Indicator

Reading Position Indicator is een andere lichtgewicht gratis voortgangsbalk plugin op WordPress.org.

Het geeft je niet veel instellingen, maar een unieke optie is dat je een eigen kleurverloop voor je leesvoortgangsbalk kunt gebruiken (naast een effen kleur).

Dit is alles wat je krijgt met Reading Position Indicator:

  • Plaatsing bovenaan of onderaan – er is geen CSS selector targeting, maar je kunt wel een offset toevoegen.
  • Berichttype targeting – richt je voortgangsbalk op specifieke berichttypes.
  • Aanpassingsmogelijkheden voor de stijl – kies uit effen of kleurverloopstijlen. Je kunt ook de dikte van de voortgangsbalk aanpassen.

Prijs: Reading Position Indicator is 100% gratis.

ReBar

ReBar plugin.
ReBar

ReBar is een andere premium leesvoortgangsbalk WordPress plugin die verkocht wordt via Envato’s CodeCanyon marktplaats.

Net als bij Reading Time zijn dit enkele van de unieke features die het biedt die het de moeite waard kunnen maken om er geld voor uit te geven:

  • 8+ vooraf ingestelde stijlen – je krijgt een aantal unieke stijlen die verder gaan dan effen kleurvullingen, zoals plastic, kleurverlopen, iOS-stijl, en meer.
  • Geavanceerde targetingregels – naast het targeten van berichttypes, kun je je voortgangsbalk ook targeten op heel specifieke regels, zoals gebruikersrollen, URL’s, apparaten, en meer.
  • Oneindige scroll ondersteuning – ReBar werkt nog steeds met oneindige scroll layouts, wat het een goede optie maakt voor die sites. Je kunt het scroll gebied definiëren op basis van CSS selectors en het genereert een unieke voortgangsbalk voor elk bericht in de oneindige scroll.

Hier zijn enkele andere opmerkelijke features:

  • Horizontale en verticale stijlen – plaats een horizontale voortgangsbalk bovenaan of onderaan de pagina OF plaats een verticale voortgangsbalk links of rechts op de pagina.
  • Aanpasbare stijlen – behalve de 8+ voorgeprogrammeerde stijlen kun je ook de kleuren en hoogte/breedte van je voortgangsbalk aanpassen.
  • RTL ondersteuning – je kunt de voortgangsbalk omkeren voor RTL talen.

Prijs: ReBar kost $15, met levenslange updates voor een enkele site en 6 maanden ondersteuning.

Samenvatting

Dat is het einde van onze verzameling van de 8 beste leesvoortgangsbalk WordPress plugins.

Voor de eenvoudigste opties om een standaard voortgangsbalk toe te voegen, kun je plugins als Read Meter of Reading progressbar overwegen.

Aan de andere kant, als je gratis de meeste aanpasbaarheid wilt, kun je misschien beter beginnen met Worth the Read, want die bevat een aantal unieke opties en features die andere plugins niet bieden.

Als je verder wilt gaan dan een effen vulkleur voor de voortgangsbalk, zou je ook de premium opties op CodeCanyon kunnen overwegen – ofwel Reading Time ofwel ReBar. Nogmaals, het meest unieke aan deze plugins is dat ze beide met 8+ voorgeprogrammeerde stijlen komen en veel meer geavanceerde targetingmogelijkheden.

Elke plugin geeft zijn eigen unieke draai wat de stijl en de features betreft, dus het is de moeite waard ze allemaal te verkennen om de optie te vinden die geschikt is voor jouw site.

De meeste hebben gratis versies op WordPress.org, wat het makkelijk maakt ze te testen. Als je je site bij Kinsta host, kun je makkelijk een testsite maken om veilig te testen hoe elke plugin er op je site uit zal zien.

Om nog andere plugins te vinden die je site kunnen verbeteren, kun je ook onze volledige samengestelde lijst van de beste WordPress plugins bekijken.

Jeremy Holcombe Kinsta

Content & Marketing Editor bij Kinsta, WordPress Web Developer en Content Writer. Buiten alles wat met WordPress te maken heeft, geniet ik van het strand, golf en films. En verder heb ik last van alle problemen waar andere lange mensen ook tegenaan lopen ;).