Hoe maak je een homepage Slider in WordPress [2021]

In het bericht van vandaag behandelen we alles wat u moet weten over het maken van een slider in WordPress.

Zoals altijd is hier de videogids:

een slider is een super gemeenschappelijk websiteontwerp element dat tekst, afbeeldingen en video ‘ s laat zien door van de ene dia naar de volgende te “schuiven”.

ze worden vaak gebruikt op zakelijke en portefeuillewebsites.

er zijn een heleboel grote gratis sliders om uit te kiezen, maar je kunt ook een aantal echt mooie betaalde sliders vinden.

Sliders kunnen worden geprogrammeerd om diavoorstellingen automatisch uit te voeren, op het moment dat iemand uw website raakt – om de paar seconden overschakelt naar de volgende dia.

of, schuifregelaars kunnen statisch zijn en lezers laten klikken op een kleine pijl, bijvoorbeeld, om naar de volgende dia te vegen.

sommige websites gebruiken sliders om hun meest recente berichten weer te geven. Ze voegen meestal een link toe aan de dia ‘ s, zodat als iemand het artikel wil lezen, ze gewoon op de link kunnen klikken en naar de inhoud kunnen gaan.

een ding om in gedachten te houden met sliders is dat ze kunnen vertragen uw website een beetje wanneer het probeert om een bos van afbeeldingen of andere inhoud te laden. Maar dit kan worden beperkt door het versnellen van de snelheid van het laden van afbeeldingen.

een ander potentieel probleem is mobiele gereedheid.

Google geeft nu prioriteit aan websites die mobiel reageren, dus u moet ervoor zorgen dat uw website is gemaakt voor mobiel, ongeacht of u een slider gebruikt of niet.

maar als u een slider gebruikt, moet u ervoor zorgen dat het ook reageert, zodat het er niet raar uitziet op mobiele apparaten, waardoor de klantervaring wordt verpest, en niet overeenkomt met de Google-richtlijnen, waardoor uw SEO-impact wordt verminderd.

maar met al dat gezegd hebbende, bieden sliders veel voordelen.

Homepage sliders kunnen u helpen een aantal dingen te doen die u zonder hen niet zou kunnen doen.

Sliders kunnen uw producten voor u laten zien op uw homepage, wat natuurlijk leidt tot bezoekers om erop te klikken en meer te zien, wat vrij gebruikelijk is als u een e-commerce website draait.

Sliders zijn visueel aantrekkelijk. Ze trekken de aandacht door het weergeven van interessante inhoud en kan helpen ervoor te zorgen dat uw bezoekers blijven rond op uw website.

homepage sliders kunnen worden gebruikt om belangrijke informatie weer te geven. Sliders kunnen bijvoorbeeld worden gebruikt om alle diensten van een bedrijf te tonen. Of het kan worden gebruikt om de top projecten in de portfolio van een freelancer te tonen.

Sliders kunnen belangrijke tekstinhoud, zoals getuigenissen, één na één weergeven. Dit kan zeer krachtig zijn in het bewijzen aan uw websitebezoekers ze op de juiste plaats zijn en u biedt de juiste producten en diensten voor hen.

Nu u weet wat homepage sliders zijn en waarom u er een zou moeten hebben, Lees verder om precies te zien hoe u er een op uw website kunt plaatsen.

Stap #1 – Installeer de WordPress Homepage Slider Plugin

we gaan met behulp van een gratis plugin genaamd smart slider 3 dat is super eenvoudig te gebruiken.

ga eerst naar je WordPress dashboard en zoek het tabblad ” Plugins “in het linkermenu en klik op” Add New.”

typ vervolgens in de zoekbalk de naam van de slider, Slider 3.

zodra u het ziet, klik op “Install Now” en klik vervolgens op “Activate.”

Stap # 2-Maak een nieuwe Slider

Nu u Smart Slider 3 hebt geïnstalleerd, ziet u deze in het linker menu in het dashboard.

