How to use the Divi Fullwidth Slider (Divi Theme Tutorial)

แชร์
ฝัง
  • เผยแพร่เมื่อ 23 ต.ค. 2024

ความคิดเห็น • 39

  • @Your_fav_Fifi1
    @Your_fav_Fifi1 2 ปีที่แล้ว +2

    As a beginner with Divi it was a very efficient turorial. Short but to the point. Thanks!

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว

      Thank you! I’m glad it was useful for you :)

  • @larrymannino444
    @larrymannino444 2 ปีที่แล้ว +1

    This is probably the best slide tutorial for Divi I've seen - thanks, and just subscribed!

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว +1

      Thank you very much Larry! I really appreciate that uplifting feedback :) Have a good day mate!

  • @foussenihema6839
    @foussenihema6839 2 ปีที่แล้ว +1

    Hi. I must say thank you to you for this series. Very helpful even for someone like me who thought to be a kind of Divi specialist. I am taking time watch all the videos in one day. Plenty to learn in order to fill these small gaps. Congrat for your skills.

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว

      Very complimentary comment, thank you so much! I'm glad I could help :) I'm going to keep adding to this as regularly as possible as I've kind of let my Divi videos slip in the past.

  • @armandogutierrez2880
    @armandogutierrez2880 2 ปีที่แล้ว +1

    Very nice way to use and quick review about this tool, thanks for sharing your knowledge.

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว

      Thank you for the positive feedback Armando! I really appreciate it, have a great day :)

  • @sonchoydas
    @sonchoydas 3 ปีที่แล้ว +1

    Your Divi tutorials are awesome. It helped me a lot. Thanks, Wade. A tutorial for the mobile version would be nice.

    • @WadeMcMaster
      @WadeMcMaster  3 ปีที่แล้ว +1

      Thank you Sonchoy, I'm defintitely going to make more of them, thank you so much for the compliment :)

  • @TheWebDesigns
    @TheWebDesigns 2 ปีที่แล้ว +1

    Greetings from Ecuador, thanks for the explanation, it is the best I have seen. I was looking to reduce the height, it is unbelievably big as you say and it is you who comes up with a solution. Thank you very much, you gain a new subscriber.

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว +1

      Thank you so much! I greatly appreciate you subscribun and leaving such a positive comment :) im so glad i was able to help, have a great day!

  • @mmmnati
    @mmmnati 2 ปีที่แล้ว +1

    Hi! Great video! Is there a way to make the slider with two buttons centered aligned on mobile?

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว

      Not using the standard options, but you could not use the button option, add two links next to each other in body text, then chanhe the link class to et_pb_button - divi would then style those links like buttons. Let mw know if that makes sense or not!

  • @muddassirahmad36
    @muddassirahmad36 6 หลายเดือนก่อน +1

    good tutorial keep it up

  • @AJD1300
    @AJD1300 ปีที่แล้ว +1

    Does the slider not slide automatically from one slide to another... I am building this website, have used the fullwidth slider in the Hero section but have to manually click the arrows to slide from one slide to another.. Is there a way to make it slide automatically after a few seconds?

    • @WadeMcMaster
      @WadeMcMaster  ปีที่แล้ว

      There are some animation settings in the design tab to turn that on, change timer, etc

  • @khizarkhan8252
    @khizarkhan8252 2 ปีที่แล้ว +1

    Hii Wade McMaster
    how to swap the image and text in the slider i want text to the left side and image on the right side how to change this kindly let me know thanx

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว

      Hey mate,
      Sorry they haven't made it very simple. I'd check out this blog post: blog.tawfiq.me/divi-aligning-the-fullwidth-slider-image-right/

  • @aidenthewoolf6583
    @aidenthewoolf6583 2 ปีที่แล้ว +1

    Hello, i have a question. Can we make the image on the backgorund of the slider be a yt video? i know it lets you put a url of a yt video as background but it gives me an error and doesnt let me.

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว

      I remember it used to work, but I can't get it to now. I would recommend compressing the video the best you can without losing quality and uploading it to your host. But it may slow down your page speed.

  • @KevinRaymundSamson
    @KevinRaymundSamson ปีที่แล้ว +1

    can we edit the full slider's height? if yes, can you tell us how it's done, please?

    • @WadeMcMaster
      @WadeMcMaster  ปีที่แล้ว

      No worries, you can open up the fullwidth slider options (grey box, cog symbol) and in the design tab you can either:
      - under sizing, adjust the height there
      - or under margin/padding, adjust the top and bottom padding (space above and below the title, button etc)
      Hope that helps!

  • @dedisupardi2815
    @dedisupardi2815 7 หลายเดือนก่อน +1

    It's cool 🎉

  • @cmonster67
    @cmonster67 ปีที่แล้ว +1

    How do you lay text over the image on the left?

    • @WadeMcMaster
      @WadeMcMaster  ปีที่แล้ว +1

      Not super simple unfortunately :( Requires some CSS. Check out this blog post: blog.tawfiq.me/divi-aligning-the-fullwidth-slider-image-right/

  • @lauraexploramc
    @lauraexploramc 2 ปีที่แล้ว +1

    Is there a way to link to the individual slides with a button or text link? i.e. a menu above the slider that allows you to skip to particular slides within the slider? For example: Let's say there is a slideshow with 3 sections, containing 10 slides for each section. Perhaps there is a title slide at the beginning of each section, and let's say you want to click a button to skip directly to the 3rd section. A button could be utilized to take you to the title slide of the 3rd set of slides. Is that possible? Can it be done without reloading the page?

    • @lauraexploramc
      @lauraexploramc 2 ปีที่แล้ว +1

      I am also wondering if it is possible to disable the left navigation arrow on the first slide, and the right navigation arrow on the final slide?

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว

      @@lauraexploramc Idont think you can remove one arrow.
      You also cannto create groups but you can turn off text animations and create severalslides where you simply change the background - so essentially the text remains static on certain slides while the background changes.
      I don't know if that is super helpful, but I usually reference this article for turning off animations to get that effect: divinotes.com/create-a-slider-with-static-text-using-the-divi-slider-module/
      I hope that is helpful, it may not be exactly what tyou're after but i hope it helps.

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว

      I just realised i didnt answer your message about linking to the slides. I dont know how sorry :( apart forom the standard navigation options i dont know if its possible.

  • @jannatislam6310
    @jannatislam6310 2 ปีที่แล้ว +1

    may i know how to put the image on right side in the slider?

    • @WadeMcMaster
      @WadeMcMaster  2 ปีที่แล้ว

      There's no simple way of doing it. But you can do it with CSS, not sure hwo stable it would be:
      1. Open the FullWidth Slider Settings
      2. Click the individual slide to open it's settings
      3. Go to the top 'Advanced' tab
      4. Under 'Slide Description' put in: "float: left;" (not including quotation marks)
      5. Under 'Slide Image' put in: "left: 50%;" (not including quotation marks)
      Save and check it out. I would recommend viewing things on tbalet and mobile resolutions. The image does disappear. I haven't thoroughly tested thi sbut it appears to work on myt end just now :)

  • @ideaplusagency
    @ideaplusagency ปีที่แล้ว +1

    Seems like you talked about eveything except the actual "sliding" functionality options of a slide ...unless I missed it

    • @WadeMcMaster
      @WadeMcMaster  ปีที่แล้ว +1

      I'm pretty sure I did, however I'm not in a position to rewatch and check. Essentially there's an animation section under the design tab where you can control the slide animation if that helps

  • @sashaleal5505
    @sashaleal5505 11 หลายเดือนก่อน +1

    How to customize this to be picture on top of text?

    • @WadeMcMaster
      @WadeMcMaster  11 หลายเดือนก่อน

      One hack you can try is leaving the title field etc blank, and put all of the content into the single content field (it has the formatting options and 'add media's above it) and add media in there

  • @mohammadshafeeq3471
    @mohammadshafeeq3471 3 ปีที่แล้ว +1

    Is there a way to make the image top of the text

    • @WadeMcMaster
      @WadeMcMaster  3 ปีที่แล้ว

      Hi Mohammad, if you use the 'Logo Image' area it should go above the text. If you get really stuck, leave the Title & Subtitle area empty, and put everything in the 'Body' area. That way you can add as much text and imagery as you like in the classic style editor.