Adding Shortcode to Menu Breaks Formatting of Mobile Menu

  • Hello,

    Your plugin has allowed me to show my shopping bag in the menu of my site, which is great! However, Adding shortcode to the menu causes the formatting of my mobile menu to change. For example, the row for the word “Home” is significantly wider than the other pages, and the word “Blog” moves far to the right.

    I have attempted only adding shortcode to my desktop menu and not my mobile menu. This did not work. The only thing that fixes it is deleting any shortcode from all of my menus. Do you know of a solution?

    Thank you for your time,
    Eric

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter broketrainenthusiast

    (@broketrainenthusiast)

    Sorry, it appears that the issue was on my end.

    Plugin Author Gagan Deep Singh

    (@gagan0123)

    Apparently, you have multiple menus, you added the code to the one, that displays on Desktop, and not the one that is displayed for mobile

    Just add the same shortcode in mobile menu, and you should be fine.

    Plugin Author Gagan Deep Singh

    (@gagan0123)

    Also, you’ll need to handle the CSS for the elements that are added in the menu, yourself, because this plugin does not output any CSS on its own.

    Thread Starter broketrainenthusiast

    (@broketrainenthusiast)

    Hello,
    I decided to use different shortcodes for each menu. Adding this shortcode [wp_compact_cart] to the bottom of my mobile menu creates a lot of whitespace under it and adds two blank social icons to the social menu using the following code for each:

    <a style="color:#00E2E6;font-weight:500;" href="https://broketrainenthusiast.com/bag/ "></a>

    If I place it anywhere else in the menu, the menu items below it have incorrect formatting similar to that seen in the original question

    Can this be fixed?
    Thank you,
    Eric

    Here is the php called by the shortcode:

    function wspsc_compact_cart_handler($args)
{
    $num_items = wpspc_get_total_cart_qty();
    $checkout_url = get_option('cart_checkout_page_url');

    $output = "";

    if(!empty($checkout_url)){
        $output .= '<a style="color:#00E2E6;font-weight:500;" href="' . $checkout_url . ' ">' . "Bag (" . $num_items . ")";'</a>';
    }else{
        $output .= "Bag (" . $num_items . ")";
    }
    return $output;
}
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Adding Shortcode to Menu Breaks Formatting of Mobile Menu’ is closed to new replies.