Vi kan nu starte alvorlige ting. Oprettelsen af skyderen på Slider revolution kan være ganske kedelig i starten. Du mister dine lejer, fordi du vil vide, hvor er dette eller det pågældende element.
Du vil slippe af med Slider Revolution ved at øve med vane og også læse denne tutorial.
Under vores tidligere tutorials opdagede vi, hvordan:
- Download og installer Slider Revolution
- Sådan forstås Slider Revolution Home UI
- Sådan opretter du et lysbilledshow på Slider Revolution
Og nu, når vi har konfigureret vores skyderen, vil vi oprette dias "Af" skyderen '.
Sådan kommer du i gang med "Slides" -editoren
I princippet får du adgang til, når du har gemt en skyderkonfiguration til en ny grænseflade, der introducerer dig til redaktøren af " dias '.
Du vil bemærke øverst den samme værktøjslinje, der giver dig mulighed for at vende tilbage til listen over "glider eller dias" til parametrene for skyderen og forhåndsvisningen af skyderen blandt andre.
Oplev også vores 10 WordPress-plugins, der giver dig mulighed for at bedømme dine blogindlæg
Nederst har vi et nyt afsnit, der giver os mulighed for at se, de globale lag, de forskellige "dias" og knappen for at tilføje et nyt " glide '.
Ved at holde musen hen over knappen på et lysbillede, vil du bemærke, at nye indstillinger vises. Disse indstillinger er ret klare og lette at forstå (duplikat, tilføj til skabelonen for at genbruge den senere og slette diaset).
Ved at holde musen hen over knappen til tilføjelse af dias, vil du bemærke andre indstillinger, der giver dig mulighed for at tilføje et tomt lysbillede, tilføje flere dias, tilføje et dias fra en skabelon (model).
I øjeblikket er du på diaset 1, hvorfor det er fremhævet på diaslisten. Hvis du opretter en ny dias, fremhæves det i stedet for det første dias.
Slider Revolution på dette niveau er et ægte instrumentbræt. Hvis jeg forklarer dig alt, forstår du ikke meget, så jeg undgår at tale om funktioner, der kan være forvirrende og ikke væsentlige.
Læs vores artikel om 6 WordPress-billedkomprimerings plugins til din blog
Når du har valgt et dias, kan du begynde at redigere i det følgende afsnit. Dette afsnit består af flere faner (7), der giver dig adgang til forskellige funktioner.
Sådan tilføjes et baggrundsbillede til en scene
Den første ting, du skal gøre først, er at tilføje en baggrund til vores dias. Her har du valget mellem: Et baggrundsbillede (fra dit mediebibliotek), en ekstern URL, der peger på et billede, en gennemsigtig baggrund, som vil bruge den farve, der foreslås af WordPress tema, en fast farve, en Youtube-, Vimeo- eller HTML5-video. Vi vælger en baggrund" billede '.
Du kan finde mange gratis billeder på nettet. Bare søg på Google.
Når du tilføjer et billede, gælder dette straks i diaseksemplet og i "scenen".
Sådan tilføjes et element i en scene
Nu hvor vi har en velindrettet scene, tilføjer vi et element. Hvert element, du tilføjer til en scene, betragtes som et lag eller lag. Denne lagfunktion hjælper dig med at tro mig.
Hold musen over for at tilføje et element til scenen Tilføj lag '.
Du vil bemærke, at du kan tilføje flere forskellige elementer, herunder: tekst / HTML, billeder, lyd, video, en knap, en figur, et objekt og importere et element.
Vi starter med at tilføje et gennemsigtigt billede af den lille hvalp af Snoopy.
Tilføj derefter dette billede i scenen, så får du noget lignende:
Du vil bemærke, at der i de fire hjørner af billedet er små firkanter. Disse firkanter tillader os at ændre størrelsen på billederne, da Snoopy i dette tilfælde optager meget plads.
Ændring af størrelse ændres af " Træk ". For at ændre størrelsen mens du holder proportioner, skal du holde " Maj Fra dit tastatur, mens du ændrer størrelse.
Se også vores 10 WordPress plugins, der vil gøre dig til en bedre Blogger
Nu ser Snoopy sådan ud, det er mere passende. Du kan også vende et billede ved hjælp af indikatoren øverst til højre på hvert billede på denne måde:
Sådan placeres elementer med hjælpenettet
Hjælpenettet er et værdifuldt element, der hjælper med at placere elementerne bedre. Du kan aktivere hjælpenettet nederst til venstre på scenen.
Dette gitter har fliser med forskellige størrelser, jo mindre størrelse, jo mere præcis vil du være i placeringen af elementet.
Hvordan at tilføje animation
Der er 3 typer animationer på Slider Revolution: indgangsanimationer, animationer under (eksistensen af elementet i scenen) Og ende animationer.
Se også vores 6 WordPress-billedkomprimerings plugins til din blog
For at føje en animation til et element skal du først vælge den ved at klikke på det (når et element vælges, indrammes det af en stiplet linje med størrelsesordener hjørner).
Så klik på Snoopy, gå op på siden og klik på fanen « Animation '.
I det forrige billede har jeg input-animationerne i blåt og output-animationerne i rødt.
For at ændre en animation skal du klikke på rullelisten efter ikonet for den kørende mand.
Derefter har du en bred vifte af animationer til din rådighed. Jeg overlader det til dig at vælge den animation, du vil definere for indtastningen af et element. For min del valgte jeg " easeOutElastic »For at få dette resultat:
Her for dig vores 4 WordPress-plugins for at øge sidefoden til din blog
Længere til venstre kan du bestemme varigheden af animationen og den animationstilstand, du har brug for at forlade på " ingen split Fordi de andre indstillinger kun gælder for tekst, ikke billeder.
Lire aussi Sådan skjules titlerne på artikler og WordPress-sider
Nu vil jeg gerne flyde Snoopy, for det, gå til " Loop Og vælg "på rullemenuen" Wave ". Nu flyder Snoopy:
Sådan konfigureres elementernes synlighed
Min Snoopy flyder, men jeg vil ikke have, at den skal være synlig på mobilen. Så klik på " synlighed »Og på Smartphone-ikonet skal du sørge for, at det er deaktiveret:
Sådan justeres elementernes opførsel
For at optimere indlæsningen af skyderen skal du muligvis forsinke indlæsningen af billederne. Dette gøres under fanen " adfærd Med indstillingen " Lazy Loading ". Du kan endda tvinge elementers lydhørhed.
Sådan opretter du brugerdefinerede triggere på et element
Handlinger giver dig mulighed for at knytte triggere til specifikke handlinger. Klik på fanen for at tilføje en trigger handlinger »Derefter på knappen« + ».
Der er 3 typer af triggere:
- Den klik er den handling at klikke med musen
- Musen indtastes over elementet
- Musens udgang over elementet
Listen over handlinger er ret lang. For eksempel kan du omdirigere en bruger, der klikker på Snoopy til en anden side ved at vælge handlingen " enkelt link Hvilket giver nye muligheder.
Oplev også vores 10 premium WordPress plugins fra Booking og Booking
Sådan bruges Slider Revolution TimeLine
Slider Revolution tilbyder en tidsstyringsgrænseflade i bunden. Denne grænseflade giver dig mulighed for at se, hvor animationen af et element starter, og hvor det slutter.
På det forrige billede vil du bemærke to blå pile. Den første til venstre angiver begyndelsen på input-animationen til et element, og den anden angiver slutningen af input-animationen. Den mørkerøde farve angiver produktets levetid i scenen.
Lire aussi Hvordan at tilføje en nedtælling på din WordPress blog
Du vil finde en ende, der også ligner den anden ende af en varighed (input-animation, levetid og slutanimation).
Med " tidslinje Du vil være i stand til at kontrollere, hvilket element der vises før, og hvilket element forsvinder først. Det er et meget praktisk værktøj, som du har brug for at mestre for at lave god animation.
Tidslinjen har også en afspiller, som du kan aktivere for at få vist et objektbillede.
Indtil da gav jeg dig det grundlæggende at oprette et dias. Gem nu skyderen, og start forhåndsvisningen.
Det er alt sammen til denne tutorial, i et næste skal vi tale om visningen af en skyder på en artikel og nogle avancerede operationer.
Oplev også nogle temaer og premium WordPress-plugins
Du kan bruge andet WordPress plugins for at give et moderne udtryk og for at optimere håndteringen af din blog eller hjemmeside.
Vi tilbyder dig her nogle premium WordPress-plugins, der hjælper dig med det.
1. Disk Audio
Disk Audio er en anden WordPress plugin som vil hjælpe dig med at vise en lydafspiller direkte på din hjemmeside med blot et tryk på en knap. Lydafspillerens layout er fuldstændig responsivt, så mobile brugere vil være i stand til at nyde dens funktioner uden besvær.
Derudover tilbyder den mange tilpasningsmuligheder, herunder farveskemaer, udseende, baggrundsbilleder og opacitet. Det har flere muligheder for at kontrollere det ved hjælp af tastaturet og det giver dig også mulighed for at se din afspilningsliste med en justerbar rullepanel.
Læs også: 10 WordPress plugins til at forbedre søgningen på din blog
Du kan også integrere downloadlink på musikafspilleren for at vise brugere, hvor de kan gå for at købe det nummer, der spilles på dit websted.
Downloade | demo | Web-hosting
2. Begivenhed Booking Pro
Dette er en anden WordPress plugin 100% responsiv, nem at tilpasse og dedikeret til håndtering af reservationer på enhver hjemmeside, som tilbyder sine tjenester inden for begivenheder.
Dets vigtigste funktioner inkluderer: tilpasning af tekst, farve, rammer og andre, support til PayPal, styring af kuponkoder og kuponer, support til Google Maps, støtte til styring af e-mails, understøttelse af kortkoder, intuitivt kontrolpanel, nem oprettelse af begivenheder, total kontrol over udseendet osv.
Downloade | demo | Web-hosting
3. Social Share & Locker Pro
Social Share & Locker Pro-udvidelsen er designet til at hjælpe dit websted med at blive mere synligt på sociale netværk. Med blot et par klik kan du enten indstille placeringen af dine sociale ikoner eller låse dit indhold ved at kræve deling på et af de sociale netværk, du tilbyder.
Du har 10 foruddefinerede temaer, og dette skal dække de mest almindelige ønsker. Alle hendes temaer er nethinde og arbejder vidundere.
30 ting at gøre på dine blogindlæg efter deres offentliggørelse Oplev dem ved at læse denne artikel.
Også med Social Share & Locker Pro kan du vise det fulde navn på sociale netværk eller bare ikonet. Det afhænger af dit design, den ledige plads eller dine ønsker.
Downloade | demo | Web-hosting
Anbefalede ressourcer
Find ud af om andre anbefalede ressourcer, der hjælper dig med at opbygge og administrere dit websted.
- Hvordan man bliver en succesrig blogger og tjener penge med WordPress
- Sådan integrere Google Forms WordPress
- Sådan opretter du en privatlivspolitik på WordPress
- 6 WordPress-plugins for at sikre RGPD-overholdelse af en blog
Konklusion
Her er ! Det er det til denne guide. Vi håber, at denne vejledning har givet dig det grundlæggende i at oprette et lysbilledshow med Slider Revolution på en WordPress-blog eller et websted. Hvis du har spørgsmål, forslag eller kommentarer, skal du lade dem stå i vores afsnit kommentarer.
Du vil dog også kunne konsultere vores ressourcer, hvis du har brug for flere elementer til at udføre dine projekter med oprettelse af internetsider ved at konsultere vores guide om WordPress blog oprettelse.
Tøv ikke med at del med dine venner på dine foretrukne sociale netværk.
...
Hej,
Jeg vil tilføje et ar-billede på en skyder, jeg går til ar plan, som kilde vælger jeg Baggrund/Hovedbillede, men jeg har ikke den blå "skift billede"-knap, så jeg forstår ikke hvordan man vælger det ønskede billede for at vise det som en ramme af min skyder ... har du en idé?
Tak
Walter