How to Add a CTA Button to the Divi Menu

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

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

  • @BrunoVMann
    @BrunoVMann 7 วันที่ผ่านมา

    Really good video, thanks!

  • @folaketaylormd
    @folaketaylormd 9 หลายเดือนก่อน

    Great video. Thanks. I was able to add the css in the comment on the blog to make sure the button shows up correctly on mobile. The only issue I have now is I want the text color to be white but it defaults back to the color of the other menu buttons which is black.

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

    Thank you for this code and tutorial!

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

      You are so welcome!

  • @HeatherParady
    @HeatherParady 4 หลายเดือนก่อน +1

    thank you!

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

    great help ! Thanks !!!!!!!!!!

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

      You're welcome! I'm glad I could be of assistance. Thank you for your kind words, it means a lot to me! If you have any more questions or need further help, feel free to ask. Have a fantastic day!

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

    Great tutorial - thank you. I was wondering if there is way to add 2 CTA buttons where one is solid colour, the other one has only a frame to differentiate between the two buttons. Also on mobile menu these buttons look very close to each other, so I was wondering is there is a way to add space between such CTA buttons on the menu?

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

    This really helped me - thank you! My only question is it's looking a little funky on my mobile device menu (it's really big!). Have you shared any code to adjust for mobile devices?

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

      Hey there, sorry, I'm seeing this a little late. The easiest way to create mobile specific styles would be to add a media query to target those screens. When I have some free time, I will update this tutorial with that code. Stand by 😁

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

      @@DiviEngine it would be SUPER helpful to get some information on this! Just implemented it today and desperately need to change the mobile styling-it's definitely looking a little funky! 😅

    • @folaketaylormd
      @folaketaylormd 9 หลายเดือนก่อน

      Someone in the blog comments used this code and it worked for me
      #mobile_menu .de-menu-cta a {
      line-height: 1.3em !important;
      padding-top: 9px !important;
      padding-bottom: 9px !important;
      }

    • @folaketaylormd
      @folaketaylormd 9 หลายเดือนก่อน

      @@nestdecor4682 From blog comments
      #mobile_menu .de-menu-cta a {
      line-height: 1.3em !important;
      padding-top: 9px !important;
      padding-bottom: 9px !important;
      }

  • @deliaarber
    @deliaarber 10 หลายเดือนก่อน

    Hi, the Code is great but my Buttom is way too low and with the padding nothing changes, how can I set the button a little higher (centered) in the menu?

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

    How if I want the link to be open in a new tab?

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

    I already have some code in that Custom CSS box so I am unsure where to insert the code? Can you help or anybody else?

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

      Hello!
      If you are in the Theme Options, just find the last } bracket and add your code below and it should work find :)

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

    Hey when you are scrolling the button text disappears. How do I fix that?

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

      By the way many thanks for the code

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

    This helped a lot! But having problems with changing the text color. It just stays as the default link colors instead of changing to the color I want...

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

      Hi there Alexander! It is working fine for me, but maybe there is some other CSS overriding it for you. To overcome this, try adding !important to the CSS where we define the background color.
      For example: background-color: #000000!important;

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

      @@DiviEngine I am having the same issue changing the text color to white. It won't override the already existing !important CSS in the existing css.

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

      I had the same issue... was caused by. using a custom header - worked fine without that in use... @@thewillage