Tagged: 4.1, mobile menu, social icons
-
AuthorPosts
-
July 11, 2017 at 6:00 pm #819560
Excited about 4.1 and especially new horizontal gallery element – thank you! Also excited to see more love coming for mobile given that 87% of our site’s users are mobile now. The new update looks very exciting!
I updated on my staging site and am seeing some strange behavior on mobile.
– On the home page only, there is a small red “x” and very micro small hamburger menu in the top left of the iPhone screen.
– Social icons on top of screen are not showing up anymoreI removed the mobile menu customizations in custom css but that has not solved problem.
** PLEASE track any changes you make so I can make them on production site manually in the event this takes several days to resolve. Production site is constantly updating and evolving. Thanks!!! ***
Login credentials in private content below.
Thanks!!
July 11, 2017 at 6:09 pm #819565Hey Rob :)
Thanks for the information and for your feedback :)
Header.php file was updated in this version and i see that you have header.php file in your child theme. Could you please copy header.php file from parent theme once again and apply the changes you previously applied on header.php file in child theme? This should solve the issues or bring us one step closer to solving it :)
Best regards,
YigitJuly 11, 2017 at 6:16 pm #819569Yigit, thanks! Uh oh…. .I think the customizations on the header were to enable two logos one on the left and one on the right of the header screen.
He also put some custom javascript in a custom javacscript plugin (appearance — > custom javascript) that I wonder is causing issues?
jQuery(document).ready(function($) {
$(‘#header_main > div.container.av-logo-container > div’).delay(100).show(0);$(window).on(‘load resize’, function(){
var width = $(window).width(), height = $(window).height();
if ((width <= 768)) {
$(‘.logo img’).css(‘height’,’71px’);
$(‘#advanced_menu_toggle’).css(‘display’,’block’);
}
if ((width <= 425)){
$(‘#header_main > div.container.av-logo-container’).css(‘line-height’,’inherit’);
} else {}
})});
There is also a helper-main-menu.php file – does everyone have that?
I see a header customization there too:
/************* DS hard coding 2nd logo inside shrinking container *************/
$output .= “<strong class=’logo’>“;
/***********************************************************//*
I remember getting the 2nd logo to display in the header was a big big deal when I first began setting up Enfold.
Thanks much!!!!
Rob- This reply was modified 7 years, 3 months ago by goldengate415.
July 11, 2017 at 6:50 pm #819579I am having the same problem. I don’t have a header.php in my child theme
I am seeing this in the source:<a id="advanced_menu_toggle" href="#" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></a> ::before </a> <a id="advanced_menu_hide" href="#" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></a> ::before </a>
Any ideas?
- This reply was modified 7 years, 3 months ago by argusnet.
July 11, 2017 at 6:52 pm #819584Hi @argusnet,
I am currently working on @goldengate415’s website. Could you please start a new thread under Enfold sub forum and attach FTP and WP admin logins in private content field so we can look into it?
Best regards,
YigitJuly 11, 2017 at 6:58 pm #819587Adding FTP access in private content
July 11, 2017 at 7:57 pm #819599Hi Rob,
I added following code to bottom of Quick CSS field in Enfold theme options
@media only screen and (max-width: 767px) { .responsive #top #header .social_bookmarks { display: block!important; }}
Changed your custom JS to following
jQuery(document).ready(function($) { $('#header_main > div.container.av-logo-container > div').delay(100).show(0); $(window).on('load resize', function(){ var width = $(window).width(), height = $(window).height(); if ((width <= 768)) { $('.logo img').css('height','71px'); } if ((width <= 425)){ $('#header_main > div.container.av-logo-container').css('line-height','inherit'); } else {} }) });
Overwritten header.php file and made small adjustments on helper-main-menu.php file. However there is still a duplicated menu on mobile. Do you by chance know why? I could not find such customization on your child theme
Best regards,
YigitJuly 11, 2017 at 10:56 pm #819679Hi Yigit,
Thanks for your progress!
Yes it looks really strange…
I removed this from Functions.php:
/*** Adding search capability to mobile menu per Enfold support ***/
add_shortcode(‘avia_search’, ‘get_search_form’);function add_custom_tooltip(){
?>
<script>
jQuery(window).load(function(){
jQuery(‘.only-mobile-menu-search a’).removeAttr(‘href’);
});
</script>
<?php
}
add_action(‘wp_footer’, ‘add_custom_tooltip’);And that eliminated the [avia_search] from the menu.
I wonder if the issue is in the code for the helper-main-menu.php? I don’t know php but it seems like there are a lot of “calls” in there for the header and social media icons which seem to be at the root of this?
Thanks,
RobJuly 12, 2017 at 5:06 pm #820120I wonder if the customization is something in style.css?
There is mention of the mobile menu here:
/* Mobile menu hamburger */
#advanced_menu_toggle, #advanced_menu_hide {top:20%;}
.home .av-share-box {display:none;}Hoping we can get this working today so I can begin updating site again. Given the number of changes you made I think it is best to push staging to production but I can’t do that until staging is working. Thanks!!!!
July 13, 2017 at 8:50 am #820390Thanks for the code @Yigit
I was looking for a solution to bring my social media icons back to the top of the menu on the mobile display. -
AuthorPosts
- You must be logged in to reply to this topic.