Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • February 22, 2016 at 5:31 am #586826
    clairemartindigital

    Hi,

    love the theme and have been using it on several sites now.

    Scanned forum to achieve certain effects but can’t put it together right. I’d like to achieve the following:

    1. display mobile nav on desktop
    2. have the fly out menu NOT take up the entire screen on desktop
    3. have no border
    4. basically only have the logo and toggle float with the content visibile underneath
    5. no white container at the top when the page is scrolled all the way up
    6. no borders
    7. how can i change the icon used for the mobile toggle?
    8. have the toggle float (and not disappear) on mobile and desktop
    9. no logo on mobile (just the toggle)

    February 24, 2016 at 8:01 am #588200
    Vinay

    Hi clairemartindigital!

    We are working on your ticket please wait while we update the results here soon.

    1. display mobile nav on desktop

    
/* Display mobile nav in desktop*/
@media only screen and (min-width: 480px) {
	nav.main_menu {display:none !important;}
	#advanced_menu_toggle, #advanced_menu_hide {display:block !important; }
}

    2. have the fly out menu NOT take up the entire screen on desktop

    /* mobile menu width */
#mobile-advanced {
    width: 50%;
    right: -50%;
}

    3. have no border

    /*Remove menu item Border*/
#mobile-advanced a {
    border: none!important;
}

    4. basically only have the logo and toggle float with the content visibile underneath
    This will be a lot of custom work you need to hire a freelancer

    5. no white container at the top when the page is scrolled all the way up
    Please provide a mockup upload your screenshot to imgur.com and link it here.

    6. no borders
    Enfold > General Styling > Logo area > Border colors
    Enfold > General Styling > Main Content > Border colors
    Delete border color value and save changes.

    7. how can i change the icon used for the mobile toggle?
    Upload a png image to media library and use the below css

    
/* Custom menu Icon*/
a#advanced_menu_toggle:before { 
content: url(https://LINK_TO_ICON.svg); 
}

    or follow this thread
    https://kriesi.at/support/topic/changing-mobile-menu-icons-using-entypo-fontello/

    8. have the toggle float (and not disappear) on mobile and desktop
    Please provide a screenshot and elaborate what you want the end result to look like.

    9. no logo on mobile (just the toggle)

    /* Hide Logo on Mobile*/
@media only screen and (min-width: 480px) {
	.logo {
		display:none!important;
	}
}

    Best regards,
    Vinay Kashyap

    • This reply was modified 8 years, 10 months ago by Vinay.
    February 28, 2016 at 12:34 am #590318
    clairemartindigital

    Thanks for all that. I have posted link to website and admin login details in private section below. I have some issues which I am hoping you can help with:

    1. when clicking the menu toggle the page will jump back to top.
    2. when fly out menu is active, the menu toggle icon and the close button are not alligned. not sure what a possible solution for this could be? it works well on the homepage where the menu icon isn’t visible when the fly out menu is active (still the issue of the page jump remains – see #2)
    3. how can i make entire color section and its contents clickable?
    4. on http://digitalfreelancer.net.au/projects/ – can i apply a custom background and font color for each of the portfolio preview sections?

    thanks

    February 29, 2016 at 1:31 am #590522
    clairemartindigital

    Hi again,

    here is another one:

    5. how can i apply the default link settings to the footer widget?

    March 2, 2016 at 3:45 am #591851
    clairemartindigital

    Hi again, and here is another issue.

    6. The advanced menu toggle is currently not visible on tablet.

    March 2, 2016 at 2:16 pm #592072
    clairemartindigital

    Hi again guys, I do realise that you guys must get a tone of requests. I was hoping to get a response soon as I am planning to go live with my new site this weekend. Many thanks in advance for your guys hard work.

    P

    March 4, 2016 at 5:59 pm #593423
    Vinay

    Hey!

    Sorry for the delay. We do appreciate your patience :) Some of our moderators have health issues and at the moment we are a little busy but we try to answer everyone as soon as possible.

    Answering many questions in one ticket get’s confusing as the questions and answers tend to get mixed up in one ticket . let’s keep the focus on one topic in one ticket. Please create new tickets for different issues.

    Alright! let’s get to the issues and help you resolve them…

    1. when clicking the menu toggle the page will jump back to top.

    Remove the “href=”#” ” from the menu 

    <a id="advanced_menu_toggle" href="#" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></a>

    2. when fly out menu is active, the menu toggle icon and the close button are not alligned….

    You need to use the option Enfold > Header > header behavior > Let logo and menu position adapt to browser window

    By doing so the mobile menu will be placed to the right side of the header.

    3. 4. 5.

    Please create a new tickets for each issue.

    6. The advanced menu toggle is currently not visible on tablet.

    To make the header sticky in tablet use the below css in Quick CSS

     
@media only screen and (max-width: 767px) {
	#header_main {
		position: fixed!important;
	}
}

    Cheers!
    Vinay Kashyap

    • This reply was modified 8 years, 9 months ago by Vinay.
    March 5, 2016 at 10:30 am #593676
    clairemartindigital

    Hi Vinay,

    regarding #1: Remove the “href=”#” ” from the menu

    Where do I do that?

    Thanks

    March 7, 2016 at 7:34 am #594106
    Rikard

    Hi,

    You should be able to do that under Appearance–>Menus

    Best regards,
    Rikard

    March 7, 2016 at 11:27 am #594205
    clairemartindigital

    Hi Rikard, no sorry, that is not the case.

    P

    March 7, 2016 at 1:15 pm #594266
    Vinay

    Hi!

    Please add this to your functions.php make sure you are using a child theme.

    Using a Child Theme

    // Remove href from menu button
function custom_excerpt(){
?>
<script>
jQuery(window).load(function(){
   jQuery("#advanced_menu_toggle").removeAttr("href");
});
</script>
<?php
}
add_action('wp_footer', 'custom_excerpt');

    Regards,
    Vinay Kashyap

    March 11, 2016 at 5:27 am #596670
    clairemartindigital

    Hi guys,

    still scrolls back to top upon clicking the menu. its fine, i can live with that. thanks

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Mobile menu’ is closed to new replies.