de sliders zijn elementen die op bijna alle homepages van websites te vinden zijn. Slider Smart 3 is een krachtige plug-in beschikbaar in de gratis en premium-versie.

De belangrijkste kenmerken van deze plug-in

Als een functie biedt het onder andere:

• Een intuïtieve gebruikersinterface
• Een videopaginabouwer met slepen en neerzetten met Live Preview / 8
• Dynamische dia's die kunnen worden gemaakt met artikelen en gefilterd op ID of aangepaste pagina's
• Slide generatie (Dynamisch) van verschillende sociale netwerken (Facebook, Dribbble, Flickr, Instagram, Twitter, YouTube en meer).
• Aanpasbare bedieningsschuifregelaars 
• Glijdende animaties op de achtergrond (Ken Burns)

Gratis versus Premium

Als u alleen een eenvoudige schuifregelaar zoekt, Smart Slider 3 is beschikbaar op WordPress.org in de map met plug-ins. Zelfs de gratis versie is indrukwekkend en bijzonder in vergelijking met sommige andere schuifregelaars.

Een persoonlijke licentie voor één site kost slechts $ 25 (de verlenging is op 15 $).

Er zijn enkele belangrijke verschillen tussen de gratis en premium-versie qua inhoud en functies. Dit krijg je met de premiumversie:

• Een onbeperkte generator van dynamische dia's
• Geavanceerde commando's
• Expertmodus
• Animaties op de achtergrond
• Een beeldviewer en -editor
• 43 schuifregelaar demo's

Zelfstudie: een eenvoudige schuifregelaar maken

Als je WordPress nog nooit hebt geïnstalleerd, ontdek Hoe maak je een WordPress blog 7 stappen te installeren et Hoe te vinden, installeren en activeren van een WordPress theme op uw blog.

Eenmaal geactiveerd, de WordPress Plugin Slider Smart plaatst zijn eigen menu onderaan het WordPress-beheerderspaneel.

Als u nog nooit een WordPress Plugin ontdekken Hoe maak je een plugin in WordPress installeren

Klik op het menu Smart Slider, wordt de hoofdinterface geopend waar de eerste optie die u ziet een grote groene knop is: " Maak Slider » waarmee een eerste configuratievenster wordt geopend, zoals hieronder wordt weergegeven.

Van daaruit kunt u uw schuifregelaar een naam geven en een algemene stijl kiezen. Er zijn veel stijlen om uit te kiezen (zoals volledige breedte, volledige pagina, carrousel, miniatuur en meer), maar we gaan met een blokschuifregelaar op basis van de lay-out van onze bestaande website.

Klik op "Maken" en Slider Smart begint met het ontwerpen van uw basismodel. Na enkele seconden bevindt u zich op een pagina met alle basisgegevens over de plug-in.

Ontdek Hoe een privacybeleid op WordPress te maken

Het eerste dat hier opvalt, is de sectie ' Slider publiceren". U moet een van deze drie methoden gebruiken (Shortcode, pagina- of berichteditor of PHP-code) wanneer het tijd is om uw dia te publiceren (nr. 1 hieronder). Voordat we dat kunnen doen, moeten we dia's maken.

Dit is waar de plug-in echt zijn gebruiksgemak laat zien.

Het enige dat u hoeft te doen, is op de groene knop ' Voeg afbeelding dia toe "(nr. 2 hieronder) en uw mediabibliotheek wordt geopend. Van daaruit kunt u zoveel afbeeldingen selecteren als u wilt, of met slechts één beginnen en vervolgens op ' kies In het mediabibliotheekvenster.

Remarque: U bent niet beperkt tot afbeeldingen bij het selecteren van uw dia. U kunt ook video's of artikelen gebruiken en lege, statische of zelfs dynamische dia's maken.

raadpleeg Hoe uw pagina's op WordPress te dupliceren (kopiëren): de tutorial

Smart Slider laadt uw dia in de interface en u bent klaar om op te slaan en te publiceren of te beginnen met aanpassen. Maar als ik mijn diavoorstelling publiceer, werkt het prima, maar het is niet helemaal wat ik zocht, zoals je kunt zien in de onderstaande afbeelding.

Om dit te corrigeren ging ik naar het menu "Grootte" en ik scrolde naar beneden naar de sectie responsieve modus. De selectie was "Volledige breedte", dus ik koos "Auto" en redde mijn vooruitgang. Van daaruit ging ik terug naar de " General "en Kies een uitlijning in het midden.

Als ik het hier over gebruiksgemak heb, houd daar dan rekening mee dit hele proces duurde minder dan 5 minuten voor mijn eerste poging.

Nu is het tijd om aan de dia zelf te werken. Wanneer u in de viewport over uw dia's beweegt, ziet u dat er in de linkerbovenhoek een groen vak verschijnt. Zoals je misschien al geraden hebt, zal klikken op deze dia als eerste in de reeks markeren.

