-
AuthorPosts
-
July 16, 2018 at 12:58 pm #985920
Hi there,
I would like to change the order how the social icons appears in the main menu. I’m using the burger menu.
This is how it looks right now:
I would like to show the icons this way:
Thanks for your help
July 16, 2018 at 10:55 pm #986134Hey Pedro,
Can you post a link to your site? so we can take a closer look.
And try to give a more accurate css code.Best regards,
NikkoJuly 17, 2018 at 1:11 am #986166July 17, 2018 at 1:12 am #986167ah sorry for missunderstanding – i see your issue now.
July 17, 2018 at 8:53 am #986302well my first input to that was to move the two things in the DOM.
because I am intensifying my knowledge about jQuery, I have a solution here, but I think it must be easier done. I looked at the helper-main-menu.php, but couldn’t find anything at first sight.
Maybe there is a solution via the filter: avf_main_menu_nav
It now depends on which headers you use. You may need to make adjust it for the transparent headers. The icons follow the shrink behavior. You still have to determine the transparency font color.this to functions.php of your child-theme
function change_menu_position() { ?> <script> (function($){ $('.main_menu ul.social_bookmarks').insertBefore($('.main_menu div.avia-menu')); })(jQuery); </script> <?php } add_action('wp_footer', 'change_menu_position');
this to quick css:
#top nav .social_bookmarks { margin-top: -20px !important; overflow: visible !important; height: 40px !important } .avia-menu.av_menu_icon_beside { padding-right: 0; margin-right: 0; border-right-width: 0; border-right-style: none; } .social_bookmarks li a { height: 40px !important; line-height: 40px !important; width: 40px !important; } #top .social_bookmarks li { width: 40px; height: auto !important; } #top .av-logo-container .social_bookmarks li a { border-radius: 50%; } .av_header_transparency .social_bookmarks li a { color: #969696 !important; }
the exact positioning of the social-bookmarks is then only possible if i have your life link afterwards.
July 17, 2018 at 9:12 am #986306Thanks a lot for all your responds.
This is the link to the website: dev.avmedios.es
July 17, 2018 at 9:16 am #986307Thanks a lot for your respond, it works flawless! Thanks a lot again
July 17, 2018 at 9:38 am #986314if you got a shop cart symbol there – it might be better to move the social bookmarks before the nav
i changed the code in the topic on top too – because this is more logical to do it the other way roundfunction change_menu_position() { ?> <script> (function($){ $('.main_menu ul.social_bookmarks').insertBefore($('.main_menu div.avia-menu')); })(jQuery); </script> <?php } add_action('wp_footer', 'change_menu_position');
PS: no adjustment needed as i can see on your site – looks good
July 17, 2018 at 9:57 am #986320Hi,
Thanks for sharing @guenni007 :-)
Did you get everything working as it should @pedro? If so, should we close the thread for now?
Best regards,
RikardJuly 17, 2018 at 10:24 am #986335Yes. It works perfectly. Thanks a lot, specially to @guenni007
July 17, 2018 at 2:17 pm #986437 -
AuthorPosts
- The topic ‘Change the order of the social bookmarks icon’ is closed to new replies.