Gå till innehållet

Hur man skapar ett bildspel med Slider Revolution på WordPress

Divi: det enklaste WordPress-temat att använda

Divi: Det bästa WordPress-temat hela tiden!

mer 901.000-nedladdningar, Divi är det mest populära WordPress-temat i världen. Den är komplett, lätt att använda och levereras med mer än 62 gratis mallar. [Rekommenderas]

Vi kan nu börja allvarliga saker. Skapandet av reglaget på Slider Revolution kan vara ganska tråkig till en början. Du kommer att förlora dina lager, eftersom du vill veta var är detta eller det elementet.

Du kommer att bli av med Slider Revolution genom att öva med vana och även läsa denna handledning.

Under våra tidigare tutorials upptäckte vi hur:

Och nu när vi har satt upp vår reglage kommer vi att skapa bilder "Av" reglaget ".

Så här kommer du igång med "Slides" -redigeraren

I princip har du åtkomst efter att du har sparat konfigureringarna för en skjutreglage till ett nytt gränssnitt som introducerar dig för redaktören för " bilder ".

Editor-in-slide-revolution-reglaget

Du kommer att märka högst upp samma verktygsfält som låter dig återgå till listan med "reglage eller bilder", till parametrarna för skjutreglaget och förhandsvisningen av reglaget bland andra.

Upptäck också vår 10 WordPress-plugins som låter dig betygsätta dina blogginlägg

Revolution-reglaget-bar doutil-edition-of-slide

Längst ner har vi ett nytt avsnitt som låter oss se, de globala lagren, de olika "bilderna" och knappen för att lägga till en ny " glida ".

skapande-of-slide-knapp-reglaget-revolution

Genom att flytta över knappen på en bild, kommer du att märka att nya alternativ visas. Dessa alternativ är ganska tydliga och lätta att förstå (duplicera, lägg till i mallen för att återanvända den senare och ta bort bilden).

reglaget Alternativ-skapande-slide-revolution

Genom att föra muspekaren över knappen Lägg till bild kommer du att märka andra alternativ som låter dig lägga till en tom bild, lägga till flera bilder, lägga till en bild från en mall (modell).

skapande-of-slide-alternativ-revolution-reglaget

För närvarande är du på bilden 1, varför den markeras på bildlistan. Om du skapar en ny bild kommer den att markeras i stället för den första bilden.

andra-slide-skapande-dun-reglaget-reglaget-revolution

Slider Revolution på denna nivå är en riktig instrumentbräda. Om jag förklarar allt för dig förstår du inte så mycket, så jag kommer att undvika att prata om funktioner som kan vara förvirrande och inte väsentliga.

Läs vår artikel om 6 WordPress bildkomprimeringspluggar för din blogg

När du har valt en bild kan du börja redigera i följande avsnitt. Detta avsnitt består av flera flikar (7) som ger dig tillgång till olika funktioner.

Hur man lägger till en bakgrundsbild till en scen

Det första du vill göra först är att lägga till en bakgrund till vår bild. Här har du valet mellan: En bakgrundsbild (från ditt mediebibliotek), en extern URL som pekar på en bild, en transparent bakgrund som kommer att använda den färg som föreslås av WordPress-temat, en fast färg, en Youtube-video, Vimeo eller HTML5. Vi kommer att välja en bakgrund " bild ".

BAKGRUND bild-exempel

Du kan hitta många gratis bilder på webben. Gör bara en sökning på Google. 

Bild-back planen revolutionen-reglaget

När du lägger till en bild gäller detta omedelbart i bilden och i "scenen".

Szene-revolution-reglaget

Hur man lägger till ett element i en scen

Nu när vi har en väl dekorerad scen kommer vi att lägga till ett element. Varje element du lägger till i en scen anses vara ett lager eller ett lager. Denna lagerfunktion hjälper dig att tro mig.

För att lägga till ett objekt i scenen, håll muspekaren över Lägg Layer ".

fly-add-skikt-reglaget-revolution

Du kommer att märka att du kan lägga till flera olika element inklusive: text / HTML, bilder, ljud, video, en knapp, en form, ett objekt och importera ett element.

Vi börjar med att lägga till en transparent bild av den lilla valpen Snoopy.

funny-snoopy-png

Skapa enkelt din webbplats med Elementor

Med Elementor kan du enkelt skapa en webbdesign med ett professionellt utseende. Sluta betala dyra för vad du kan göra själv. [Fritt]

Lägg sedan till den här bilden i scenen, så har du något liknande:

exempel-reglaget-reglaget-revolution

