Slider - Webflow tutorial

Поделиться
HTML-код
  • Опубликовано: 10 дек 2024

Комментарии • 84

  • @joeygarner1636
    @joeygarner1636 25 дней назад

    I have the same feeback for every tutorial video Webflow puts out : You use the most basic "nothing could go wrong" examples that make it looks so easy. How do you change the arrows, and their location? How do you change the slide dot indicators layout? Why is it that when I put benefit cards into the slider, on slide 2 it only shows 1 card, but in preview it shows all 3? So many things go wrong the second you try to make changes to the default structure.

  • @Flowkey247
    @Flowkey247 11 месяцев назад

    Great video!

  • @shajibkumarsutradhar4626
    @shajibkumarsutradhar4626 2 года назад

    Really Love webflow

  • @taposhsorkar1613
    @taposhsorkar1613 8 месяцев назад

    slider arrow color can't change without code

  • @mahsae5479
    @mahsae5479 4 месяца назад

    Height not changing by chnging the height of slide/background image :/

  • @jansleyreal
    @jansleyreal Год назад

    Can you change the color of the arrows?

    • @Webflow
      @Webflow  Год назад +1

      Yes you can. The arrows are just SVG icons that have no fill color in their SVG codes. So all you have to do is change the text color their parent element. Hope this helps :)

    • @jansleyreal
      @jansleyreal Год назад

      @@Webflow beautiful thank you!

  • @harshstudent2021
    @harshstudent2021 3 года назад

    Webflow is amazing

  • @MohammadaAprilianto
    @MohammadaAprilianto Год назад +1

    how to make slider from collection list?

  • @rejointrident
    @rejointrident 3 месяца назад

    and the responsive layout???!

  • @goldencatpat
    @goldencatpat Год назад

    Why is there no inbuilt thumbnail option after all these years????

  • @neddeadlyeu
    @neddeadlyeu 19 дней назад

    this doesnt work 2024 :/

  • @marietoni9953
    @marietoni9953 11 месяцев назад

    how can we delete a alide added by mistake ? And how can we change the order of appearance of the slides ?

  • @neelsharma3
    @neelsharma3 4 года назад +1

    This guy is awesome

  • @zetzzz708
    @zetzzz708 Год назад

    How do you make a slider automatic by default without arrows or buttons

    • @Webflow
      @Webflow  Год назад

      You can give the left and right arrow elements and the slide nav a display:none if needed.

  • @Labattfartoui
    @Labattfartoui 3 года назад +84

    Webflow is amazing, but it wouldn't be half as good without all these videos. I've watched probably 100 of them so far and it's made a huge difference in the speed and quality of my work. Love the humor, too. Makes boring subjects much more fun.

  • @doingtheellathing
    @doingtheellathing 2 года назад

    The buttons shown to adjust image placement and things like tiling is not showing up for me. Please help

  • @gingalaxy8874
    @gingalaxy8874 3 года назад

    why is my slider not appearing in the preview? only one navigation dot is visible. tq

    • @Webflow
      @Webflow  3 года назад +1

      Hi there! It sounds like this question may be specific to your Webflow site instance.
      Can you please reach out to us here with more details, our team is happy to help: university.webflow.com/support
      Thanks in advance!

  • @valentiev
    @valentiev 4 года назад +11

    But can I create a custom slider with Webflow? For example: can I place right and left arrows above in the top right corner above the text? And can I upload my own vector icons? Just want to know how customizable Webflow really is. Thanks

  • @wesleyjaques2913
    @wesleyjaques2913 2 года назад

    Can you add a hyperlink to a slider background image? if so how?

    • @Webflow
      @Webflow  2 года назад

      Yes. You can add any element into a slide. Including link blocks. Hope this helps :)

  • @shbdesign9010
    @shbdesign9010 4 года назад +4

    What about images in Mobile Layout, I have some nice width renderings looks great on desktop but in Mobile they suck is there an option to solve this?

  • @roomathousandyearswide
    @roomathousandyearswide 2 года назад

    And how do you make the arrows and dots smaller?

    • @Webflow
      @Webflow  2 года назад

      At this time, you cannot style the dots on the canvas. You'll need to use custom code. As for the arrows, you can make those smaller on the canvas by using the style planel.

  • @hpplotter6925
    @hpplotter6925 4 года назад +1

    Is it possible to add javascript code to webflow to pull in web content?

  • @franci-uz
    @franci-uz 2 года назад

    OMG, my slider just goes crazy! What's the standard for duration and time delay please?

    • @Webflow
      @Webflow  2 года назад

      Try setting the time delay to 5000 ms (which is 5 seconds) and the duration to 500 ms (which is half a second). Hope this helps 😁

  • @obejuanfacio5350
    @obejuanfacio5350 5 лет назад +1

    HELP PLEASE. Why do you get more settings in your right side settings panel? For example, for my image settings for the slider I don't get the same options as position, cover, contain, etc. Please help me.

    • @OKeeffeSamuel
      @OKeeffeSamuel 5 лет назад

      They updated the style panel, I'm having trouble because I want my images to be contained but don't know how with the new style panel..

  • @Ekarron
    @Ekarron 3 года назад +1

    Nice, but how to make the background transparent? I want to make png images slideshow without the gray background of default "slider"

    • @whellintonrocha8734
      @whellintonrocha8734 2 года назад

      Hi, i've been searching for this as well, have you found the answer somewhere? Could you share it here? I think the only way is using custom code but i'm not sure.

    • @Ekarron
      @Ekarron 2 года назад +1

      @@whellintonrocha8734 nope, I've tried to set it up with images and time triggers but it breaks 50% of the time.

  • @redweamericas4237
    @redweamericas4237 2 года назад

    I try to adapt the size of the slider image, but in the mobile version it always comes out cut off. How do I solve it?

  • @marvingrass8
    @marvingrass8 3 года назад

    I can't make a container inside the slider. It says It is not possible to make a container inside a container. So I added my Header directly onto the slider. Anyone else with this problem?

  • @Schecter1989
    @Schecter1989 3 года назад

    How would I go about rotating 8 pictures from right to left, but only having 4 pictures showing at a time on the page? Sort of like a carousel.

    • @Webflow
      @Webflow  3 года назад +1

      Hi there! Great question! Setting your slide width to 25% of your parent Slider element should set 4 slides to display at a time.
      If you're having any trouble with this implementation, please let our community know.
      We're here to help!
      forum.webflow.com/

    • @b40
      @b40 2 года назад

      @@Webflow i tried this and it actually works.... but when i click on the arrow there is an issue : it slides from slide 1 to slide 3 directly (seems like the next and previous action is set depending the width). Any clue to solve this? Thanks a lot. Bernard

  • @jesusbootcamp660
    @jesusbootcamp660 2 года назад

    if the image size doesn't work, just select the mask and then change it

  • @thevezs
    @thevezs 2 года назад +6

    Webflow tutorials are great - the only issue I have is that it doesn't solve real project scenarios like on mobile. This looks great on desktop but is unusable on mobile.

  • @shaileechoxi6268
    @shaileechoxi6268 4 года назад +1

    I need help with this. I want to use lightbox inside a slider. Is that possible or can you share any source?

  • @nickgoesvestmode
    @nickgoesvestmode 5 лет назад +3

    Can your slides be called from a collection?

  • @tanvinewyork
    @tanvinewyork Год назад

    Okay, I I want to add a powerpoint to my portfolio and I feel the slider is the best way to go about. I am trying to add multiple images onto the slider but there is no option to export multiple images from CMS entry. Second, if I make a change in one template page, it leads to a corresponding change in all the pages. The content of the deck per page is dynamic, not static - hence need help with approach 1!

  • @pieteb_nl
    @pieteb_nl 2 года назад +2

    This tutorial is just not the same without that one guy that does all the Webfllow tutorials

  • @PhillGraaf
    @PhillGraaf 5 лет назад +1

    such a great Tutorial... The only thing is that I add Images to my solider but When I preview them, they aren't visible! At first it worked but now... not anymore.

    • @Webflow
      @Webflow  5 лет назад +1

      Hey there, I need more info so I can help you resolve this issue. Please, can you post your question with as much information as possible (read-only link, screenshots and a description of the issue), on the Webflow Community Forum (forum.webflow.com/) and we can help you there.

  • @Digi_ClientShowcase
    @Digi_ClientShowcase 3 года назад +3

    Any chance of adding a function directly to the editor to change the Nav-Circles colour without having to use custom code to do so?

  • @haeki9975
    @haeki9975 5 лет назад

    whats the best image size for the slider ? can anyone help me with that please

  • @kukurumba3556
    @kukurumba3556 6 лет назад +1

    How to customize slider tabs?

    • @Webflow
      @Webflow  6 лет назад +1

      Check out some options of how to style the slider nav tabs here: university.webflow.com/article/sliders#styling-the-slide-nav-dots

  • @dave3k
    @dave3k 6 лет назад +1

    Can the left and right icons be replaced with custom icons and can the pagination be styled?

    • @Webflow
      @Webflow  6 лет назад +2

      Yes, you can check how here: university.webflow.com/article/sliders#customizing-arrow-icons & here: university.webflow.com/article/sliders#styling-the-slide-nav-dots

  • @jakinrogel7876
    @jakinrogel7876 3 года назад

    Just don't set any of the pictures to fixed. That will mess everything up

  • @ErdalEyican
    @ErdalEyican 5 лет назад +4

    omg i was so clumsy with fitting in images in the slider and making it look nice. So happy i came across this video and my troubles have gone by like a soothing breeze

  • @d7656
    @d7656 Год назад +1

    Thank you so much. I was expecting this to be way harder in my mind but this was unbelievably easy to replicate. God bless

  • @kehkashananwar8508
    @kehkashananwar8508 Год назад

    Hello, Thanks for this video. How can we link slider's image which leads to another page or section?

    • @Webflow
      @Webflow  Год назад

      This article may help you with that: university.webflow.com/lesson/section-link#how-to-link-to-a-section-on-another-page

  • @marijnkraai1375
    @marijnkraai1375 5 лет назад +31

    Excellent video, I've already learned a lot. I also really love the little jokes in the video's ;)

  • @carpathianshepherdess4990
    @carpathianshepherdess4990 4 года назад +4

    The humour in these is brilliant! Thanks for the tutorial series.

  • @loup.random
    @loup.random 6 лет назад +2

    Excellent video, thanks !!

  • @stefmartinuzzi1649
    @stefmartinuzzi1649 5 лет назад

    For some reason I wasn't able to copy the container on slide 1 and paste into slide 2. Is this because I am using a free trial version?
    Please message me back ASAP if you can.
    I'm enjoying the learning process thus far though. Great videos

    • @Webflow
      @Webflow  5 лет назад +1

      Hey Stef! Free, there's no trial version. You can use Webflow for free forever and you should be able to use all features included in the free plan without such limitations.
      That said, some parts of sliders, like other components, cannot be pasted into other elements. So, I need to know which container are you copying? The "slide 1" itself? You cannot paste a slide inside a slide, but you can paste a slide in the mask (the parent container of all slides). So, basically, you can design a slide then duplicate it (copy it and paste it in the mask).
      Hope this is helpful. If you have any other questions, please don't hesitate to reach out to us, and we'll be happy to help! If you're having any trouble when designing your site, you can always post on the *Webflow Community Forum* (forum.webflow.com/) with as much information as possible (read-only link (wfl.io/2Tupw47), screenshots and a description of the issue), and our amazing community and staff can help you there.

    • @stefmartinuzzi1649
      @stefmartinuzzi1649 5 лет назад

      @@Webflow Thank You, I got it to work. There was a tad of confusion on my part so I apologize

    • @stefmartinuzzi1649
      @stefmartinuzzi1649 5 лет назад

      @@Webflow Also thank you for replying back so fast

    • @Webflow
      @Webflow  5 лет назад

      You're most welcome! Glad it's all working great now!

  • @DANNYFIGDESIGNS
    @DANNYFIGDESIGNS 5 лет назад +10

    I can actually tell you're under the weather. That's how much I listen to you. lol. You are a Super Trooper! Love your vids. Sorry if I'm wrong...

    • @nipun2735
      @nipun2735 4 года назад

      I think the audio has a slight echo thats why it seems like it. Probably sound dampening configuration is causing issues.

  • @alexdelis8510
    @alexdelis8510 5 лет назад +2

    You had me at Top Dog

  • @isakhejnesen
    @isakhejnesen 6 лет назад

    Why the re-uploade?

    • @daviddipasquale586
      @daviddipasquale586 6 лет назад

      My guess is that they are rebranding webflow tutorials with this new guy, which is awesome in my opinion

    • @isakhejnesen
      @isakhejnesen 6 лет назад

      It is the same guy as last video about sliders. But i found out they made som changes. example is they added a backup information into this video, that wasnt in the last one.

    • @Webflow
      @Webflow  6 лет назад +2

      Hey Isak, in the last video, we had mistakenly applied flex settings on a slide which actually breaks the slider element. That's why we remade the video to fix that issue and let you all know how you can use flex settings within sliders without actually breaking the sliders (nest a flex container or a div block in your slide). And while we were at it, we added some helpful tips about backups. Hope this is helpful.

    • @isakhejnesen
      @isakhejnesen 6 лет назад

      Webflow Thx for the reply, great work

    • @Webflow
      @Webflow  6 лет назад

      Thanks, Isak!

  • @DeepfriedBaby
    @DeepfriedBaby 4 года назад

    I remember when creating a slider was a massive project. This is much better. haha

  • @mariojunio2214
    @mariojunio2214 2 года назад

    its free

  • @ayasuzuki7452
    @ayasuzuki7452 5 лет назад

    Very nice video! I like the “bun, proteins, toppings, bun”

  • @jamiesoja
    @jamiesoja 3 года назад

    Is there a tutorial on how to include vertical image of different dimensions?

    • @Webflow
      @Webflow  3 года назад

      Hi Jamie, thank you so much for asking about a tutorial for a vertical image in a slider. We don't have a tutorial on a vertical image slider at this time.
      Are you referring to a slider which moves vertically instead of horizontally? Or are you looking for a different tutorial? Please let us know!
      A great place to find solutions to Webflow questions is on the Webflow Forum: forum.webflow.com/

  • @yandex9188
    @yandex9188 6 лет назад +4

    ecommercee