StudioPress

Forum navigation

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Mobil hamburger menu, logo, and search icon on same row

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Community Forums › Forums › Archived Forums › Design Tips and Tricks › Mobil hamburger menu, logo, and search icon on same row

This topic is: resolved
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • May 23, 2015 at 7:30 am #153399
    nhed
    Member

    Hi,

    I am using Altitude Pro theme and need to reduce the size of the logo in mobile view so the header takes up less room and the hamburger menu and the search icon are on the same row as the logo. Here's a link to an image of the current setup and right below it is my rendering of what I need it to look like.

    Top is current header and logo and below is what I am looking to do.

    Any ideas or help on this would be appreciated.

    Thanks soooooo much!!

    All the best,

    Ed

    http://join-ed.com/newlywed-died-of-sepsis-after-flu-shot/
    May 25, 2015 at 9:47 am #153561
    SavvyJackie
    Member

    Hi,
    This would be done by adding/modifying your style.css for those mobile viewport widths in the @media queries. Since the menu and search icons will expand when you touch the icons, you'll need to take that into account when formatting it.

    Web Designer and Developer at Savvy Jackie Designs | Lucky with plants | @SavvyJackie

    Got your question answered here? Please pay it forward by helping someone else. I’m sure there is at least one question you can answer. 🙂

    May 25, 2015 at 1:54 pm #153578
    nhed
    Member

    Hi SavvyJackie. Thanks for the info. Sounds complicated. What would I need to do to add a search icon with its entry field next to where the hamburger menu. Here's a rendering of the idea:

    new idea

    Any ideas? I'm not so good with code, so pointing me in the right direction would be helpful.

    Thanks a lot.

    Ed

    May 28, 2015 at 1:57 pm #154010
    nhed
    Member

    Can someone point me in the right direction to find out how to move items around in the nave bar area. I just don't have a clue at the moment. Thanks for the help. I do appreciate it.

    May 29, 2015 at 5:54 am #154078
    SavvyJackie
    Member

    Hi Ed,
    I have not seen any code or tutorials on how to accomplish that specifically. I do agree it is more of an advanced customization. If you are not comfortable working with CSS layouts yet, it might be a something to talk with a designer about.

    Web Designer and Developer at Savvy Jackie Designs | Lucky with plants | @SavvyJackie

    Got your question answered here? Please pay it forward by helping someone else. I’m sure there is at least one question you can answer. 🙂

    July 24, 2015 at 2:11 pm #160342
    nhed
    Member

    OK. Thank you Jackie. I appreciate the help. All the best, Ed

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Mobil hamburger menu, logo, and search icon on same row’ is closed to new replies.