WordPress.org

Ready to get started?Download WordPress

Forums

Genesis Social Profiles Menu
[resolved] Aligning icons in menu bar (11 posts)

  1. deswalsh
    Member
    Posted 2 years ago #

    I've installed the icons in the main menu bar. The problem I have is that they are sitting at the top of the space. What can I do to show them as aligned with equal spaces vertically - i.e. so they line up with the text in the other tabs?

    http://deswalsh.com

    Des Walsh

    http://wordpress.org/extend/plugins/genesis-social-profiles-menu/

  2. daveshine (David Decker)
    Member
    Plugin Author

    Posted 2 years ago #

    Hi there!

    You only need to add the "space-top" helper class to each menu item.

    If you have entered the following class:

    email-prl-s24

    it then becomes this:

    email-prl-s24 space-top

    Just add this to each of your items and it will result in some extra space at the top and should do great alignment with the child theme you're using.

    I hope this helps!

    Thanx for using my plugin!
    -Dave :)

  3. deswalsh
    Member
    Posted 2 years ago #

    Thanks Dave - all fixed! :)

  4. anavas23
    Member
    Posted 2 years ago #

    I've followed your instructions but now I'm wondering how I can move the icons to the right side of the menu bar.

    Thanks for the awesome plugin.

  5. deswalsh
    Member
    Posted 2 years ago #

    anavas23 I don't want to pre-empt what Dave might say, but isn't that a function of the WP custom menu system, where if you move items up and down in the setup window, that affects their position to left or right in the menu bar. In other words, just make sure all the icon items are grouped below all the other tab items. Hope that helps. But Dave may well have a better answer for you.

  6. anavas23
    Member
    Posted 2 years ago #

    The icons are in the correct order so that's not the problem. What I'm trying to do is have the icons on the aligned on the right side of the nav bar while the actual menu items are on the left side.

    As they are now, I have the menu directly followed by the icons which appear in the middle of the nav bar as you can see at http://www.ICEANow.org

  7. deswalsh
    Member
    Posted 2 years ago #

    I don't really know but my guess is the custom menu won't help you with this, although maybe there is some fancy CSS work that could achieve that - way out of my competence to advise on that. Have you considered putting the icons in the right side of the header? I think you could get some help with that in the Genesis forums.

  8. daveshine (David Decker)
    Member
    Plugin Author

    Posted 2 years ago #

    @anavas23:

    Hi there! Thanx for your feedback and using my plugin! :)

    However, your issue can easily be fixed by adding the included helper class "space-left":

    #nav .space-left {
    	margin-left: 400px !important;
    	margin-right: 0 !important;
    }

    Add this to your style.css of the child theme. You can tweak the "400px" value to your liking so that it best fits your theme/menu.

    I hope this helps, Dave :)

  9. deswalsh
    Member
    Posted 2 years ago #

    So logical! :)

  10. anavas23
    Member
    Posted 2 years ago #

    Got it working now. I did exactly as you instructed and it worked perfectly. I had the css in there but didn't add the helper class.

    Thanks for a great plugin.

  11. daveshine (David Decker)
    Member
    Plugin Author

    Posted 2 years ago #

    Thanks for your feedback all and thanks for using the plugin, muchly appreciated :-)

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic