TLWebdesignNL on Github E-mail us! TLWebdesign on Google

Pretty Buttons handleiding

Hieronder tref je de volgende handleidingen aan voor "Pretty Buttons":

Ter info

  • De handleidingen zijn geschreven met Joomla 4.2 en Pretty Buttons 1.1.0 / 1.1.1.
  • Klik op de afbeeldingen voor een vergroting, de afbeeldingen worden in een pop-up venster getoond. Klik naast het venster om terug te keren bij dit artikel.
  • Let op: de module posities zijn afhankelijk van je Joomla 4 template en kunnen dus verschillen.
    Meer informatie hierover vind je hier: https://docs.joomla.org/Finding_module_positions_on_any_given_page/nl

Installatie Pretty Buttons via Download optie

Hieronder staan de stappen om Pretty Buttons te downloaden en installeren in Joomla 4 via de download optie.

  1. Je kunt de Pretty Buttons module downloaden via GitHub (gratis en zonder account):

    Download Pretty Buttons

    Downloaden Pretty Buttons via GitHub

    Klik op Source code (zip), het bestand wordt gedownload.
    (pak het Zip bestand NIET uit). Onthoud de locatie waar je het bestand opgeslagen hebt.
  2. Log in op je back-end (beheer gedeelte) van Joomla 4, doorgaans te benaderen via: https://<jedomein>/administrator/
  3. Log in met je beheer account (SuperAdmin rechten).

    Inloggen back-end Joomla 4

  4. Klik in het Controlepaneel aan de linkerkant op Systeem.

    Joomla 4 back-end menu Systeem

  5. Klik onder het blok Installeren op Extensies.

    Joomla 4 Installeren Extensies

  6. Klik op het tabblad Upload pakketbestand.

    Joomla 4 Upload Extensie via drag and drop

  7. Je kunt de extensie naar het kader slepen (Zip bestand),
    of op de groene knop Of blader naar het bestand, Navigeer naar het bestand en selecteer deze, klik dan op Open.

    Joomla 4 installatie via knop Of blader naar het bestand

  8. De module wordt geïnstalleerd, er komt een melding in beeld: "installeren module is geslaagd".

    Joomla 4 melding Installatie module succesvol

  9. Je kunt de Pretty Buttons module nu configureren. Zie hoofdstuk Configuratie Pretty Buttons.

Installatie Pretty Buttons via Web optie

Hieronder staan de stappen om Pretty Buttons te installeren in Joomla 4 via de Installateren vanaf Web optie.
Je dient deze optie wel te activeren mocht deze optie uitgeschakeld zijn. (Inschakelen plugin: Klik hiervoor op Systeem gevolgd door Plugins en zoek dan op Installeren vanaf web, activeer dan de plugin).

  1. Log in op je back-end (beheer gedeelte) van Joomla 4, doorgaans te benaderen via: https://<jedomein>/administrator/
  2. Log in met je beheer account (SuperAdmin rechten).

    Inloggen back-end Joomla 4

  3. Klik in het Controlepaneel aan de linkerkant op Systeem.

    Joomla 4 back-end menu Systeem

  4. Klik onder het blok Installeren op Extensies.

    Joomla 4 Installeren Extensies

  5. Klik op het tabblad Installeren vanaf web

    Joomla 4 backend - tab installeren van web

  6. Type in het Zoekvenster de naam Pretty Buttons, klik dan op het vergrootglas

    Joomla 4 backend zoeken Pretty Buttons

  7. Klik dan onderin op de Module Pretty Buttons

    Joomla 4 backend installeren Pretty Buttons

  8. Klik dan op de groene knop Installeren

    Joomla 4 backend installeren Pretty Buttons 2

  9. Klik dan onderaan op de blauwe knop Installeren

    Joomla 4 backend installeren Pretty Buttons 3

  10. De module wordt geïnstalleerd, er komt een melding in beeld: "Installeren module is geslaagd".

    Joomla 4 backend Pretty Buttons Installatie Succes melding

  11. Je kunt de Pretty Buttons module nu configureren. Zie hoofdstuk Configuratie Pretty Buttons.

Configuratie van Pretty Buttons