Zie ook 5 uitstekende premium WordPress-plug-ins om een ​​schuifregelaar toe te voegen

Met mijn slider gemaakt en de achtergrond op zijn plaats, was het tijd om wat inhoud en overgangen toe te voegen. Om deze stap uit te voeren, klikte ik eenvoudig op de dia die ik wilde bewerken, die me naar de sectie met lagen leidt.

Er zijn veel individuele instellingen in het rechterpaneel, maar als je naar beneden scrolt, vind je een afbeelding van je dia. U kunt vervolgens op een van de items in het linkerdeelvenster klikken om ze op uw dia te plaatsen.

Het maken van deze dia's is een andere school. Er zijn zoveel mogelijkheden. Om u een idee te geven van hoe flexibel deze plug-in is, bekijkt u wat elk element voor uw slider kan doen via:

• Een itemmenu
• Entertainment
• Laag instellingen

In elk van deze menu's zijn er meerdere submenu's. Wanneer u bijvoorbeeld een tekstelement maakt, kunt u lettertype-instellingen aanpassen, zoals: 

• Politie families
• De kleur van de tekst
• lettergrootte
• De hoogte van de lijn
• De decoratie van de tekst
• Uitlijning
• Letter- en woordafstand
• Instellingen voor tekstbewerking
• Schaduw tekst

Elk tekstelement op uw schuifregelaar kan unieke instellingen, unieke animaties en eigen synchronisatie-instellingen hebben. Er is zelfs een sectie voor de Aangepaste CSS.

Terwijl u elementen en animaties aan uw dia toevoegt, ziet u in de pro-versie ook een kalenderfunctie, waarmee u dat kunt doen controle over de weergavetijd van individuele elementen en de duur van hun animaties met behulp van eenvoudige schuifbalken.

Ik vertrouwde op deze functie toen ik iets later verschillende lagen voor deze dia toevoegde.

Lagen en animaties toevoegen

Met onze schuifregelaar op zijn plaats en de achtergrond geïnstalleerd, is het tijd om wat te introduceren differents elementen en lagen. We beginnen met het toevoegen van een afbeelding van een sneeuwpop aan de dia. Om dit te doen ga ik naar het menu "Lagen" en klik op "Afbeelding". Hiermee wordt een fictief beeld op de dia geplaatst.

Ontdek ook Hoe de plug-in WordPress Slider Revolution te configureren

Van daaruit kunt u linksonder op de dummy-afbeelding klikken en vervolgens de afbeelding in de mediabibliotheek selecteren en vergroten of verkleinen.

Nadat ik mijn afbeelding heb gekozen, ingevoegd en vergroot of verkleind, is het tijd om een ​​basisanimatie toe te voegen die in slechts een paar stappen kan worden uitgevoerd.

De eerste is om het tabblad te selecteren "Animaties" zoals hieronder te zien is. Als u klaar bent, klikken we op de groene animatieknop "In".

In het volgende scherm kan ik mijn animatie kiezen en het schema aanpassen. Voor deze specifieke dia introduceer ik een "RIGHT" -animatie en verleng de duur tot 2200ms.

Bent u op zoek naar een ftp om uw WordPress-bestanden en -mappen te beheren, ontdek het Hoe FTP te gebruiken op Windows 10

Ik zal ook een vertraging van 300 ms toevoegen. Onderaan dit scherm is er een optie om een ​​specifieke gebeurtenis en een trigger voor die animatie te hebben, zoals een muisaanwijzer of een klik in de dia. Ik ga de zaken met deze instellingen voor dit voorbeeld niet ingewikkelder maken.

Dan zal ik wat tekst toevoegen. Volg hetzelfde proces als hierboven en klik op het item " tekst toevoegen En breng de nodige aanpassingen aan. Ik voerde de tekst in en ging toen naar de lettertype-instellingen waar ik de grootte en kleur veranderde.

Ik voeg een animatie toe " Fade In En de kalender aangepast zodat deze direct na de sneeuwpopanimatie begint.

U zult in dit menu ook merken dat er een mogelijkheid is om te hebben specifieke tekst voor tablets en apparaten mobiel. Dit is een goed voorbeeld van de soorten functies die deze plug-in zo flexibel en gebruiksvriendelijk maken.

In sommige "andere" schuifregelaars zou ik gedwongen zijn geweest om een ​​mediaquery en aangepaste CSS te gebruiken.

Ten slotte voeg ik nog twee lagen toe. De eerste is een tekstlaag en de tweede is een afbeeldingslaag. Nogmaals, ik doorloop exact hetzelfde proces als hierboven, maar ik heb een beetje extra besteed aan de timing van de animatie. Hieronder ziet u de uiteindelijke resultaten.

