How to Create Flip Cards with Any Module in Divi Without a Plugin

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

КОМЕНТАРІ • 65

  • @anaochoa_m
    @anaochoa_m 2 роки тому +6

    I tried this, but in my case
    I don't see the Column CSS
    Any idea why?

  • @Sheknowsdigital
    @Sheknowsdigital 4 роки тому +9

    Hi I went through all steps just to learn at the end that you changed the functionality and this doesn't work anymore. I have the latest version, added a row and added a class to each column, nothing happens. Please advice. Thanks!

  • @florianmartel4470
    @florianmartel4470 2 роки тому +2

    Hello, this tutorial is very interesting but it does not work or more because the column class id fields do not appear in my version how to do?

  • @melspedito-jovial6589
    @melspedito-jovial6589 3 роки тому +4

    Hi it's a really useful video! I have one question what CSS modification should I do if I want to click on the flip cards rather than hover on? thanks

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

    I just found the tutorial for the flip box using elementor it is much easier and easy to resize. So I will probably use this 1 since elementor suppose to work in Divi theme templates. This is still a good tutorial. Thank You.

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

    Great video. Will the code remain intact when I perform Divi theme updates? Thanks!

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

    This is excellent Mac, it really shows just how flexible Divi really is and how it can be used for fully bespoke websites. Thanks :-)

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

    this seems different now. Doesn't appear to be working for me. Am I missing a step? Did I need to do something in animations or hover. Also I did not see a space for CSS column class there was only one space.

  • @koleman1075
    @koleman1075 5 років тому +1

    Hey quick question, so i followed this very well, analized all my code and made sure it was the exact same, however whenever i hover over my front side card it spazzes out as it tries to flip the card. Any help would be appreciated! I believe it has to do with when it flips there is a fraction i am not hovering because of the flip animation.

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

    This has been unbelievably frustrating for me. I have tried this at least 6 times and it doesn't work for me. Even with the new information on where to find the column CSS classes.

  • @ConnectNepalTV
    @ConnectNepalTV 4 роки тому +1

    I think this is not easy as elementor, sorry for this, but tutorial is good. There should be option flip box while we add from + sign.

  • @pattyartt
    @pattyartt 5 місяців тому

    To everyone telling it doesn't work - Divi have changed the columns management. So you need to first edit row, and after click on gear to edit certain column.

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

    We went through all the steps but the part at 5:19, only "CSS Class" is appearing, no options for Columns. How to we resolve this?

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

      Go to column configuration and set css class there. You'll need to get into the row configuration and you'll see a single column, did i make myself clear? Sorry for my english

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

      @@marioalejandre2307 thank you very much dude! It was very clear, it works! :D

  • @ma.belengonzalez8323
    @ma.belengonzalez8323 5 років тому +5

    I cant get the column css class part.. so i cant finish the flip box.... any suggest?

    • @zejulien1
      @zejulien1 5 років тому +1

      Same here

    • @arthurvalvi
      @arthurvalvi 4 роки тому +1

      Do you have the latest version? If so, you must enter the row and in the row you go to the configuration of each column, in the latest versions the way of handling the columns has changed. ;)

    • @Sheknowsdigital
      @Sheknowsdigital 4 роки тому +1

      @@arthurvalvi I tried and it doesn't seem to work really frustrating as you go through all this process to learn at the end that something was changed and it just doesn't work

    • @Sheknowsdigital
      @Sheknowsdigital 4 роки тому +3

      @@arthurvalvi Hi I went through all steps just to learn at the end that you changed the functionality and this doesn't work anymore. I have the latest version, added a row and added a class to each column, nothing happens. Please advice. Thanks!

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

      i have the same problem

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

    Great video but where is all that custom CSS code you pasted?

  • @traffickerdigital3602
    @traffickerdigital3602 4 роки тому +3

    Hi Thanks for the tutorial, but I can't find the cathegory columns ccs Class?
    Any suggestions, please

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

      Do you have the latest version? If so, you must enter the row and in the row you go to the configuration of each column, in the latest versions the way of handling the columns has changed.

  • @pietou.j
    @pietou.j 2 роки тому

    great !
    How to do this on-click and not on hover ?
    Thks !

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

    To make it work in divi latest version (4.14. 3) the row is de green box and inside of this settings you'll see Column Structure option.
    Para hacerlo funcionar en la ultima versión de divi (4.14.3) la fila es la caja verde, dentro de las configuraciones de esta veras las opciones de la colmna.

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

    There is no Column CSS Class: flip-box-column!?? Can you please help?

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

      did you find a solution to this? I have the same issue ..

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

    Sort of working, except the front card is just flipping over and showing reverse and stacked on top of the back card....any suggestions?

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

      same to me, anyone helps?

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

      Okay i figured it out, it's already been a year i'm sorry. I'll let you know tho.
      I supose you used your own custom blurbs right? I just tried with those premade blurbs and it worked!! I don't know why yet.

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

    Why I don't have column css id in my row settings?

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

      Hi Bryan! 👋
      It needs further investigation, so please, create a ticket with the Support Team:
      www.elegantthemes.com/members-area/

  • @ΚΩΝΣΤΑΝΤΙΝΟΣΠΑΠΑΜΑΡΓΑΡΙΤΗΣ

    It is a really helpful video, but I haven't the colum css at (5:55 min) anyone can help?
    I have the latest version of divi. And I can see it is a common issue...

    • @puppyohgang.9827
      @puppyohgang.9827 4 роки тому +2

      the column class id is within the individual column options on divi 4.

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

      same here.

  • @VitalityLabDE
    @VitalityLabDE 5 років тому +5

    It is a really helpful video, but I do not have the colum css (5:55 min) anyone can help?

    • @penandalex
      @penandalex 5 років тому +1

      Same problem over here :(

    • @Essfre10
      @Essfre10 5 років тому +1

      same

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

      Same here. Not really working

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

      Same here

    • @jaybradley8037
      @jaybradley8037 5 років тому +4

      Figured I'd share the solution, since I just had to figure it out tonight. The fields you are looking for are likely found by going to the column tab of the row settings instead, then clicking on the "gear" icon of each column. In the advanced tab, you will find "CSS Class" there. In this context, it applies to the column. Note you'll need to set each column's CSS Class individually.

  • @MarcosAlexandreReis-u5c
    @MarcosAlexandreReis-u5c 8 місяців тому

    Excellent!!!

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

    Hi, Thank you so much for your help! I was successful in creating flashcards for desktop view. However, I noticed that your video explains how to have them on mobile as well but they don't flip on mobile. Is there a way to make them flip on mobile too? Thank you for any help you can give :)

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

      This tutorial deliberately turns OFF the flip function on mobile. So try removing the changes from the tutorial when Mak starts talking about mobile and see if that works.

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

    Doesn't work in IE11 - any ideas?

  • @theeverleinhour9616
    @theeverleinhour9616 8 місяців тому

    it makes my cards flip backwards

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

    Why don't working for mobile view?

  • @kokopelli-world
    @kokopelli-world 5 років тому

    can you please advise what is the css code used?

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

      Hi there! Please visit our blog for the CSS codes that were used on this video. 😊 www.elegantthemes.com/blog/divi-resources/how-to-create-flip-cards-with-any-module-in-divi-without-a-plugin

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

    How to create virtual vising card using divi in wordpress.

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

    Great tutorial! Needed this.

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

    Anyone know how to correctly resize the cards?

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

    Change MAK university to CSS university.