Scroll naar beneden en klik erop.

u krijgt 2 opties te zien:

1. Maak een nieuwe slider vanaf het begin
2. gebruik een sjabloon

We zijn allemaal voor het maken van uw eigen sjabloon. Als je je daar goed bij voelt, heb je meer kracht.

maar om heel eerlijk te zijn, we houden van sjablonen. Het biedt een solide basis voor het creëren van iets verbazingwekkends dat uw unieke flair binnen een bewezen kader integreert.

Plus, als je haast hebt of gewoon lui bent, zijn sjablonen je beste vriend om dingen gedaan te krijgen met veel tijd.

voor deze tutorial gaan we klikken op “Template Library.”

u krijgt een heleboel sjablonen te zien waaruit u kunt kiezen. Meer dan 180 om precies te zijn.

sommige van hen zullen u een mooie cent kosten.

maar veel daarvan zijn vrij. En als u alleen de gratis sjablonen wilt zien, klikt u op de groene “Gratis” knop.

als u een voorbeeld van een van de schuifregelaars wilt bekijken, klikt u er gewoon op en u krijgt een live voorbeeld van hoe een van deze schuifregelaars er uit zal zien en hoe het op uw website kan functioneren.

zodra u de schuifregelaar kiest die u wilt gebruiken, plaatst u de muisaanwijzer op het sjabloon en klikt u op de knop “Importeren” die verschijnt.

nadat het is geïmporteerd, zult u zien dat u nu 3 dia ‘ s in uw dashboard hebt: dia 1, 2 en 3 die allemaal Optellen om een enkele slider te maken.

u kunt nu elk van hen bewerken om tekst, afbeeldingen en video toe te voegen.

om ze te bewerken, beweeg de muis over een van de dia ‘ s en klik op de “Edit” knop.

u zult merken dat u nu in de visuele editor zit.

als u de tekst wilt wijzigen, klikt u gewoon op de tekst en er verschijnt een klein vakje editor box.

in dit editorvak kunt u de look en feel van de tekst wijzigen door op het pictogram paint can te klikken. Die u toelaat om:

• voeg een link toe aan de tekst.
• Bewerk De kleur van de tekst.
• Wijzig het lettertype.
• kies de grootte en het gewicht van het lettertype.
• enz.

u kunt hetzelfde doen met de knop onder de tekst door erop te klikken.

een andere mogelijkheid om de knop aan te passen is hoe het eruit zal zien als iemand er met zijn muiscursor overheen gaat.

als u op de potloodknop klikt, kunt u de tekst van de knop Wijzigen en ook een link geven waar de knop de lezer naar toe brengt.

u kunt zelfs de gehele schuifregelaar bewerken, niet alleen de elementen in het kader, door erop te klikken (Ik heb net op de witte achtergrond van het kader zelf geklikt om het te selecteren).

Hier kunt u dingen veranderen zoals de achtergrondkleur of de dekking. Als u de dekking omlaag brengt, kunt u de doos een beetje transparanter maken, zodat bezoekers het schip achter de afbeelding kunnen zien.

u hebt veel opties voor aanpassing.

nu gaan we de achtergrondafbeelding voor deze dia veranderen.

scroll omhoog en klik op ” Background.”

u zult zien dat de afbeeldingsknop al is geselecteerd, dus alles wat u hoeft te doen is naar beneden scrollen en de rij met de titel “Background” zoeken.”Daarnaast zie je” Image ” en het zou al een afbeelding moeten bevatten die je kunt ruilen voor degene die je wilt.

verwijder deze afbeelding door er met de muis over te gaan en op de kleine X te klikken die verschijnt.

voeg dan gewoon een nieuwe toe door op de groene knop te klikken. Daarna, ga naar “Bestanden Uploaden” en klik op ” Selecteer bestanden.”

