Wat is een Lightbox in WordPress en hoe deze te implementeren

Wat Is Een Lightbox In Wordpress En Hoe Deze Te Implementeren



Lichtbak ” fungeert als een carrousel in een WordPress-website die een grote hulp is bij het flexibel inzetten van de media op de site. Met deze functie kan de ontwikkelaar aan de media een pagina/post enz. toevoegen, zodat wanneer een gebruiker op de afbeelding klikt, deze met hoge kwaliteit op volledige grootte wordt weergegeven zonder enige tussenkomst van de andere site-items. Op deze manier trekt het de aandacht van de bezoeker, waardoor de site aantrekkelijk wordt.

In deze blog wordt de betekenis van WordPress Lightbox besproken en de procedure om deze te implementeren.

Wat is een lightbox in WordPress?

Een lightbox komt overeen met een pop-upvenster dat wordt weergegeven op berichten/pagina's om een ​​kleinere afbeelding op volledige grootte weer te geven. Het is zodanig dat het fungeert als een galerij om meerdere media-items te importeren/uploaden en deze op de site te implementeren. Wanneer er na de implementatie op de media wordt geklikt, wordt deze gemaximaliseerd en duidelijk op het scherm weergegeven. De meest voorkomende toepassing van Lightbox is weergave afbeeldingen van hoge kwaliteit op de blog door hun grootte te behouden.







Hoe Lightbox in WordPress implementeren?

De LightBox kan met behulp van diverse plugins worden geïmplementeerd/toegepast. In dit geval is de “ Responsieve lightbox en galerij ”-plug-in zal worden gebruikt.



Gebruik de volgende stappen om de lightbox in WordPress te implementeren.



Stap 1: Installeer de plug-in

Installeer eerst de “ Responsieve lightbox en galerij ” plug-in van “ Plug-ins->Nieuw toevoegen ”:





Zodra de installatie en activering zijn voltooid, activeert u de “ Start rondleiding '-knop om de plug-in te gaan gebruiken:



Stap 2: Afbeeldingen toevoegen

Voeg nu een nieuwe galerij toe van “ Galerij->Nieuw toevoegen ”:

Wijs daarna een aangepaste naam toe aan de galerij en gebruik de “ Mediatheek 'optie en trigger' Selecteer afbeeldingen ” om de nieuwe afbeeldingen te uploaden of bestaande afbeeldingen uit de “Mediabibliotheek” toe te voegen:

Markeer hier de afbeeldingen die u wilt gebruiken en druk op de gemarkeerde knop:

Stap 3: Bewerk de geüploade afbeeldingen

Om de afbeeldingen te bewerken of te verwijderen, beweegt u de muis over de doelafbeelding(en) om nieuwe opties weer te geven, als volgt:

Hier kan worden gevisualiseerd dat wanneer u op de knop “ Bewerk afbeelding ”-optie worden verschillende bewerkingsopties zoals Alt-tekst, Titel, Bijschrift en Beschrijving duidelijk, die dienovereenkomstig kunnen worden gevuld. Zorg ervoor dat u na het bewerken op de knop “ Wijzigingen opslaan ' knop:

De Lightbox aanpassen

Voor het aanpassen van de Lightbox zijn er verschillende toegewezen tabbladen, elk met specifieke functionaliteiten. Deze tabbladen worden afzonderlijk toegelicht.

Configuratie(Configuratie) Tabblad: Op dit tabblad kunt u de stijl van de galerij kiezen. Het bevat de genoemde vier opties als keuzerondjes voor de configuratie van de galerij:

Ontwerptabblad: Het bevat meerdere opties voor het wijzigen van respectievelijk de miniatuur, titel, achtergrond en rand:

Tabblad Pagina's: Op dit tabblad kan de ontwikkelaar paginering inschakelen, het type, de positie, enz. specificeren:

Lightbox-tabblad: Hier kan de grootte van de afbeelding worden aangepast, samen met het instellen van de titel en het bijschrift:

Tabblad Diversen: Het maakt het mogelijk om de “ Galerijbeschrijving ' En ' Aangepaste klassen ' enz.:

De Lightbox toevoegen aan WordPress-pagina's/berichten

Na het ontwerpen van de galerij kunnen de berichten of pagina’s ook als lightbox worden toegevoegd. Om dit te doen, plakt u de shortcode in het bewerkingsscherm van het doelbericht/de doelpagina via de onderstaande stappen:

Stap 1: Navigeer naar Alle galerijen

Overschakelen naar ' Galerij > Alle galerijen ' en kopieer de shortcode van de ' Korte code ” kolom:

Stap 2: Plak de code

Hier opent u de pagina (in dit geval) of het bericht dat moet worden gewijzigd met de lightbox en plakt u de shortcode rechtstreeks in het teksteditorblok, zoals hieronder aangegeven:

Laatste website-look

Hieronder ziet u het uiteindelijke uiterlijk van de website na de implementatie van lightbox-afbeeldingen op de startpagina:

Wanneer erop wordt geklikt, fungeren deze afbeeldingen als een carrousel op volledige grootte zonder enige andere functionaliteit:

Conclusie

A ' Lichtbak ' komt overeen met een pop-upvenster dat fungeert als een galerij om meerdere media-items te importeren en op de site te implementeren. Het kan worden toegepast met behulp van verschillende plug-ins. Het omvat ook meerdere aanpassingsopties die kunnen worden toegepast op de doelafbeelding en uiteindelijk kunnen worden geïntegreerd met de functionaliteiten van de site. Dit artikel besprak de werking van “ Lichtbak ” en de methodologieën om het te implementeren.