Du kommer att märka att i de fyra hörnen av bilden finns små rutor. Dessa rutor gör det möjligt för oss att ändra storlek på bilderna, eftersom Snoopy i detta fall upptar mycket utrymme.

Storleksändring görs av " drag ". Om du vill ändra storleken medan du håller proportionerna håller du ned " Maj Från tangentbordet medan du ändrar storlek.

Se även vår 10 WordPress plugins som gör dig till en bättre Blogger

nya representation-snoopy-revolution-reglaget

Nu ser Snoopy ut så här, det är mer passande. Du kan också vända en bild med hjälp av indikatorn längst upp till höger på varje bild så här:

rotations dimage-revolution-reglaget

Hur du placerar element med hjälpnätet

Hjälpnätet är ett värdefullt element som hjälper till att placera elementen bättre. Du kan aktivera hjälpnätet längst ner till vänster på scenen.

brödrost daide-revolution-reglaget

Detta rutnät har plattor med olika storlekar, desto mindre storlek, desto mer exakt kommer du att vara i placeringen av elementet.

Investering-of-bilder

Hur man lägger animation

Det finns 3 typer av animationer på Slider Revolution: entréanimationer, animationer under (förekomsten av elementet i scenen) Och slut animationer.

Se även vår 6 WordPress bildkomprimeringspluggar för din blogg

För att lägga till en animation till ett element måste du först välja den genom att klicka på den (när ett element väljs inramas det med en prickad linje med storlek som kan ändras).

Så klicka på Snoopy, gå upp på sidan och klicka på fliken « animering ".

animerade-reglaget-revolution

I föregående bild har jag input-animationerna i blått och output-animationerna i rött.

För att ändra en animering, klicka på listrutan som finns efter ikonen för den löpande mannen.

icon-animerade-reglaget-revolution

Då har du en mängd olika animationer till ditt förfogande. Jag lämnar det åt dig att välja den animering som du vill definiera för inmatningen av ett element. För min del valde jag " easeOutElastic », För att få detta resultat:

Animation-förrätt-snoopy

Här för dig vår 4 WordPress-plugins för att öka sidfoten på din blogg

Längre till vänster kan du bestämma varaktigheten för animationen och animeringsläget du behöver lämna på " Ingen split Eftersom de andra alternativen endast gäller text, inte bilder.

konfiguration-dyn-animerade-reglaget-revolution

Lire aussi Hur man döljer titlarna på artiklar och WordPress-sidor

Nu skulle jag vilja flyta Snoopy, för det, gå till " loop Och på rullgardinsalternativet väljer du " Våg ". Nu flyter Snoopy:

snoppy-flytande

Hur man konfigurerar elementets synlighet

Min Snoopy flyter, men jag vill inte att den ska vara synlig på mobilen. Så klicka på " synlighet »Och på Smartphone-ikonen, se till att den är avaktiverad:

Letar du efter de bästa WordPress-teman och plugins?

Ladda ner de bästa plugins och WordPress-teman på Envato och enkelt skapa din webbplats. Redan mer än 49.720.000-nedladdningar. [EXKLUSIV]

siktelement-revolution-reglaget

Hur du justerar beteendet hos element

För att optimera lastningen av skjutreglaget kanske du vill försena laddningen av bilderna. Detta görs i fliken " beteende Med alternativet " lat Loading ". Du kan till och med tvinga elementens lyhördhet.

beteende-element revolution-reglaget

Hur man skapar anpassade triggers på ett element

Åtgärder gör att du kan associera triggers till specifika åtgärder. För att lägga till en trigger, klicka på fliken Handlingar »Sedan på knappen« + ».

add-a-avtryckaren

Det finns 3 typer av triggers:

  • Klick är handlingen att klicka med musen
  • Musen matar in elementet
  • Musen går ut över elementet

Listan över åtgärder är ganska lång. Du kan till exempel omdirigera en användare som klickar på Snoopy till en annan sida genom att välja åtgärden " enda Länk Vilket kommer att ta fram nya alternativ.

Upptäck också vår 10 premium WordPress plugins från bokning och bokning

Hantering-of-triggers revolutionen-reglaget

Hur man använder Slider Revolution TimeLine

Slider Revolution erbjuder ett gränssnitt för tidshantering längst ner. Detta gränssnitt låter dig se var animeringen av ett element börjar och var det slutar.

början-and-end-dyn-movie-on-reglaget-revolution

På föregående bild kommer du att märka två blå pilar. Den första till vänster indikerar början på inmatningsanimationen för ett element och den andra indikerar slutet på inmatningsanimationen. Den mörkröda färgen indikerar objektets livslängd i scenen.

Lire aussi Hur man lägger till en nedräkning på din Wordpress blogg

