How do you change the desktop expanded menu icon from the ellipsis to a different icon?

• 

  notenetworkau · Member · Oct 7, 2020 at 2:33 pm

  • Copy link
  • Add topic to favorites

  I just want to make the desktop expanded menu have a cart icon instead of an ellipsis. This should be a very simple task but I can’t figure out how to do it and I have been trying for several hours.

  I am using the Twenty Twenty theme on my website: http://thenotenetwork.com.au/ (it’s still under construction). My issue is with the ellipsis icon above ‘View Cart’. Here’s the code I currently have in the header.php file of my child theme:

  
  
  

  
  

  I have tried adding a few different inline SVGs of a shopping cart, like this one: https://iconify.design/icon-sets/typcn/shopping-cart.html

  I went into my child theme’s classes folder and opened the file class-twentytwenty-svg-icons.php (classes/class-twentytwenty-svg-icons.php). Below the ICON STORAGE comment with the list of other icons, I typed ‘cart’ => and pasted the inline SVG code for the shopping cart.

  I went back to the header.php file and added this code:

  The image that came out was a tiny line or two. It basically didn’t look like anything.

  I tried using one of the SVG icons already in the list to see where the problem was. I used the ‘arrow-down-circled’ icon in place of the ellipsis like this:

  This time, all I got was one tiny dot.

  I don’t understand why nothing but tiny dots or lines appear every time I try to use a different icon to the ellipsis. I am stuck and frustrated why I can’t get past this simple issue. Can anyone please help me find out what I’m doing wrong?

• 

  notenetworkau · Member · Oct 7, 2020 at 2:46 pm

  • Copy link

  Re-posted in Themes
  https://wordpress.com/forums/topic/how-do-you-replace-the-ellipsis-icon-on-the-desktop-expanded-menu/