den glidere er elementer som finnes på nesten alle hjemmesidene til nettsteder. Smart Skyve 3 er en kraftig plugin tilgjengelig i gratis og premium versjon.

Hovedfunksjonene i denne plugin-en

Som en funksjon tilbyr den blant annet:

  • Et intuitivt brukergrensesnitt
  • En dra-og-slipp-videosidebygger med Live Preview / 8
  • Dynamiske lysbilder som kan opprettes ved hjelp av artikler og filtreres etter ID eller tilpassede sider
  • Lysbilde generasjon (Dynamisk) fra en rekke sosiale nettverk (Facebook, Dribbble, Flickr, Instagram, Twitter, YouTube og mer).
  • Tilpassbare kontrollskyver 
  • Glidende animasjoner i bakgrunnen (Ken Burns)

Gratis vs Premium

Hvis alt du leter etter er en grunnleggende glidebryter, Smart Slider 3 er tilgjengelig på WordPress.org i programtilleggskatalogen. Selv gratisversjonen er imponerende og spesiell sammenlignet med noen av de andre glidebryterne.

En personlig lisens for én side koster bare $ 25 (fornyelsen er på 15 $).

Smart-Skyve-maler

Det er noen viktige forskjeller mellom gratis- og premiumversjonen når det gjelder innhold og funksjoner. Her er hva du får med premiumversjonen:

  • En ubegrenset generator av dynamiske lysbilder
  • Avanserte kommandoer
  • Ekspertmodus
  • Animasjoner i bakgrunnen
  • En bildeviser og redaktør
  • 43 skyvedemoer

Opplæring: Opprette en grunnleggende glidebryter

Hvis du aldri har installert WordPress, oppdager du Hvordan installere en WordPress blogg 7 trinn et Hvordan finne, installere og aktivere en WordPress tema på bloggen din.

Når den er aktivert, WordPress Plugin Slider Smart setter sin egen meny nederst på WordPress-adminpanelet.

Hvis du aldri har installert en WordPress Plugin oppdage Hvordan installere en plugin i WordPress

Klikk på menyen Smart Slider, åpnes hovedgrensesnittet der det første alternativet du ser er en stor grønn knapp: " Opprett Slider » som åpner et innledende konfigurasjonsvindu som du ser nedenfor.

Smart-Slider-Lag-Slider

Derfra kan du navngi glidebryteren din og velge en generell stil. Det er mange stiler å velge mellom (som full bredde, helside, karusell, miniatyrbilde og mer), men vi kommer til å gå med en blokkglidebryter basert på utformingen av vårt eksisterende nettsted.

Klikk på "Skape" og Slider Smart vil begynne å designe din grunnleggende glidemodell. Etter noen sekunder vil du finne deg selv på en side som inneholder alle de grunnleggende detaljene om plugin-modulen.

Oppdag Hvordan lage en personvernpolicy på WordPress

Den første tingen å merke seg her er delen " Publish Slider". Du må bruke en av disse tre metodene (Shortcode, Page- eller Post-editor, eller PHP-kode) når det er på tide å publisere lysbildet ditt (n ° 1 nedenfor). Før vi kan gjøre det, må vi lage lysbilder.

Det er her pluginet virkelig viser brukervennligheten.

Alt du trenger å gjøre er å klikke på den grønne knappen " Legg bilde lysbilde "(n ° 2 nedenfor) og mediebiblioteket ditt åpnes. Derfra kan du velge så mange bilder du vil, eller starte med bare ett, og deretter klikke " Plukke ut I mediebibliotekvinduet.

Smart-Slider-New Slides

Merk: Du er ikke begrenset til bilder når du velger lysbildet. Du kan også bruke video eller artikler, samt lage tomme, statiske eller dynamiske lysbilder.

Consult Slik dupliserer (kopierer) sidene dine på WordPress: Opplæringen

Smart Slider laster lysbildet ditt inn i grensesnittet, og du er klar til å lagre og publisere eller begynne å tilpasse. Men hvis jeg publiserer lysbildefremvisningen, vil den fungere bra, men det er ikke helt det jeg lette etter, som du kan se på bildet nedenfor.

Smart Slider Off Center 1

For å rette på dette gikk jeg til menyen "Størrelse" og jeg rullet ned til seksjonen responsiv modus. Utvalget var "Full bredde", så jeg valgte "Auto" og reddet fremgangen min. Derfra kom jeg tilbake til " Generelt "og en valgt midtstilling.

Smart-Slider-Size-Change

Når jeg snakker om brukervennlighet her, må du huske på det hele denne prosessen tok mindre enn 5 minutter for min første gang forsøk.

