Shortcode not displaying on main menu

  • Resolved thtgyrl

    (@thtgyrl)


    5 years, 5 months ago

    Hello,

    Thanks for this amazing app! Question? My shortcode “[searchandfilter headings=”Search by Category” types=”select” fields=”category”]” is not working on the main menu, but works fine on mobile menu, how do I remedy?

    Thank you,
    Jessica

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

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Gagan Deep Singh

    (@gagan0123)

    5 years, 5 months ago

    @thtgyrl

    I tested that out, turns out this plugin is working as expected, but you’ll need to modify some CSS in order for the element, added by this shortcode, to be displayed on your site. Here’s a screencast I made, explaining which element’s CSS you might want to modify and which properties are making the search by category disappear in the menu.

    Let me know if you need any further assistance, I’m marking this as resolved, because the issue isn’t with this plugin, but the theme’s CSS.

    Thread Starter thtgyrl

    (@thtgyrl)

    5 years, 5 months ago

    Thank you! Thank you! Thank you! That worked perfectly. I really appreciate it! It would be amazing if you could help me make a few more tweaks!

    When I enter this code in the header.php:

    <ul>	
			<?php 
				if ( has_nav_menu( 'primary-menu' ) ) {		
						echo ( do_shortcode( '[searchandfilter headings="Search by Category" types="select" fields="category"]') );
				} 
						?>
					
					</ul><!-- search and filter -->

    It shows up like this: https://ibb.co/Wtdp7C4

    With the current css, it shows up like this: https://ibb.co/FHqSzk0

    Is there a way to make it show up like the first image, without the triangle, the submit button to the right of the search field and inline with the other menu items?

    Thanks again!

    Thread Starter thtgyrl

    (@thtgyrl)

    5 years, 5 months ago

    Okay, so I think I figured out two out of the three. Still having trouble with the nav selections being centered vertically.

    Plugin Author Gagan Deep Singh

    (@gagan0123)

    5 years, 5 months ago

    @thtgyrl

    I must warn you, I’m not that good with CSS, and CSS is not that easy that it seems. You change one thing here, for this resolution, something else in different resolution might mess up. You need to be careful.

    Now about this particular section, you can add this to your stylesheet:

    
.menu-item-type-gs_sim form.searchandfilter {
    margin-top: -55px;
}

    It will make the Search by Category select field, inline with rest of the menu. You might have to write some different CSS for different resolutions, but it will work for most laptop/desktop resolutions as shown here:

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Shortcode not displaying on main menu’ is closed to new replies.