Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • #834738

    Hello –

    1) I never noticed this as I don’t use cell phones, but today I just saw that when you go to http://www.DominiqueHurley.com and look at the top, the menu (3 bars) and magnifying glass icon are on top of my logo if holding the phone normally. They’re OK if holding the phone horizontal.

    Can this be fixed or does it need to? I don’t know if people are used to this and automatically turn their phones. Please advise.

    I did just redesign the homepage so that it has more of my content (WooCommerce product sliders) on it – hoping they don’t miss it.

    2) Also, when I do turn it horizontal, I can click on the menu bars to see my main ones. But the only one that works to see all the pages under the main one is the last one, Art/Shop. The others go dark when I put my finger on it, bu tthe subtitles don’t appear under it or anything. For example, I can tap on Free Resources many times without anything happening except that it highlights and goes back to normal when I take my finger off.

    Is this just my site? my iPhone 5?

    Thank you.

    #834854

    Hey dominiquehurley,
    To move the top items away from your logo, Try this code in the General Styling > Quick CSS field:

    @media only screen and (max-width: 767px){
    .responsive #top #wrap_all .main_menu {
        right: -50px!important; }}

    For the menu items try replacing the “#” url of the main parent menu item with “##”

    Best regards,
    Mike

    #835032

    Thanks Mike – the 3 menu bars are now beside my logo, but the search magnifying glass is still on top. More importantly, however, is point 2 from above. Most items in my menu don’t open to the submenu. For example, if I click on Free Resources, nothing happens. Only the last one opens to a submenu. Any ideas why? So only 3 of the 4 that have submenus reveal them. Blog and Home go to new pages. Thanks.

    #835043

    Hi,
    Here’s how the mobile menu looks to me:
    2017-08-06_092519
    Can you add a screenshot of what you see?
    Can you please include a admin login in the private content area so we can take a closer look at your menu?

    Best regards,
    Mike

    #835048

    I will try to learn to do this now. Question: Can you open the menu items like About and Free Resources?

    #835053

    I’ve downloaded a plugin to provide temporary logins for admin purposes, but I need to enter an email for you. What email do I use? Thanks.

    And here’s a photo of my screen on the iPhone 5
    https://www.dropbox.com/s/mjcn2uoqy20dxf7/menu-screenshot.jpg?dl=0

    #835088

    Hi,
    I see now about your screen size, try this code instead:

    @media only screen and (max-width: 767px) { 
    .main_menu:before {
      content: "\A\A";
      white-space: pre;
    }
    .responsive #header_main {height: 120px !important;}
    .html_header_top.html_header_sticky #top #wrap_all #main {
        margin-top: 40px!important;}
    }

    2017-08-06_130450
    You don’t need a plugin to create a login for us, just post the login & password in the Private Content area so we all can work on the issue.
    2017-08-06_123759

    Best regards,
    Mike

    #835093
    This reply has been marked as private.
    #835125

    Hi,
    In your top menu labels I replaced the # with // and they now work.
    2017-08-06_151247

    Best regards,
    Mike

    #835126

    Ah – great detective work. That’s wonderful for mobile – yes, it works now. But on desktop, if somoene clicks the main header it opens a blank page off my website: about.blank . Which causes other issues and is why I’d been recommended to use the # when I built my site. How can I work around that? I know many use moblile now, but many still use desktop. Thanks.

    #837730

    Hi,

    If you have the time, please edit the js > avia.js file, remove everything then replace it with the following code.

    // https://pastebin.com/qmubdK8n

    Best regards,
    Ismael

    #837830

    Hi Ismael – I’ll need more explanation please as to where and why – I’m not the most techy. Where do I find the js… file and what will this do? Are there any risks when either Word Press or Enfold has another update? etc. Thank you. I’m not sure what you’re asking me to do. Thanks.

    #837843

    Hi,

    This file will be in your theme files, in this location: wp-content/enfold/js/avia.js

    This will not be affected when WordPress updates. When Enfold updates, though, it can be overwritten if you’re not using a child theme.

    A Child Theme sits on top of Enfold so that you can give it your own custom name, thumbnail image in the admin, and safely get into more advanced customization without the risk of a theme update writing over your work.

    So please consider using a child theme.

    You can read about child themes here:

    I hope that helps!

    Best regards,
    Sarah

    #837889

    Thank you Sarah – I now understand the where, but not the what. What will all that code do exactly? Why would it be good for me to input it?

    I’m not using a child theme and will read about it. Thanks. I’ve had my site for a few years without it and don’t know if I’m techy enough to figure it out.

    #839680

    Hi,

    Thank you Sarah – I now understand the where, but not the what. What will all that code do exactly? Why would it be good for me to input it?

    The patches or the new code will going to fix the menu issues. Please edit the js > avia.js file, remove everything then replace it with the new code. Purge or remove the cache before checking the page.

    Best regards,
    Ismael

    #868360

    Topic closed. Thank you.

    #868531

    Hi,

    Alright. Please upgrade to version 4.2 if you have the time.

    Best regards,
    Ismael

Viewing 17 posts - 1 through 17 (of 17 total)
  • The topic ‘Responsive issue: header items on top of each other’ is closed to new replies.