Home / Forums / You Theme Support / Header logo + search issue on mobile

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts

  • MikalaMarie
    Participant

    Hello, I am running into two issues I am hoping you can help me with regarding test.corpuzfamilydentistry.com.

    1) Is there a way to disable the logo in the header on mobile? As you can see in the screenshot, it takes up a lot of space and cuts off images. I’d like to just remove it for mobile altogether.

    2) Please see the images below. The search layout isn’t loading correctly both on desktop and mobile. The search results should start loading below the menu, social icons, and “search results for..” header, not running into them. How can we fix?

    Hi @mikalamarie

    1. Do you only want to hide it on mobile phones and not on tablets? If yes, this CSS should take effect for phones as wide as 760px:

    
    @media screen and (max-width: 760px) {
    #logo img{
        display: none;
    }
    }

    iPad on Portrait mode is 768px so the logo will appear on this device.

    2. To fix the layout on the Search Page, use this CSS:

    .main-wrap.skinset-main.acoda-skin{
        margin-top: 220px;
    }

    Paste this CSS into Appearance > Theme Options > Custom CSS.

    Thanks!


    MikalaMarie
    Participant

    Thank you! This partially worked. I am good with #1, but #2 is still unresolved.

    Adding that css to Appearance > Theme Options > Custom CSS does indeed fix the layout of the search page, however it breaks the menu settings elsewhere. Also, the menu settings do not appear on search result pages.

    Please see these examples:

    How Menu Should Look:

    How Menu Looks After Applying CSS:

    Screenshot of how Menu Settings Disappear (blue background, white logo and white menu font) on Search Result Page:

    Is there a way to apply the css only to the search pages and not to the rest of the site? If so, is there a way to keep the same menu settings as the rest of my site on these search pages?

    Thank you!

    Hi @mikalamarie

    Can you please try this CSS instead?

    .search .main-wrap.skinset-main.acoda-skin {
        margin-top: 220px;
    }

    Thanks!


    MikalaMarie
    Participant

    Thank you! That fixed the layout problem. How can I apply my menu settings to the search result page? Right now because my menu is in white text, it is not appearing unless you hover over the buttons. You can view at http://test.corpuzfamilydentistry.com/?s=dental+services.

    Hi @mikalamarie

    The best option would be to add a background on the header for the Search results page.

    Copy this CSS ans paste it in the Custom CSS box in Theme Options:

    .search #header{
        background: #005e96;
    }

    Thanks!


    MikalaMarie
    Participant

    Indeed! Thank you, that did the trick.

    You’re welcome, @mikalamarie

    Please don’t hesitate to contact us if you encounter any issues.

    Regards,

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.