Slider Revolution 5 - Creating a Multi-Image Animated Slider

Поділитися
Вставка
  • Опубліковано 23 гру 2024

КОМЕНТАРІ • 133

  • @michaelbourland
    @michaelbourland 8 років тому

    One of the best tutorials I've seen (out of about 100) The steps you show actually work with the current version.
    THANKS

    • @WPTuts
      @WPTuts  8 років тому

      +Michael Bourland Thank you very much; I'm glad you found it useful :)

  • @vedimido
    @vedimido 9 років тому

    great!! Clear simple and efficient!!! Do more and you'll rock the online tutorial world!!!

  • @beewaxmedia
    @beewaxmedia 7 років тому +2

    Thank you, finally a person who knows what he's talking about. awosome tutorial

  • @kwilsonjr
    @kwilsonjr 9 років тому +2

    Thank you! This is the best slider anywhere. Looking forward to a video demonstrating all the advanced options that really make this product stand out.

  • @zebracoletivo5474
    @zebracoletivo5474 8 років тому

    You're a natural tutor. Keep up the great work!

  • @martyvictor6077
    @martyvictor6077 9 років тому

    Well done and sorely needed. Looking forward to advanced options video.
    Thank you!

  • @jeannewhite7629
    @jeannewhite7629 9 років тому +2

    This is a great tutorial! Was struggling with the slider that came with a theme but now think I can slay the dragon!

    • @WPTuts
      @WPTuts  9 років тому

      +Jeanne White Glad you found the tutorial useful :0)

  • @miketadlock1904
    @miketadlock1904 9 років тому +8

    Great tutorial!!!
    Thank you for taking the time to make it!

  • @NiceGuyJK
    @NiceGuyJK 9 років тому

    Hi. Great video. I am curious: can this plug be used to set-up different sliders for different pages?

  • @jaynel7438
    @jaynel7438 8 років тому

    Great video.
    I have a theme with demo images. I love the structure, and am happy to just replace the images/text.
    I have figured out how to replace background, text from your video and just poking around.
    I cannot figure out how to replace the images in the layers. I would rather not do new ones, as then have to do timing, angles, etc.
    Do you have a video on how to replace an image for a layer or tips on where to look?

  • @traderlondon
    @traderlondon 9 років тому

    thanks. Is it possible to do a video on the best practices for image size into WordPress and RS. in order not to slow the load time for SEO purposes?

  • @Mateo1982able
    @Mateo1982able 8 років тому

    Thanks to you now I know about png solution to make any slide much more compelling !

    • @WPTuts
      @WPTuts  8 років тому

      +Mateusz Witek Good to hear :)

  • @manojkapoor5060
    @manojkapoor5060 4 роки тому

    Just t a quick question, how can you put an image "to front" or "to back" in a slider revolution ver. 5 so that we have an overlapping effect? Many thanks!

  • @bryanbenattou1432
    @bryanbenattou1432 9 років тому

    Great tutorial! I'm just having some trouble with the slider showing up on my site. I've added 6 simple slides that have been cropped to fit the pages but it shows a white space. Any ideas?

  • @desimr4508
    @desimr4508 9 років тому

    Great video i like the way you explain every details you make it easy for someone to understand. can you do a tutorial about visual composer?
    what theme did you use?
    Thank you so much for taking your time to do this.
    God bless.

  • @Arno_vanZyl
    @Arno_vanZyl 6 років тому

    HI there, great video! You helped me out big time as I'm still learning the ropes. I've got a question though, how can I make it so that the click of a mouse acts as the navigation? As opposed to the timer or arrows?

  • @felixangel81
    @felixangel81 7 років тому

    08:15 "come over to the left hand side and you see this little flyout" Sorry, no, i do not have/see this.
    Also when i upload my image, the image appears zoomed in.... How do i add an image and make it appear like it does when i original select it from media library?
    Many thanks.

    • @WPTuts
      @WPTuts  7 років тому

      Hi Felix,
      This video is scheduled to be updated as this was done using version 4 of Slider Revolution so there have been a lot of updates and visual reorganisation of the plugin since this was produced.
      The link to add new items is now at the top of the preview window area, but still offers the option to do everything outlined in this part of the video.
      To manage the scale of your image, you can do this by going to the Source Settings tab on the Main Background tab and from there you can set the preferred option from Background Fit and Background Position and Repeat.

  • @MarioToro82
    @MarioToro82 5 років тому

    2019 and still needing this! great vid and still up to date!

  • @jessebout3093
    @jessebout3093 8 років тому

    How do you get the animations in the timeline to loop so that the animations repeat?

  • @Dardango
    @Dardango 8 років тому

    I'd like to build a standard slider that shows a 63-second intro fullscreen video before moving on to the next slide. Is this possible with RevSlider and if so can you show how to create this?

  • @drumstudio2000
    @drumstudio2000 9 років тому

    nice tutorial. how to adjust my original image to the slider canvas? Im getting a croped image when preview my slider. thankS!

    • @ReapertvUk
      @ReapertvUk 9 років тому

      +drumstudio2000 If you mean the background image, make sure that under the Source Settings section of your slide that you have background fit set to 'Cover'.

  • @robertoinnocenzi3626
    @robertoinnocenzi3626 7 років тому

    Thank you very much for this great tutorial, I was looking for a starting point and your viideo teached me a lot.

  • @MistaCreativity
    @MistaCreativity 8 років тому

    This really helped, was almost giving up, as the sliders wont change, but your tutorial pointed my errors out. Ought to have switched from Hero scene to Auto slide. Thanks

    • @WPTuts
      @WPTuts  8 років тому

      Glad to hear the video helped. :0)

  • @HoustonBrownPhotography
    @HoustonBrownPhotography 9 років тому

    Thank you for all your videos. Very helpful. One thing I have not figured out, and perhaps this is because I have not been using RS for very long, is why the graphic interface is so small? Can you shed some light on this? I have a wp template that has a full screen image and I am using RS on it. So there is a lot more room on the screen than RS seem to think.

  • @kennedyfinecountry
    @kennedyfinecountry 8 років тому

    How do you have multiple post like a filmstrip in carousel slider

  • @pierinamerino4519
    @pierinamerino4519 9 років тому

    how do you retain the sizes of the images you import? for some reason the program makes them smaller
    thanks

  • @markbanong8042
    @markbanong8042 8 років тому

    why does the layer is not accurate compare the website ??? for example i put a label and its not perfectly align to something

  • @FMmag
    @FMmag 7 років тому

    How to add a small reel (film-strip like) running from right to left continuously under the main slider

  • @vBailey
    @vBailey 9 років тому

    Would love to see a tutorial on layering images and how they behave in relation to other images on the same slide. For instance, I'm using multiple images on a Hero slide but always have trouble knowing how to place them so that the proper ones display BEHIND others. Make sense?...

    • @vBailey
      @vBailey 9 років тому

      +I-Pixel: Creative Simplicity More like layering them on a slide background. Yes, some slides will overlap each other (requiring transparent bgs). For some reason, I can have them layered properly (I think) but I have to fiddle with the 'snap to end time' to get them to work. Gotta be doing something wrong. Would love to see you folks build something like that :)

    • @vBailey
      @vBailey 9 років тому

      +I-Pixel: Creative Simplicity Actually, I completed a slide (fchs.fsd38.ab.ca/drama/) but had some difficulty in layering them. Would love to know your trade secret(s) ;)

    • @vBailey
      @vBailey 9 років тому

      +I-Pixel: Creative Simplicity Why yes I-Pixel, yes it did! And we have more slides like this in the works...which is why i'd love to see how you folks would approach a build like that :)

  • @michelnimes8728
    @michelnimes8728 4 роки тому

    Hi, im new with Slider Revolution... i have a question, i want to do a diferent slider in each device, for example one slider for larger screen like pc with some images and text, but another slider with diferent images and text for laptop, and of course another one for mobile also with diferent images ans diferent text...is it possible? I think i need hide each one for the rest of device, but I dont know if it possible and how?.... thank you so much to help me, maybe you have tutorial for that or somebody else...

  • @waleedrao7037
    @waleedrao7037 7 років тому

    How to slide these slides horizontally in slider revolution please explain

  • @amarnath033
    @amarnath033 8 років тому

    how to animations revolution slider when page scroll ?
    (when revolution slider in body section)

  • @45andSingle
    @45andSingle 7 років тому +2

    Excellent tutorial, super helpful, thank you so much!!

    • @WPTuts
      @WPTuts  7 років тому

      45andSingle my pleasure 👍

  • @hermesferns8827
    @hermesferns8827 9 років тому

    Very helpful tutorial...Thanks

  • @jimmyaugustsen1437
    @jimmyaugustsen1437 9 років тому

    Thanks for great tutorials! I have one problem which I hope you can help me with. I want the slider to be on the background on my "starting" page (home), but I can´t figure out where to copy the short code for this starting page.

    • @jimmyaugustsen1437
      @jimmyaugustsen1437 9 років тому

      +I-Pixel: Creative Simplicity I just want to place the slider on my frontpage.

    • @jimmyaugustsen1437
      @jimmyaugustsen1437 9 років тому

      +I-Pixel: Creative Simplicity I did try to use the shortcode, but I can only insert the RS widget in the Footer Left, Footer Center and Footer Right sections, where my slider works fine. Besides this, I have only Primary Sidebar widget...? t also works fine when I insert the shortcode on a new page/post.

    • @jimmyaugustsen1437
      @jimmyaugustsen1437 9 років тому

      +I-Pixel: Creative Simplicity Sure, do you have an email where I can send you the link?

    • @jimmyaugustsen1437
      @jimmyaugustsen1437 9 років тому

      +I-Pixel: Creative Simplicity ...done :-)

    • @jimmyaugustsen1437
      @jimmyaugustsen1437 9 років тому

      +I-Pixel: Creative Simplicity my email is jimmy@flexo-tech.dk :-)

  • @AdnanKhurshidTI
    @AdnanKhurshidTI 7 років тому

    @WPTuts, hi there, is there any way of making a slider as in demo.tagdiv.com/newspaper/ showing various posts or categories with the linking url's?

  • @susanvanderwier1060
    @susanvanderwier1060 8 років тому

    Is there a video tutorial for the Slider Revolution Carousel Slider? I need to find out how to edit the thumbnails.

    • @WPTuts
      @WPTuts  8 років тому

      Hi Susan, there will be a new video added to the channel tonight that covers the Carousel Slider along with how to manage your thumbnails.
      Please feel free to Subscribe to the channel and you'll be informed when the new tutorial is up online. :0)

  • @ImpactChurchke
    @ImpactChurchke 7 років тому

    Excellent tutorial. Thanks for your help

  • @quynhvu92
    @quynhvu92 8 років тому

    Magnifique! Millions thanks :)

  • @davemarston
    @davemarston 9 років тому

    Helllp.
    The elements I've added to a slider aren't scaling responsively.
    Any videos about that?
    Great tutorial though.

    • @WPTuts
      @WPTuts  9 років тому

      +David Marston Hey, do you have an example of the problem you're experiencing?

    • @davemarston
      @davemarston 9 років тому

      Yep, here you go
      www.clearstreamdesign.co.uk/focus/homecurrent/

    • @WPTuts
      @WPTuts  9 років тому

      +David Marston Ok, I see what you mean.
      How do you have your slider set-up? Is it set to 'Auto' in the Settings > Slide Layout panel?

  • @tangomechanic
    @tangomechanic 8 років тому

    Cannot find anywhere info how to customize my workplace and have those 5 icons (save, edit, view...) in this convenient vertical config. Will appreciate your answer.

    • @WPTuts
      @WPTuts  8 років тому

      Make sure you are using the latest version of Slider Revolution as the interface has changed quite a bit since earlier versions of the plug-in.

    • @tangomechanic
      @tangomechanic 8 років тому

      I do - 5.2.6 - but still do not know how to do it. Should be in General settings and it is not there. How did you achieve this?

  • @ThePavilionWeb
    @ThePavilionWeb 7 років тому

    Very helpful, thanks for sharing!

  • @OpazMultimedia
    @OpazMultimedia 9 років тому

    Hey great tutorial, I have run into a prob on Rev Slider 5 where there seems to be a pause between slides, so one fades out before the next fades in... as oppossed to them fading into each other as they seem to do on your tutorial and on the previous versions of Rev slider, any suggestions? Warmest Ray

    • @OpazMultimedia
      @OpazMultimedia 9 років тому

      +I-Pixel: Creative Simplicity Thanks for the advice, I'm using a lot of transparent images might be
      that, they are small but will optimise using tiny png which I had never
      heard of before. Looking forward to checking out some more of your videos too.

  • @mdidaho
    @mdidaho 9 років тому

    How come when I import a template it only plays one of the slides? How do I get the template to play all slides?

    • @WPTuts
      @WPTuts  9 років тому

      +Mark Deaton Without seeing your specific settings, the first thing I would do is to check that the slider isn't set to a 'Hero' or that the Loop settings are correct.

  • @nimraha.5064
    @nimraha.5064 9 років тому

    Great explanation, thank you!

  • @katgivesreviews9037
    @katgivesreviews9037 8 років тому

    Good tips about the PNG files and shrinking them. I am having trouble changing the arrows though. Not the arrow style but the colour when you hover...

  • @netbay748
    @netbay748 6 років тому

    hello, I'm creating a site for a customer, I created the slide in the header, with slider revolution, the customer asked me to insert a musical background, but that you can "silence" so I entered 2 buttons (play, stop) , they are 8 images
    schemes, but in the other there are no buttons, I tried to stretch the strip of the audio file, and it works, but I can not insert them in all slides, also because it has start and stop functionality, they are inserted in the second not needed nothing, is it a way to insert slides?

    • @WPTuts
      @WPTuts  6 років тому

      net bay try using the master slide. If that doesn't work you may nerd to look at using javascript to override the transitions.

  • @earlzpearlmajic108fm
    @earlzpearlmajic108fm 9 років тому

    Great job!

  • @recepgulgun
    @recepgulgun 9 років тому

    Many thanx. I've learned a lot and. Than you veryw much.

  • @CDS1120
    @CDS1120 8 років тому

    Any tips on colorizing an image in a slideshow? We had a developer create our website and when we asked about adding color to a gray slideshow image, the developer basically told us, "Don't."

    • @WPTuts
      @WPTuts  8 років тому

      +CDS1120 Do you mean to add colour elements to the image itself? I would think you'd need to look at using Photoshop or another image editing application for that.
      If you can provide a link or an example, I'll see if I can be more specific for you.

    • @CDS1120
      @CDS1120 8 років тому

      +WPTuts Yes, that's exactly what I mean. The specific image I'm talking about is the first image in the slideshow on the following page: saint-albans.org/

    • @WPTuts
      @WPTuts  8 років тому

      Then I would say you'd need to use something like Photoshop to add colour to the image. However, if all you wanted to do was create an overall colour overlay (i.e. to make the image have a blue tone over the entire image) then you could achieve that by creating a new Shape layer in Slider Revolution, give that a colour and set the transparency to around 0.5 to make it semi transparent and this would apply an overall tint to the image.
      You may need to adjust the timing on the layer to ensure it mimics the background photograph.

  • @DimaMaghriib
    @DimaMaghriib 8 років тому

    I have a question how can i insert it in the header ?

    • @DimaMaghriib
      @DimaMaghriib 8 років тому

      I ve just found how :) thanks

  • @rachiew7375
    @rachiew7375 8 років тому

    very helpful! thank you!

  • @krishnapatel-dr4os
    @krishnapatel-dr4os 8 років тому

    how to add the images in slider

  • @aliphilic
    @aliphilic 6 років тому

    Thank you i love it

  • @DimaMaghriib
    @DimaMaghriib 8 років тому

    Thanks a lot you save my night :))

  • @JuanDuqueJuanimador
    @JuanDuqueJuanimador 8 років тому

    Thank you, this video was really helpful.

    • @WPTuts
      @WPTuts  8 років тому

      My pleasure. :0)

  • @WarhelmeTR
    @WarhelmeTR 9 років тому

    Cool, thank you.

  • @magician1337
    @magician1337 8 років тому

    Great video, thanks

    • @WPTuts
      @WPTuts  8 років тому

      +Vane My pleasure, glad you enjoyed it :0)

  • @marving.5436
    @marving.5436 6 років тому

    Revolution slider is worth every penny, and it is lightweight too, the only downside here is that when someone asks to pass the google pagespeed and you add optimization this gets whacked...

  • @OlgaFB1
    @OlgaFB1 9 років тому +1

    very useful, thank you very much!!!

  • @blagojgjelevski3373
    @blagojgjelevski3373 9 років тому

    Thank you! Useful video!

  • @myaniwaya
    @myaniwaya 6 років тому

    How do you actually publish what your made?

    • @WPTuts
      @WPTuts  6 років тому

      Johnny Inlow you can either use the shortcode that's on the first screen when you create your slider or if you're using a page builder there is usually a widget there you can use.

    • @myaniwaya
      @myaniwaya 6 років тому +1

      WPTuts Cool, Pagebuilder I have. Thanks!

    • @WPTuts
      @WPTuts  6 років тому

      Not a problem 👍

    • @myaniwaya
      @myaniwaya 6 років тому

      Is there a video showing how to use the widget or short code?

    • @WPTuts
      @WPTuts  6 років тому

      Not specifically as it would depend on the page builder you're using.
      If it doesn't have a dedicated SR5 widget, you could just use the shortcode Widget and add in the shortcode generated when you create a slider.

  • @DaphneWolters
    @DaphneWolters 8 років тому

    Thank you! was very helpful... love your accent :-)

    • @WPTuts
      @WPTuts  8 років тому

      Thank you :0)

    • @DaphneWolters
      @DaphneWolters 8 років тому

      Hi again,
      Maybe you can help me? I'm looking for a way to put Flipping Cards into the Revolution Slider, to be able to show them cards within the slider... Something like you can find here, under "Wie we zijn" (build with Adobe Muse)
      dapkrommerijnstreek.nl/
      Would something like that work? I've got a bit further then where I've been... but am still stuck :-( (see here: www.dapkrommerijnstreek.nl/wp/home/ and scroll down to "Wie we zijn"
      Any help is much appricieted!
      Hope you have a tutorial ready about this metter, but I couldn't find it.
      Thanks for your time!
      Kind regards,
      Daphne Wolters.
      p.s. sorry for posting it in the "open", but I couldn't find the way to send a private one...

    • @WPTuts
      @WPTuts  8 років тому

      Hi Daphne,
      I'd recommend looking at an alternative method to using Slider Revolution 5 for this. I've done something very similar and used Visual Composer & Ultimate Add-ons for Visual Composer.
      The added benefit is that the text will be readable by the search engines whereas in Slider Revolution that isn't the case.
      I'm not saying you couldn't do this with SR, but it would be much quicker and easier using the previously mentioned plugins.

    • @DaphneWolters
      @DaphneWolters 8 років тому

      I've got the feeling that I'm almost there, but need some help to finish it up. Whould you care to take a look? you can maybe better contact me through emai? info@wolterswebservices.nl.
      Hope to hear from you soon :-)

  • @ViZiOMusic
    @ViZiOMusic 7 років тому

    very cool

  • @alphacoulibaly
    @alphacoulibaly 8 років тому

    i found this wonderful think you to help us

    • @WPTuts
      @WPTuts  8 років тому

      My pleasure, glad you found the video useful :0)

  • @printscreative3249
    @printscreative3249 8 років тому

    Nice way to teach

  • @amarjeetsingharora4467
    @amarjeetsingharora4467 7 років тому

    THANKYOU THANK YOU THANK YOU SHOOOO MUCH SIR... THANK YOU SHO MUCH. ITS AWESME VIDEO..

  • @humbalulit
    @humbalulit 9 років тому

    thanks so much!

  • @JoseLuisRodriguez-zk5me
    @JoseLuisRodriguez-zk5me 8 років тому

    hello is a really nice tutorial, but my question is, now i know how to create the slider, but how i put it in my web

    • @WPTuts
      @WPTuts  8 років тому

      You can simply paste the shortcode that is generated when you give your slider a name and an alias on the settings page.

  • @gamedevilclub7225
    @gamedevilclub7225 6 років тому +1

    Thank you

  • @tsheringpenjor5539
    @tsheringpenjor5539 7 років тому

    i am looking for the tutorial on how to make multi layer images. when take my mouse pointer on to particular image it should zoom out and on the click event of mouse it should take me to the new page... if you want to refer what type of animation i want can you just visit this site www.bfl.org.bt/parks.php .... if you have help me i want exactly same as in the website.

  • @grandvisiontech1664
    @grandvisiontech1664 9 років тому +1

    I'm right creating a website! thanks for sharing

    • @WPTuts
      @WPTuts  9 років тому

      +Grand Vision Tech My pleasure :)

  • @gobrad
    @gobrad 5 років тому

    I see the last comment here was 3 years ago 😳 if I change the slider on my landing page can I return back to the original if I don’t like the new one

    • @WPTuts
      @WPTuts  5 років тому

      I'd duplicate your slider and modify one knowing you have the original you can go back to.

    • @gobrad
      @gobrad 5 років тому

      Many thanks for your prompt reply... Really glad I found this as there aren't many tuts out there on it... do you know of a tutorial that explains how to add a simply sound effect to a drop down slider?

  • @mauriceball4608
    @mauriceball4608 9 років тому +1

    Thank you.

  • @jackvu.hustle
    @jackvu.hustle 7 років тому

    THanks guys

  • @analenamaury1629
    @analenamaury1629 8 років тому

    Thanks.

    • @WPTuts
      @WPTuts  8 років тому

      My pleasure.

  • @cluskutube
    @cluskutube 9 років тому +1

    thanks

    • @WPTuts
      @WPTuts  9 років тому

      +Peter Margaret Mccluskey My pleasure :0)

  • @jackvu.hustle
    @jackvu.hustle 7 років тому

    16:00

  • @carlosprieto2554
    @carlosprieto2554 7 років тому

    Eso lo hacia yo cuando tengia 7 años

  • @SuzukiMx184
    @SuzukiMx184 8 років тому

    Useful tutorial. Are you able to help a specific request of mine.
    I am trying to create the vertical slider bar as shown on page 4 onwards in the link below:
    www.arconic.com/thefuture/?Arconic+-+UK+-+Students+and+Careers+-+Student&
    I'm looking to get my logo (which is one continuous line shape) to lead into the slider. I have achieved this by exporting my logo as an SVG and bringing it into 'Enlivenem' however I have no way of integrating this with my wordpress site. I thought it would be possible with this plug in but i'm not so sure?

  • @tvimpactus3741
    @tvimpactus3741 7 років тому

    Like it

  • @uds69
    @uds69 6 років тому

    Yes good tutorial. Can you make another one putting a contact formular half into the slider and half outside as show here in this website ? helveticatransport.ch

  • @kevinkiumbe5620
    @kevinkiumbe5620 8 років тому

    thank you..I guess you're from the united kingdom

    • @WPTuts
      @WPTuts  8 років тому

      Indeed I am :0)