Hieronder staan de stappen om Pretty Buttons te configureren in Joomla 4. Je hebt Pretty Buttons geïnstalleerd via een van de methodes uit vorige hoofdstukken.

  1. Log in op je back-end (beheer gedeelte) van Joomla 4, doorgaans te benaderen via: https://<jedomein>/administrator/
  2. Log in met je beheer account (SuperAdmin rechten).

    Inloggen back-end Joomla 4

  3. Klik in het controlepaneel aan de linkerkant op Systeem.

    Joomla 4 back-end menu Systeem

  4. Klik onder het blok Beheren op Website modules.

    Joomla 4 backend website modules

  5. Je ziet dan Pretty Buttons als nieuwe module er tussen staan (status niet gepubliceerd).

    Joomla 4 backend Website Modules

  6. Klik onder Title op Pretty Buttons. Zie bovenstaande printscreen.
  7. Pas bij Titel* de naam aan naar bijvoorbeeld Contact Informatie

    Joomla 4 backend Module Titel Aanpassen

    (je kunt de titel uiteraard ook uitschakelen. Klik hiervoor aan de rechterkant bij Titel op Toon, de optie verandert naar Verberg).
  8. Selecteer bij Positie de juiste module positie van je template. In dit voorbeeld met Casiopeia template Sidebar-rechts [sidebar]-right].

    Joomla 4 backend Titel en Module Positie aangepast

  9. Selecteer bij Status de optie, en kies de optie Gepubliceerd. (Standaard staat een nieuwe module altijd de Status op Gedepubliceerd). Zie bovenstaande printscreen.
  10. Klik op het tabblad Menutoewijzing en geef hier aan op welke pagina’s (menu items) je de module wil tonen, standaard staat deze namelijk op Geen Pagina’s!

    Joomla 4 backend menu toewijzing geen

    1. Kies voor Alle Pagina’s, zodat de module op alle pagina’s getoond wordt.

      Joomla bacend Menu Toewijzing Alle pagina's

    2. Kies voor Alleen op de geselecteerde pagina’s en de module wordt op de geselecteerde pagina’s getoond.

      Joomla 4 backend Menu Toewijzing GeselecteerdePagina's

    3. Kies voor Op alle pagina’s behalve de geselecteerde en de module wordt op de NIET geselecteerde pagina’s getoond.

      Joomla 4 backend Menu Toewijziging Alle paginas behalve

  11. Klik op het tabblad Extra Inhoud.

    Joomla 4 backend Extra inhoud

  12. Voer bij Inhoud voor knoppen de tekst in die boven de knoppen moet komen te staan. Zie printscreen Stap 11.
  13. Voer bij Inhoud na de knoppen de tekst in die onder de knoppen moet komen te staan. Zie printscreen Stap 11.
  14. Klik op het tabblad Knoppen en voeg nu minimaal 1 knop toe.
    1. Vul bij Knop Tekst de tekst van de knop in (bijvoorbeeld Stuur een e-mail), zie printscreen Stap 14 d.
    2. Vul bij URL* de link in waarnaar de knop moet verwijzen, in dit voorbeeld: mailto:Dit e-mailadres wordt beveiligd tegen spambots. JavaScript dient ingeschakeld te zijn om het te bekijken., zie printscreen Stap 14 d.
    3. Selecteer bij Doel* of de URL in een nieuw venster moeten openen (Open link in nieuws venster (BLANK). Of open link in hetzelfde venster (SELF), zie printscreen Stap 14 d.
    4. Vul bij Icoon class de Font Awesome icoon in (of laat deze leeg indien je GEEN icoontje erbij wil plaatsen). In dit voorbeeld far fa-envelope voor een envelopje.

      `Joomla 4 backend knoppen

    5. Selecteer een of meerdere opties bij Bootstrap 5 Knop Classes* De kleuren en knopgroottes staan er ter indicatie bij.
  15. Klik op Opslaan en bekijk het resultaat in de front-end (bezoekers gedeelte) van je website.
  16. Voer desgewenst nog eventuele aanpassingen door.
    Indien je klaar bent klik dan op Opslaan & Sluiten (als je nog aanpassingen hebt doorgevoerd, of op Sluiten als je geen veranderingen meer hebt doorgevoerd).

    Joomla 4 backend Opslaan en Sluiten

  17. Hieronder het resultaat:

    Joomla 4 front-end Eindreultaat Pretty Buttons

Andere voorbeelden treft je hier aan: https://extensions.tlwebdesign.nl/pretty-buttons

Toekennen of aanpassen module positie / paginaweergave Pretty Buttons

Hieronder staan de stappen om Pretty Buttons toe te kennen (of aan te passen) aan een module positie inclusief pagina’s in Joomla 4.

  1. Log in op je back-end (beheer gedeelte) van Joomla 4, doorgaans te benaderen via: https://<jedomein>/administrator/
  2. Log in met je beheer account (SuperAdmin rechten).

    Inloggen back-end Joomla 4

  3. Klik aan de linkerkant op Systeem

    Joomla 4 back-end menu Systeem

  4. Klik in het blok onder Beheren op Website modules

    Joomla 4 backend website modules

  5. Klik op de Pretty Buttons module (zie kolom type)

    Joomla 4 backend Website Modules

  6. In het tabblad Module vind je aan de rechterkant de optie Positie, selecteer hier de gewenste module positie, klik op de knop Opslaan.

    Joomla 4 backend Titel en Module Positie aangepast

  7. Klik op het tabblad Menutoewijzing en geef hier aan op welke pagina’s (menu items) je de module wil tonen, standaard staat deze namelijk op Geen Pagina’s!

    Joomla 4 backend menu toewijzing geen

    1. Kies voor Alle Pagina’s, zodat de module op alle pagina’s getoond wordt.

      Joomla bacend Menu Toewijzing Alle pagina's

    2. Kies voor Alleen op de geselecteerde pagina’s en de module wordt op de geselecteerde pagina’s getoond.

      Joomla 4 backend Menu Toewijzing GeselecteerdePagina's

    3. Kies voor Op alle pagina’s behalve de geselecteerde en de module wordt op de NIET geselecteerde pagina’s getoond.

      Joomla 4 backend Menu Toewijziging Alle paginas behalve

  8. Klik tot slot op de knop Opslaan en sluiten.

    Joomla 4 backend Opslaan en Sluiten

  9. Test nu of de module op de juiste pagina of pagina’s getoond wordt.

Updaten van Pretty Buttons

Hieronder staan de stappen voor het updaten van Pretty Buttons in Joomla 4.
Zodra er een update beschikbaar gekomen is, wordt deze zichtbaar in de back-end van Joomla. Net zoals dat voor de meeste andere Joomla extensie updates geldt. De update wordt zichtbaar in het Controlepaneel in het blok Notificaties, of onder Systeem Controlepaneel en dan het blok Updates.

Let op: Maak voor het updaten altijd een backup van uw website!

  1. Log in op je back-end (beheer gedeelte) van Joomla 4, doorgaans te benaderen via: https://<jedomein>/administrator/
  2. Log in met je beheer account (SuperAdmin rechten).

    Inloggen back-end Joomla 4

  3. Klik in het blok onder Notificaties op Er zijn updates beschikbaar.

    Joomla 4 backend - update beschikbaar

    (of via Systeem onder blok Update, op Extensies), de eventuele updates worden dan zichtbaar.
  4. Plaats een vinkje voor Pretty Buttons (in dit voorbeeld, volgt de update van versie 1.1.0 naar versie 1.1.1) en klik op de knop Update, 

    Joomla 4 backend Installeren Update vinkje plaatsen

  5. Er komt een melding in beeld “Updaten Pakket is geslaagd”

    Joomla 4 update installeren succesvol

  6. Controleer of Pretty Buttons nog steeds naar behoren werkt.

Verwijderen Pretty Buttons

Mocht je geen gebruik meer willen maken van Pretty Buttons, dan kun je deze weer verwijderen (oftewel deinstalleren), door deze te verwijderen. Hieronder staat beschreven hoe je de module extensie kunt verwijderen in Joomla 4:

  1. Log in op je back-end (beheer gedeelte) van Joomla 4, doorgaans te benaderen via: https://<jedomein>/administrator/
  2. Log in met je beheer account (SuperAdmin rechten).

    Inloggen back-end Joomla 4

  3. Klik aan de linkerkant op Systeem.

    Joomla 4 back-end menu Systeem

  4. Klik onder het blok Beheren op Extensies

    Joomla 4 backend Beheren Extensies

  5. Type in het zoekvenster Pretty Buttons en klik op het vergrootglas.

    Joomla 4 backend zoeken pretty buttons

  6. Plaats een vinkje voor de extensie Pretty Buttons, klik dan op de knop Deinstalleren

    Joomla 4 backend deinstalleren Pretty Buttons

  7. Klik dan op de knop OK

    Joomla 4 backend deinstalleren Pretty Buttons bevestigen

  8. De extensie wordt nu verwijderd. Er komt een melding in beeld “Deinstalleren van de module” is geslaagd.

    Joomla 4 backend deinstallateren Pretty Buttonsn geslaagd

Mocht je tegen problemen aanlopen, laat het ons weten klik op onderstaande knop. Alleen op die manier kunnen we deze extensie verder optimaliseren.

Meld probleem

Ben je tevreden, laat dan een review achter op de Joomla Extensions Directorypagina: https://extensions.joomla.org/extension/pretty-buttons/

Alvast bedankt daarvoor!