Selecteer nu gewoon de afbeelding die u zoekt en klik op “Open” en klik vervolgens op “Select.”

uw nieuwe afbeelding zit er nu in!

ga dan naar boven en klik op de knop Opslaan in de rechterbovenhoek en klik vervolgens op “Slider” in de linkerbovenhoek om terug te gaan naar het hoofd dashboard.

voordat u verder gaat, heb ik nog een andere nuttige tip voor u.

Scroll iets naar beneden en je ziet een menubalk met tabbladen die zeggen “Publish,” “General,” “Size,” enzovoort.

klik op ” Algemeen.”

Hier vindt u nog een paar aanpassingsopties voor hoe uw slider eruit ziet.

bijvoorbeeld, u kunt wijzigen hoe de animatie van de slider werkt. De standaardinstelling is horizontaal. Als u wilt, kunt u het veranderen om te vervagen van de ene afbeelding naar de andere wanneer u klikt op de pijlen.

maar we laten het voor deze gids.

Stap # 3-Toon uw schuifregelaar op uw Website

ik ga u laten zien hoe u dit kunt doen met de basis WordPress-editor en de element of Pagina builder.

laten we eerst de basis WordPress editor doen.

Hoe maak je een homepage Slider met behulp van WordPress Editor

het enige wat je hoeft te doen is gewoon naar de pagina waar je het op wilt zetten en bewerken.

dus gingen we naar het dashboard in het linker menu, klikte op “Pages” en voegde een nieuwe toe. Maar je wilt misschien een homepage slider, dus in dat geval, ga gewoon naar uw homepage in het WordPress dashboard.

om deze schuifregelaar bovenaan deze pagina toe te voegen, klikt u op de kleine plus-knop in de linkerbovenhoek en zoekt u naar Smart Slider 3.

nadat u op Smart Slider 3 klikt, zal het verschijnen op de editor van uw pagina met een grote blauwe knop die zegt “Selecteer Slider.”Ga je gang en klik erop.

selecteer vervolgens de schuifregelaar die u wilt gebruiken.

nu hoeft u alleen nog maar op “Publish” te klikken en vervolgens nogmaals op “Publish” te klikken. Vanaf daar, u klikt op “Bekijk pagina” om te zien hoe het eruit ziet.

nu zou je je homepage slider moeten zien en het zou perfect moeten werken.

vervolgens zullen we u vertellen hoe u uw slider kunt weergeven met behulp van het element of page builder.

Hoe maak je een homepage Slider met behulp van Element of Page Builder

dus ga terug naar je WordPress dashboard en navigeer naar welke pagina je de slider wilt plaatsen, zoals je homepage.

de makkelijkste manier om dit te doen is om met de muis over uw naam te gaan in de linkerbovenhoek van het WordPress dashboard en op “site bezoeken” te klikken.”

u moet uw homepage bekijken.

Klik hier op “Bewerken met Elementor” in die kleine menubalk op de pagina.

dus als u de schuifregelaar bovenaan de homepage wilt toevoegen, klikt u gewoon op de kleine blauwe plus-knop in het midden bovenaan de pagina.

zoek dan naar Smart Slider 3 in het vak dat links verschijnt.

u ziet opties om uit te kiezen, één met een WordPress-pictogram en één met het schuifpictogram. Kies de optie met de slider pictogram en sleep het in de ruimte waar u uw slider wilt en selecteer vervolgens de slider die u wilt gebruiken.

u ziet uw slider en kunt deze testen in de editor zelf.

nu, als je net als Ik bent, heb je misschien deze kleine witte balken aan de bovenkant en de onderkant van deze slider. Als u wilt om zich te ontdoen van die, klik op de “Geavanceerd” tab in het menu editor aan de linkerkant.

verander dan onder “marge” de waarde naar min 10. Die witte balken moeten nu helemaal weg zijn.

Klik Op ” Update.”

OK, dus zo maak je een slider in WordPress!

aan