Nå er det på tide å jobbe på selve lysbildet. Når du holder markøren over lysbildene dine i visningsområdet, vil du legge merke til at en grønn rute vises øverst til venstre. Som du kanskje har gjettet, markerer du dette lysbildet som det første i sekvensen ved å klikke.

Se også 5 utmerket premium WordPress plugins for å legge til en glidebryter

Med glidebryteren min opprettet og bakgrunnen på plass, var det på tide å legge til litt innhold og overganger. For å utføre dette trinnet, klikket jeg ganske enkelt på lysbildet jeg ønsket å redigere, som går til lagdelen.

Det er mange individuelle innstillinger i høyre panel, men hvis du blar nedover, finner du et bilde av lysbildet. Du kan deretter klikke på et av elementene i venstre panel for å plassere dem på lysbildet.

Smart-Skyve-elementer

Å lage disse lysbildene er en annen skole. Det er så mange alternativer tilgjengelig. For å gi deg en ide om hvor fleksibel dette pluginet er, ta en titt på hva hvert element kan gjøre for glidebryteren din via:

  • En meny
  • animasjoner
  • Laginnstillinger

I hver av disse menyene er det flere undermenyer. Når du for eksempel oppretter et tekstelement, kan du justere fontinnstillinger som: 

  • Fontfamiliene
  • Tekstfarge
  • skriftstørrelse
  • Høyden på linje
  • Dekorasjonen av teksten
  • Justering
  • Avstand mellom bokstaver og ord
  • Innstillinger for tekstredigering
  • Tekstskygge

Hvert tekstelement på glidebryteren kan ha unike innstillinger, unike animasjoner og sine egne synkroniseringsinnstillinger. Det er til og med et avsnitt for Tilpasset CSS.

Når du legger elementer og animasjoner til lysbildet ditt, vil du i pro-versjonen også legge merke til en kalenderfunksjon, som lar deg gjøre det kontrollere visningstiden for individuelle elementer og varigheten av animasjonene ved hjelp av enkle skyver.

Jeg stolte på denne funksjonen da jeg la til forskjellige lag for dette lysbildet litt senere.

Smart-Skyve-tidslinje

Legger til lag og animasjoner

Med glidebryteren vår på plass og bakgrunnen installert, er det på tide å introdusere noen differents elementer og lag. Vi begynner med å legge til et bilde av en snømann i lysbildet. For å gjøre dette går jeg til menyen "Lag" og klikk på "Bilde". Dette vil plassere et fiktivt bilde på lysbildet.

Oppdag også Slik konfigurerer du WordPress Slider Revolution-plugin

Derfra kan du klikke på dummy-bildet nederst til venstre, og deretter velge og endre størrelse på bildet i mediebiblioteket.

Smart-Slider-Image-Element-Resize

Når jeg har valgt, satt inn og endret størrelse på bildet mitt, er det på tide å legge til noen grunnleggende animasjoner som kan oppnås med bare noen få trinn.

Den første er å velge fanen "Animasjoner" som vist nedenfor. Når du er ferdig, klikker vi på den grønne animasjonsknappen "I".

Smart-Slider-animasjoner

Det neste skjermbildet er hvor jeg kan velge animasjonen min, samt justere timeplanen. For dette lysbildet introduserer jeg en "RIGHT" -animasjon og øker varigheten til 2200ms.

Leter du etter en ftp for å administrere WordPress-filer og -mapper, oppdager Hvordan bruke FTP på Windows 10

Jeg vil også legge til en forsinkelse på 300 ms. Nederst på dette skjermbildet er det et alternativ å ha en bestemt hendelse og en utløser for den animasjonen, for eksempel en mus svever eller et klikk i lysbildet. Jeg kommer ikke til å komplisere ting med disse innstillingene for dette eksemplet.

Smart-Slider-In-Animasjon-innstillinger

Så skal jeg legge til litt tekst. Følg den samme prosessen som ovenfor, klikk på varen " legge til tekst Og gjør de nødvendige justeringene. Jeg skrev inn teksten og gikk deretter til skriftinnstillingene der jeg endret størrelse og farge.

Jeg legger til en animasjon " Fade In Og justerte kalenderen slik at den starter rett etter snømannanimasjonen.

Du vil også merke i denne menyen at det er en mulighet å ha spesifikk tekst for nettbrett og enheter mobil. Dette er et godt eksempel på hvilke funksjoner som gjør dette pluginet så fleksibelt og brukervennlig.

I noen "andre" glidebrytere ville jeg ha blitt tvunget til å bruke et mediespørsmål og tilpasset CSS.

Smart-Slider-Tekst-Layer-alternativer