Al met al was het maken van deze dia een proces van 20 minuten.

Let op: Converteer deze dia naar GIF zal bepaalde deadlines wijzigen van de prachtig geselecteerde animaties die ik zorgvuldig heb samengesteld.

Alstublieft ! Na het proberen van veel plug-ins WordPress van slider, zowel gratis als premium, ik kan eerlijk zeggen dat dit een van de beste is die ik ooit heb getest. Het is niet slechts één specifiek kenmerk dat het uniek maakt. Het is een combinatie van dingen die laten zien hoe geweldig deze plug-in is.

Het is belangrijk op te merken dat ik niet elke afzonderlijke functie heb behandeld.

Ontdek ook Hoe weet je welk thema wordt gebruikt op een WordPress-blog?

Ik weet zeker dat als ik wat meer tijd zou besteden aan het werken met deze plug-in, ik een paar dingen zou vinden die ik zou willen veranderen, en misschien zelfs een paar bugs. Ik denk dat het gebruiksgemak mensen daar lang genoeg houdt, zodat ze uiteindelijk ten volle kunnen profiteren van de veelheid aan aangeboden functies. En geloof me, er zijn er veel.

Download Smart Slider 3

Ontdek ook enkele premium WordPress-plug-ins  

U kunt andere gebruiken WordPress plugins om een ​​moderne uitstraling te geven en de afhandeling van uw blog of website te optimaliseren.

We bieden hier enkele premium WordPress-plug-ins die je daarbij kunnen helpen.

1. WooCommerce Page Builder

WooCommerce Page Builder is een WordPress Plugin zeer populair, biedt een redelijk consistent aantal shortcodes en stelt u in staat verschillende soorten gepersonaliseerde pagina's (product, winkelmandje, afrekenen, "mijn account") op uw website aan te maken WooCommerce. Het is een uitbreiding van Visuele componist plugin die u vooraf moet installeren.

Dankzij deze plug-in heeft u de mogelijkheid om e-commerce websites maken uniek met willekeurig WordPress theme, en je veel geld verdienen.

Downloaden | demonstratie | web hosting

2. Elementor

De Elementor WordPress-plug-in, oorspronkelijk gelanceerd in 2016, is een van de jongste paginabouwers op deze lijst. Ondanks de late start haalde Elementor snel meer dan 1 actieve installaties op WordPress.org, waardoor het er een van is Visuele bouwers van de meest populaire WordPress-pagina's.

Wat zijn reputatie maakt, is de vloeiende visuele interface, de verschillende stijlopties en andere krachtige functies zoals de volledige creatie van WordPress-thema's.

De interface is verdeeld in twee hoofdonderdelen, met een derde zone voor bepaalde parameters. De gratis versie van Elementor biedt 28 gratis widgets. De Pro-versie brengt 30 andere widgets, in totaal 58-widgets in de Pro-versie. De gratis versie bevat ongeveer 40 gratis sjablonen, terwijl de Pro-versie honderden extra sjablonen bevat.

 Downloaden | demonstratie | web hosting

3. Ninja Popups

Met meer dan 30 verkopen en een beoordeling van 000 sterren is Ninja Popups een van de WordPress plugins de meest populaire die beschikbaar zijn op Code Canyon.

Naast een enorm scala aan modellen voor een verscheidenheid aan gebruik, wordt het ook geleverd met verschillende functies, zoals: een visuele bouwer van Popup, 10 verschillende weergaveposities van pop-ups, 74 verschillende animatie-effecten, ondersteuning voor antiblokkeringstechnologie om advertentieblokkering te omzeilen, een verscheidenheid aan targetingopties, statistieken in de tableau de bord, inhoud blokkeren voor opt-in e-mail of delen op sociale media, talloze integraties met e-mailmarketingdiensten en meer.

Downloaden | demonstratie | web hosting

Aanbevolen bronnen

Lees meer over andere aanbevolen bronnen om u te helpen bij het bouwen en beheren van uw website.

• Hoe een privacybeleid op WordPress te maken
• Hoe de structuur van WordPress-bestanden te begrijpen
• Een navigatiemenu toevoegen aan een WordPress-pagina
• Hoe de plug-in WordPress Slider Revolution te configureren

Conclusie

Alstublieft ! Dat is het voor deze tutorial en ik hoop dat het je zal helpen om eenvoudig schuifregelaars of dia's te maken met behulp van de WordPress Smart-Slider-plug-in. Als je het leuk vond, aarzel dan niet deel met je vrienden op je favoriete sociale netwerken. 

U kunt echter ook onze ressources, als u meer elementen nodig hebt om uw projecten voor het maken van internetsites uit te voeren, raadpleeg onze gids op de WordPress blog creatie.

Maar vertel ons in de tussentijd over uw commentaires en suggesties in de speciale sectie.

...