1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Divi Header Style #12 with hamburger menu

Discussion in 'Basic Support Forum' started by Mike86, Nov 27, 2020.

  1. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Yes. That's what it does. Kindly try & see.
     
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Modern & powerful Agency Divi layout pack, featuring team carousel, sliding menu, etc.View Demo
  2. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    I tried it but it didn't work.

    Please see the attached images.

    The cart icon is now on top of site logo in the sidebar menu.

    sidebar menu where the cart icon is on top of site logo.jpg menu bar but no cart icon.png header style 12 divi builder.png
     
  3. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    1. PRO MEMBER PERKS Divi Block Pro - Premade dynamic background hover design for your Divi site without using any plugins:View Demo
  4. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    Thanks!

    I am also trying to hide the cart menu icon when the cart is empty. I have tried several code snippets but no luck.

    Do you know how to hide the Woo cart menu icon when the cart is empty?
     
  5. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    That would require custom coding. Not possible to achieve it with CSS alone.

    You will need to edit the plugin file in WP Admin > Plugins > Plugin Editor > Divi Ultimate Header Plugin & change line 1109 - 1121 into:
    Code:
    Log In or Sign Up to view this code.
     
    1. PRO MEMBER PERKS Divi Block Pro - 30+ premade custom header designs for you to choose from:View Demo
  6. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    Big Thanks for that code!

    Could I use that code with Code Snippets? So the changes won't override when updating the Divi Ultimate Header Plugin.
     
  7. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    You will need to create a new shortcode for that. Similar to what we did on the plugin file.
     
    1. PRO MEMBER PERKS Divi.Help Layout AI Generator - Try the power of AI to generate a custom Divi layout for you:Try Now
  8. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    Do you have a tutorial on creating a new shortcode? I have never done that.
     
  9. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    You may try to paste the below code in your child theme functions.php & use this shortcode in your text module: [dh_header_cart_icon_minimal]
    Code:
    Log In or Sign Up to view this code.
     
    Mike86 likes this.
    1. PRO MEMBER PERKS Divi Ultimate Archive Plugin - Tons of elegant premade sidebar styles to choose from for your Divi site:Learn More
  10. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    Hello,

    How could I make the [du_header_cart_icon_minimal] cart icon bigger?

    Thanks in advance!
     
  11. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Try the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.
     
    Mike86 likes this.
    1. PRO MEMBER PERKS Beautifully crafted custom colored 'Digital Marketing' Divi layout for all Pro members:View Demo
  12. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    Hello,

    Cart icon doesn't link to cart in two WooCommerce category archive pages. Also the cart icon is red on these two pages and black in other pages. When I click the cart icon, it only opens the sidebar menu as it would when clicking the hamburger menu icon.

    Do you know how to fix this issue?

    Thanks in advance!
     
  13. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    I found out that the problem occurs when there is products in WooCommerce category. Please see these screenshots here where you can also see my site url:

    https://imgur.com/a/9BE3Fz8

    Do you know how to fix this?
     
    1. PRO MEMBER PERKS Divi Ultimate Archive Plugin - Replace the default archive "Older Entries" with beautiful pagination:Learn More
  14. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Try the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.
     
    Mike86 likes this.
  15. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    1. PRO MEMBER PERKS Divi Block Pro - Premade floating button design for your Divi site without using any plugins:View Demo
  16. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    Hello,

    I have a question about the Header style #12.

    How could I add shortcode between the left hand logo and right side cart icon? I am trying to add a search bar between logo and cart icon.

    I added a code module in Visual editor and it shows the shortcode and the search coming with it in the builder but I can't see the search in front end.
     

    Attached Files:

  17. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Since the Cart Icon module is also a shortcode, you may duplicate the module & paste your search bar shortcode in it & see how it goes.
     
    1. PRO MEMBER PERKS Divi Mini Cart Pro Plugin - Instantly add 3 different types of mini cart to your Divi site:Learn More
  18. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    Thanks for the advise!

    I copied the Cart icon module and pasted the search bar shortcode there.

    I then added 50 pixels of margin left and right of that module. And in Visual editor it looks ok but in the frontend icon and search bar are on top of each other. Please see the attached images.

    What could I try next?
     

    Attached Files:

  19. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Kindly share your URL for me to check further.
     
    1. PRO MEMBER PERKS Divi Ultimate Blog Plugin - Easily set awesome default design for your Divi single blog page:Learn More
  20. Mike86

    Mike86 Member
    Divi Ultimate Header Plugin

    Thanks for taking a look!

    Is there a way to share the url private? I don't want the site url to be public.