Til slutt legger jeg til to lag til. Det første er et tekstlag og det andre er et bildelag. Igjen, jeg går gjennom nøyaktig samme prosess som ovenfor, men jeg har tatt litt ekstra med i timingen av animasjonen. Du kan se de endelige resultatene nedenfor.

Alt i alt var det å lage dette lysbildet en prosess på 20 minutter.

Merk: Konverter dette lysbildet til GIF vil endre visse tidsfrister for de vakre utvalgte animasjonene som jeg har nøye samlet.

Voila! Etter å ha prøvd mye plugins WordPress av glidebryteren, både gratis og premium, kan jeg ærlig si at dette er en av de beste jeg noensinne har testet. Det er ikke bare en spesifikk egenskap som gjør den unik. Det er en kombinasjon av ting som viser hvor flott et plugin det er.

Det er viktig å merke seg at jeg ikke har dekket hver enkelt funksjon.

Oppdag også Hvordan vite hvilket tema som brukes på en WordPress-blogg

Jeg er sikker på at hvis jeg brukte litt mer tid på å jobbe med dette pluginet, ville jeg finne et par ting som jeg ønsker å endre, og kanskje til og med noen få feil. Jeg tror brukervennligheten holder folk der lenge nok til at de til slutt kan dra full nytte av de mange funksjonene som tilbys. Og tro meg, det er mange.

Last ned Smart Slider 3

Oppdag også noen premium WordPress-plugins  

Du kan bruke andre WordPress plugins for å gi et moderne utseende og for å optimalisere håndteringen av bloggen eller nettsiden din.

Vi tilbyr her noen premium WordPress-plugins som vil hjelpe deg å gjøre det.

1. WooCommerce Page Builder

WooCommerce Page Builder er en WordPress Plugin veldig populær som tilbyr et ganske konsistent antall kortkoder og som lar deg lage flere typer personlig tilpassede sider (produkt, handlekurv, kassen, "min konto") på nettstedet ditt WooCommerce. Det er en utvidelse av Visual Composer plugin som du må installere på forhånd.WooCommerce-side-builder

Takket være denne plugin-en har du muligheten til lage netthandelsnettsteder unik ved bruk av noen WordPress tema, og tjene mye penger.

Last ned | dEMO | Webhotell

2. Elementor

Opprinnelig lansert i 2016, er Elementor WordPress-plugin en av de yngste sidebyggerne på denne listen. Til tross for sin sene start samlet Elementor raskt over 1 000 000 aktive installasjoner på WordPress.org, noe som gjør det til en av Visuelle utbyggere av de mest populære WordPress-sidene.

elementor pro e1544277036401
Det som gjør sitt rykte kjent er det flytende visuelle grensesnittet, dets forskjellige stilalternativer og andre kraftige funksjoner som fullstendig opprettelse av WordPress-temaer.

Grensesnittet er delt inn i to hoveddeler, med en tredje sone for visse parametere. Gratisversjonen av Elementor tilbyr 28 gratis widgets. Pro-versjonen bringer 30 andre widgeter, totalt 58-widgeter i Pro-versjonen. Gratisversjonen inneholder omtrent 40 gratis maler, mens Pro-versjonen gir hundrevis av ekstra maler.

 Last ned | dEMO | Webhotell

3. Ninja Popups

Med over 30 000 salg og 4,4 stjerner er Ninja Popups en av de WordPress plugins de mest populære tilgjengelige på Code Canyon.

Ninja Popups wordpress plugins oppretter popup pop up opt in

I tillegg til et stort utvalg av modeller for en rekke bruksområder, kommer den også med flere funksjoner som: en visuell byggherre av Popup, 10 forskjellige skjermposisjoner av popup-vinduer, 74 forskjellige animasjonseffekter, støtte for anti-blokkeringsteknologi for å omgå annonseblokkere, en rekke målrettingsalternativer, statistikk i dashbord, blokkering av innhold for opt-in e-post eller deling på sosiale medier, massevis av integrasjoner med e-postmarkedsføringstjenester og mer.

Last ned | dEMO | Webhotell

Anbefalte ressurser

Finn ut om andre anbefalte ressurser for å hjelpe deg med å bygge og administrere nettstedet ditt.

konklusjonen

Her er ! Det er det for denne opplæringen, og jeg håper det vil hjelpe deg med å enkelt lage glidebrytere eller lysbilder ved hjelp av WordPress Smart-Slider-pluginHvis du likte det, ikke nøl med å gjøre det del med vennene dine på dine favoritt sosiale nettverk

Du vil imidlertid også kunne konsultere våre ressources, hvis du trenger flere elementer for å gjennomføre prosjektene dine med oppretting av nettsteder, ved å konsultere vår guide om WordPress blog oppretting.

Men i mellomtiden, fortell oss om din commentaires og forslag i den dedikerte delen.

...