Simple FAQ Structure with Webflow CMS - Follow Along Tutorial

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

КОМЕНТАРІ • 71

  • @paletteplaygroundd
    @paletteplaygroundd Місяць тому

    Superb, please add more tutorials like this. You are a lifesaver

  • @petarpnp8080
    @petarpnp8080 2 роки тому +5

    You cant imagine how much time and stress you saved me from. This tutorial was mindblowing. Thank you very much! Keep up the good work!

  • @focusonthefocus
    @focusonthefocus Рік тому +1

    This is helpful, thus far. One thing I'm getting stuck on is when putting a Div Block in for the Horizontal Line, it does not show up on the right, but below the Question. Not sure if I missed something but I'm looking back.
    EDIT: 4:39 - ah... make faq-question-wrap Flex.

  • @youssoufnchetkou5522
    @youssoufnchetkou5522 Місяць тому

    Very useful and effective as a demonstration. Exactly what was needed, straight to the point.
    Thank you @Grace Walker ✨✅

  • @anamariaposada3161
    @anamariaposada3161 9 місяців тому

    Best teacher ever! ☺ I loved the clear way that you explained the process💖

  • @stevenkebila
    @stevenkebila 2 роки тому +1

    This is exactly what i was looking for. I was also looking for a hack to sort items in CMS but couldn't find any. This video saved me lots of time. Great job

  • @concannonpublishinghouse9057
    @concannonpublishinghouse9057 2 роки тому +1

    Brilliant tutorial! Thank you for breaking everything down so well, please do more videos! I’ll definitely watch them all.

  • @marhawk6468
    @marhawk6468 6 місяців тому

    Thank you so much! This helped more than you realize

  • @rociovalderrabano6629
    @rociovalderrabano6629 3 місяці тому

    You should make more tutorials, I like how you explain things 🥺

  • @jamesmonroedesign
    @jamesmonroedesign 2 роки тому

    Excellent job! Nicely paced and presented. Please add more!

  • @drock3003
    @drock3003 2 роки тому

    This is amazing. I'm freelancing and this helped me continue my project. 👏

  • @ihsaan7807
    @ihsaan7807 3 роки тому +2

    Really thorough, appreciate it. Keep em coming!

  • @mickeymercury713
    @mickeymercury713 Рік тому

    Classic, and still super useful. Would love to see more videos 😎

  • @NiveditaKulkarnni
    @NiveditaKulkarnni Рік тому

    This was so helpful Grace! Thank you so much :)

  • @maxhaenni
    @maxhaenni 2 роки тому

    Looking forward to more videos Grace!

  • @adeabramihza4672
    @adeabramihza4672 7 місяців тому

    Works perfect , thank you

  • @klm5123
    @klm5123 2 роки тому

    Thankyou for the Tutorial, waiting for more videos so helpful ✨👍🏻

  • @mr_draj
    @mr_draj 2 роки тому

    thank you so much for this tutorial, very helpful.

  • @Rasil14
    @Rasil14 2 роки тому

    This was an excellent tutorial, very easy to follow and worked perfectly. Thanks

  • @dalyonking
    @dalyonking 2 роки тому

    Thank you. Great tutorial and very helpful!

  • @waysearcher
    @waysearcher Рік тому

    Very usefull tutorial and it save a lot of time. You`re great! Thank a lot!

  • @aliihsanburak
    @aliihsanburak 2 роки тому

    Thank you so much!!! Works flawlessly ✅

  • @mikedekker5576
    @mikedekker5576 2 роки тому

    This has been very helpful, thank you!

  • @custommem
    @custommem 2 роки тому

    Thank you Grace! Very helpful!

  • @Ringa_fr
    @Ringa_fr 2 роки тому

    Wow ! This video is terrific ! 😍 Powerful ! Thank you very much Grace ! 🙏🏽 I want more animations ! Well done !

    • @ovalayacademy
      @ovalayacademy 2 роки тому

      *terrific

    • @Ringa_fr
      @Ringa_fr 2 роки тому +1

      @@ovalayacademy Oh thank ! 😁🙏🏽

  • @tetyana_sam
    @tetyana_sam 2 роки тому

    Thank you! useful tutorial👍

  • @kjellc
    @kjellc 2 роки тому

    Thank you so much! very helpful tutorial❤

  • @connorfinlayson
    @connorfinlayson 3 роки тому +1

    LESSSSGOOOO GRACE!

  • @melissamendez7056
    @melissamendez7056 2 роки тому

    So useful! Thank you for making this tutorial 🙌

  • @mobogamer2598
    @mobogamer2598 2 роки тому

    Thank you so much, your video is the best!!!

  • @marhawk6468
    @marhawk6468 6 місяців тому

    Thank you!!!

  • @alejandra0721
    @alejandra0721 2 роки тому

    Thanks a lot, u are the best.

  • @josephpino7755
    @josephpino7755 3 роки тому

    This is Brilliant

  • @businessboostersbiz
    @businessboostersbiz Рік тому

    Great tutorial, very helpful. I am wondering if it's possible to 'auto close' any viewed question by simply opening another question. I believe this is how drop down element works which is provided in webflow but I've found it to be a bit buggy at times. Thank you.

  • @barryazihuwa6168
    @barryazihuwa6168 2 роки тому

    Great!!!!! Thanks!!!

  • @iliutacristian8322
    @iliutacristian8322 2 роки тому +1

    Hello Grace, nice work, is it possible to have only one faq-item opened at any time? when I click another faq-item I want the current one to close, like an accordion? Ty

  • @KubaSobecki
    @KubaSobecki 10 місяців тому

    Thanks for this vid! I'm considering taking on Webflow and curious about one thing: Would making it so that when you open another answer, all others close automatically be a lot of additional work?

  • @tarqbordo9211
    @tarqbordo9211 2 роки тому

    you are so good ty for your help beside that u are so cool and nice

  • @kingjok369
    @kingjok369 2 роки тому

    Excellent Tutorial, keep up the great work. One question, my CMS words are all stacked on top of each-other how do I fix that? Thank you very much.

  • @AllenJackson1
    @AllenJackson1 2 роки тому

    I went looking for your other videos and was like, what?! This is her only video?? Moar pls. 🙂

  • @philipguidon4644
    @philipguidon4644 2 роки тому

    thank you

  • @macauleyliamcurran2925
    @macauleyliamcurran2925 Рік тому

    At 11:30 I’m setting up my initial state however under the hide/show section there’s no options

  • @oricknogueira
    @oricknogueira 2 роки тому

    Ajudou demais, muito obrigado :)

  • @Гиголяндрия
    @Гиголяндрия 2 роки тому

    Very good, thx

  • @kalen04
    @kalen04 2 роки тому

    Really thorough! Thanks a lot!
    Also what screen capture/recording program do you use?

  • @kasiitasolomon376
    @kasiitasolomon376 10 місяців тому

    Hello Grace, could you please assist me in configuring the accordion so that the first item automatically opens when clicked?

  • @NataliaDianov
    @NataliaDianov 11 місяців тому

    HI Grace, thank you for the tutorial! I repeated all steps [seems like], but my interactions at click happen to all "answers" at a time, not like yours - one at a time. Why is that happening? I've tried to apply this animation to class and to elements, and it's set for all children. I've heard you can only achieve that with the custom code, but it looks like yours are working like I want but I can't figure why mine is not. thanks!

  • @КузнецовВладимир-ъ1ш

    I love u! Thanks a lot!)

  • @MiroslavKokta
    @MiroslavKokta Рік тому

    What if the animation runs on all items at once even if I click on only one of them? Any advice? Thank you

  • @paulfrumkin7805
    @paulfrumkin7805 2 роки тому

    Nice tutorial, works like a champ, thanks Grace! I am using this as an accordion (rather than simple FAQ) and have come to a problem - within an expanded area we expose a form with a dropdown and once we click the dropdown, the wrapper just closes up (as we would expect). I tried putting the animation on the faq-question-wrap but that completely broke the accordion. Does the interaction/animation not work outside the scope of the control on which it is applied?

  • @m.d.3220
    @m.d.3220 2 роки тому +1

    Thanks for the video. But I have one problem... I did everything as shown in the video, now when I refresh the page and click on the first Question, everything works fine when I hit the Question again it hides and when I click on it the third time to show the answer again, every word is on a new line and the field becomes extremely large... Do you have an idea how I can solve this problem?

    • @bluessgc
      @bluessgc 2 роки тому

      it due to the "Size" animation. Set width to 0% and 100%.

  • @sdg-digital
    @sdg-digital 3 роки тому

    Nice video Grace!!
    One question: why did you decide to use grid instead of flex box or just regular positioning ?

  • @johnypress
    @johnypress 2 роки тому

    How can i do to the first item of the dropdown is opened to deffect?

  • @sudeshdas1755
    @sudeshdas1755 2 роки тому

    hi how can we keep open 1 faq initially?

  • @jadkareer1103
    @jadkareer1103 2 роки тому

    This doesn't work under my categories page. I have a FAQ page and when i go into categories the drop-down doesn't work. Anyone I could connect with the solve this?

  • @innovative-edge
    @innovative-edge 11 місяців тому

    My plus wrap is not listening to the Relative positioning. This is the part where the plus-vertical was a line through all the horizontal lines and we went back to switch the plus wrap position to relative. Anyone else have this problem?

    • @innovative-edge
      @innovative-edge 11 місяців тому

      In case anyone else gets the same result as I did... I set the overflow to hidden on the plus-wrap div to resolve this.

  • @tzolk
    @tzolk 2 роки тому

    Why is important to set opacity and size as well and not only display show/hide (on animation) ? thanks

    • @graceongrid
      @graceongrid  2 роки тому

      It gives a more smooth animation!

  • @kevinallan2283
    @kevinallan2283 3 роки тому

    A W E S O M E

  • @macauleyliamcurran2925
    @macauleyliamcurran2925 Рік тому

    I'm sure you're really busy Grace but you ought to come back to this channel if you can

    • @graceongrid
      @graceongrid  Рік тому

      Thanks Macauley! Really appreciate the encouragement - I'm working on new educational content around freelancing :)

    • @macauleyliamcurran2925
      @macauleyliamcurran2925 Рік тому

      @@graceongrid I was thinking of doing the same thing from a newbs perspective. Like watch me learn on the job but I’m unsure. Interested to see what knowledge you have to share x

  • @patrickbanou
    @patrickbanou 2 роки тому

    😘😘😘

  • @uxmotion8555
    @uxmotion8555 Рік тому

    Awesome tutorial , thanks so much 🙏