Du hittar ett slut som liknar det andra slutet av en varaktighet (input animation, livstid och slut animation).

Med " tidslinje Du kommer att kunna kontrollera vilket element som visas innan och vilket element som försvinner först. Det är ett mycket praktiskt verktyg som du behöver behärska för att göra bra animering.

Tidslinjen har också en spelare som du kan aktivera för att förhandsgranska bilden.

Animation-tidslinje-revolution-reglaget

Fram till dess gav jag dig grunderna för att skapa en bild. Spara nu skjutreglaget och starta förhandsgranskningen.

Säkerhetskopiering och previsulisation

Det är allt för den här tutorialen, i en nästa kommer vi att prata om visningen av en reglage på en artikel och några avancerade funktioner.

Upptäck också några teman och premium WordPress-plugins  

Du kan använda andra WordPress-plugins för att ge ett modernt utseende och optimera greppet på din blogg eller webbplats.

Vi erbjuder dig här några premium WordPress-plugins som hjälper dig att göra det.

1. Disk Audio

Disk Audio är ett annat WordPress-plugin som hjälper dig att visa en ljudspelare direkt på din webbplats genom att bara trycka på en knapp. Layouten på ljudspelaren är helt lyhörd, så mobilanvändare kommer att njuta av dess funktioner utan problem.

Disk-ljudspelare premium wordpress-plugins lägger till ljudspelare

Dessutom erbjuder den många anpassningsalternativ inklusive färgscheman, utseenden, bakgrundsbilder och opacitet. Det har flera alternativ för att kontrollera det med tangentbord och det låter dig också visa din spellista med ett justerbart rullningsfält.

Läs också: 10 Wordpress plugins för att förbättra forskningen på din blogg

Du kan också bädda in nedladdningslänkar på musikspelaren för att visa användare var de kan gå och köpa spåret som spelas på din webbplats. 

Ladda ner | demo | webbhotell

2. Event Booking Pro

Detta är ytterligare ett 100% responsivt WordPress-plugin, enkelt att anpassa och dedikerat till hantering av bokningar på vilken webbplats som helst, som erbjuder sina tjänster inom evenemangsfältet.

Eventbokning pro

Dess huvudfunktioner inkluderar: anpassning av text, färg, gränser och andra, support för PayPal, hantering av kupongkoder och kuponger, stöd för Google Maps, stöd för hantering av e-postmeddelanden,  stöd för kortkoderna, intuitiv kontrollpanel, enkel skapande av händelser, total kontroll över utseende, etc.

Ladda ner | demo | webbhotell 

Skapa enkelt din webbutik

Ladda ner gratis WooCommerce, de bästa e-handelspluggarna för att sälja dina fysiska och digitala produkter på WordPress. [Rekommenderas]

3. Social Share & Locker Pro

Pluggen Social Share & Locker Pro har utformats för att hjälpa din webbplats att bli mer synlig på sociala nätverk. Med bara några få klick kan du antingen ställa in positionen för dina sociala ikoner eller låsa ditt innehåll genom att kräva delning på ett av de sociala nätverk som erbjuds av dig.

Social share locker pro wordpress plugin

Du har 10 fördefinierade teman och detta bör täcka de vanligaste önskemålen. Alla hennes teman är näthinnan och underverk. 

30 saker att göra på dina blogginlägg efter offentliggörandet Upptäck dem genom att läsa den här artikeln.

Med Social Share & Locker Pro kommer du också att kunna visa hela namnet på sociala nätverk eller bara ikonen. Det beror på din design, tillgängligt utrymme eller dina önskemål.

Ladda ner | demo | webbhotell

Rekommenderade resurser

Ta reda på om andra rekommenderade resurser som hjälper dig att bygga och hantera din webbplats.

Slutsats

Här är ! Det är det för den här guiden. Vi hoppas att den här guiden har gett dig grunderna för att skapa ett bildspel med Slider Revolution på en WordPress-blogg eller webbplats. Om du har några frågor, förslag eller kommentarer, lämna dem i vårt avsnitt commentaires.

Du kommer dock också att kunna konsultera vår medel, om du behöver fler element för att genomföra dina projekt för att skapa webbplatser, genom att konsultera vår guide om WordPress blogg skapande.

Tveka inte att dela med dina vänner på dina favorit sociala nätverk

Den här artikeln innehåller kommentarer 0

Lämna en kommentar

Din e-postadress kommer inte att publiceras. Obligatoriska fält är markerade *

Den här webbplatsen använder Akismet för att minska oönskade. Läs mer om hur dina kommentarer data används.

Tillbaka till toppen
4 aktier
del1
tweet
Enregistrer3