• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

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

Adding the Monochrome header to Magazine Pro

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.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › Adding the Monochrome header to Magazine Pro

This topic is: not resolved

Tagged: header right widget, Magazine Pro, widget_nav_menu

  • This topic has 9 replies, 4 voices, and was last updated 8 years, 5 months ago by Brad Dalton.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • December 5, 2017 at 7:16 pm #214296
    mios
    Member

    I want to take the header from the monochrome theme basically paste it over the magazine theme header. How would I go about this? Is it as simple as finding all of the instances of header in the css and function and switching the old code with the new code? Or is there more to do. Thank you in advance!

    March 9, 2018 at 1:09 pm #217615
    Christoph
    Member

    Hi,

    Sorry, that your post didn't receive a response sooner.
    The posts on this forum are mostly answered by volunteers and sometimes questions get pushed out-of-view.

    Sounds like a good start. I'd also check if you have to reposition the navigation menus / add styles for the menus and if you need to adjust any of the JavaScript.


    https://www.christophherr.com | Genesis Customizations | Buy me a coffee

    May 23, 2018 at 3:05 pm #220199
    pluzito
    Participant

    Magazine Pro needs a revamp of the header asap to still be a good option! In the mobile view the header and menus uses more than 30% of the screen. Would be perfect if it could be all simplified in one raw (logo+menu+search option).

    May 23, 2018 at 3:53 pm #220202
    Brad Dalton
    Participant

    You mean logo, menu and search form inline?


    Tutorials for StudioPress Themes.

    May 26, 2018 at 6:44 am #220242
    pluzito
    Participant

    Yes Brad. It would be a dream! Magazine is one of my favorite themes, but it’s mobile version looks a little old. Having a single inline bar with “hamburguer icon for the menu” + logo of the website + search form would be perfect. Like the studiopress theme, that has menu and logo in the same tiny bar, letting the screen of the devices showing a lot more content without scrolling. Still i can’t manage to do that, my site is Sneakerhead.com.ar hope you like it!

    May 26, 2018 at 1:10 pm #220246
    Brad Dalton
    Participant

    You can add the navigation menu and search widgets to the header right widget area and use CSS to display them inline with the logo or site title.

    This is 1 method i tested which should get you started :

    .site-header .widget_nav_menu {
    	float: left;
    }
    

    You could also use CSS Grid. https://www.w3schools.com/css/css_grid.asp


    Tutorials for StudioPress Themes.

    May 27, 2018 at 6:22 pm #220276
    pluzito
    Participant

    Brad thanks for your help. I already got the nav bar with the search form working. The issue comes in the mobile version of the site (Sneakerhead.com.ar).

    The goal is to have in the desktop version: the logo of the site inline with the fixed nav bar and the search form (the only part missing here right now is the logo fixed on the blue nav bar).

    In the mobile version: a fixed nav bar with the hamburguer icon for the menu + the logo of the site + the magnifier icon for the search form. Something like this

    May 27, 2018 at 8:25 pm #220279
    Brad Dalton
    Participant

    I assume you want the right version? If so, i would experiment using CSS Grid.

    There would be other methods.


    Tutorials for StudioPress Themes.

    May 29, 2018 at 6:42 am #220344
    pluzito
    Participant

    Brad, can you suggest me someone to hire to do this work? I see a couple of links related in the community section. I love Genesis but I think the magazine style themes are a little bit forgotten here :/ Thanks in advance and thanks for all your help.

    May 29, 2018 at 2:20 pm #220354
    Brad Dalton
    Participant

    Sure, please contact me and i'll provide a referral.


    Tutorials for StudioPress Themes.

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2026 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble