Black Friday Sale! Get $20 off GP Premium, $40 off our new Lifetime license, and 45% off license renewals/extensions! Learn more

[Resolved] DIfferent Image icons on Secondary Menu

Home Forums Support DIfferent Image icons on Secondary Menu

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #163647
    Joseph

    While the secondary menu has an image insert option, I am trying to add a different image/icon to each menu tab in the Secondary Menu. Is the best way to do this through CSS using something like:

    li menu-item-# a{background-image: url(‘######’) no-repeat;}

    I tried this to no avail.

    If you notice the menu tabs under the slider, Presentation, Brochures, Foundry services…..there is an icon to the left here: industrialprojectsolutions.com.

    I moved the GP Secondary menu via the child function theme under the slider and the placement is good. I added an orange “test” icon for my visual use as to where the image using the Customization would appear as seen here:
    provinciawebdesign.com/client/ips/

    Can you share some ingight, it is much appreciated.

    Thanking you in advance.

    #163762
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    A plugin like this may be your best bet: https://wordpress.org/plugins/menu-image/

    Let me know 🙂

    #163793
    Joseph

    Thank you Tom, that was easy enough. I get weary of having a lot of plugins, sometime they conflict but this solved all, you’re the best!!

    #163820
    Tom
    Lead Developer
    Lead Developer
    #163857
    Joseph

    Tom, I tried searching for a thread on this fix. The secondary menu with images works fine on the home page nestled under the slider which I set on GPHooks as the following:
    AFTER HEADER:
    <?php if ( is_page( ‘2’ ) ) : ?>
    [smartslider2 slider=”1″]
    <?php endif; ?>

    All I wanted to do now is set a small image 100% across in place of where the slider was using the ID$ for the page in question. The images will be different and as mentioned I can control that with the Page ID#. However now the secondary menu looks to have lost the CSS on after I added the image with this code in GPHooks:

    <?php if ( is_page( ’25’ ) ) : ?>
    <img style=”width:100%” src=”http://provinciawebdesign.com/client/ips/wp-content/uploads/2016/01/About_top.jpg&#8221;
    <?php endif; ?>

    If I remove the code the secondary menu works fine. If you look at the About IPS page you can see what I’m talking about vs the Home page. provinciawebdesign.com/client/ips/about-ips.

    Here is the code used to move the secondary menu down below the slider/images in the child theme functions.

    add_action(‘after_setup_theme’,’generate_move_secondary_nav’);
    function generate_move_secondary_nav()
    {
    remove_action( ‘generate_after_header’, ‘generate_add_secondary_navigation_after_header’, 7 );
    add_action( ‘generate_after_header’, ‘generate_add_secondary_navigation_after_header’, 11 );
    }

    Just pulling what little hair I have left. Any help is appreciated.

    Thanks!

    #163859
    Joseph

    Never mind Tom, I guess it would help if I close the <img src…. I’m going to bed.
    I’ll buy a cup of coffee Friday, you are always on point on support.

    Thanks!

    #163915
    Tom
    Lead Developer
    Lead Developer

    Glad you found the fix! 🙂

    Thanks! Let me know if you have any other questions.

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.