Coolest Guides on the Planet

coolest guides on the planet

Coolest Guides On The Planet

  • Home
  • macOS
  • WebDev
  • All Posts
  • Contact

Adding in Header Widget to Genesis Remobile Theme

October 12, 2014 1 Comment

By default the header widget area in Genesis Remobile Theme  is unregistered but can be simply registered back in for use.

This guide looks at rearranging the header area in Remobile to have the header-widget area included back in, and also put the menu on the left and less margin and padding in general. So the desktop version would look like…

genesis-remobile-header with header widget

and smaller size looks like this…

genesis-remobile-header

CSS

/*
Header Right and Title Area
---------------------------------------------------------------------------------------------------- */
#menu-primary-navigation {
	text-align: left;
}

.title-area {
	width: 35%;
	float: left;
	padding: 0 2% 2% 0;
}

.header-widget-area {
	width: 65%;
	float: right;
	min-height: 100px;
	color: #fff;
	padding: 0 0 2% 2%;
}

.responsive-menu-icon {
	float: left;
	margin-left: 1%;
}

.site-header {
	text-align: left;
	padding-bottom: 0;
}

.site-title {
	margin-top: 0;
}

.header-image .site-title {
	margin: 0;
}

.header-image .site-title > a {
	margin: 0;
}

/*
Media Queries
---------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 1200px) {

	.headwrap {
		padding-top: 20px;
	}

}

@media only screen and (max-width: 767px) {

	.header-widget-area{
		width: 100%;
		padding: 2%;
		margin: 0 auto;
		text-align: center;
	}
	
	.title-area {
		width: 100%;
		float: left;
		padding: 2%;
		text-align: center;
	}

}

Add this CSS into your style.css 

PHP

In functions.php look for and delete/comment out the header-right widget area where it is unregistered

//* Unregister the header right widget area
//unregister_sidebar( 'header-right' );

 

//Adjust Header

//Add a wrap around the title and header widget area
function themeprefix_header_wrap () {
	echo '<div class="wrap headwrap">';
}
add_action( 'genesis_header','themeprefix_header_wrap', 5 );

function themeprefix_after_header_wrap () {
	echo '</div>';
}
add_action( 'genesis_after_header','themeprefix_after_header_wrap' );

And also add this into your functions.php  – this alters the HTML mark up around the title and and header widget area.

A div is wrapped around the title and header widget area and given a .wrap class so the content stays in alignment with the content below, it also has a custom .headwrap class  added for other unique CSS styling. The opening div is given a higher priority of 5 so it is added before the title and header-right areas, the closing div is added after the header.

 

Cats: WordPress

Tags

3gs 10.6 apache backup baseband boot clean urls cpanel css curl custom database drupal el capitan git Google image instadmg ios iphone jailbreak keys lion mac macos mojave macos sierra menu mysql OSX panda php phpmyadmin private public redirect redsn0w remote rsa SEO shell ssh terminal unstoppables upgrade urls

Donate a Beer to the Coolest Guides

Get Beaver Builder Now!

Discuss

3gs 10.6 apache backup baseband boot clean urls cpanel css curl custom database drupal el capitan git Google image instadmg ios iphone jailbreak keys lion mac macos mojave macos sierra menu mysql OSX panda php phpmyadmin private public redirect redsn0w remote rsa SEO shell ssh terminal unstoppables upgrade urls
Get DesktopServer

Lynda

Lynda.com Online Training Videos

TreeHouse

smlinks

Learn WordPress
osx-modify-shell-path

How to Add to the Shell Path in macOS Big Sur and Catalina using Terminal

October 19, 2019

virtual-hosts osx 10.10 yosemite

Set up Virtual Hosts on macOS Catalina 10.15 in Apache

October 19, 2019

Installing Homebrew on macOS Catalina 10.15, Package Manager for Linux Apps

October 18, 2019

Where is the bash shell in macos Catalina?

October 12, 2019

Refine your search

  • All
  • Modules
  • Themes
  • Documentation
  • Forums & Issues
  • Groups

RSS ars technica

  • Google hits back after Apple exec says AI is hurting search
  • Apple: “Hundreds of millions to billions” lost without App Store commissions
  • Matter update may finally take the tedium out of setting up your smart home
  • Cue: Apple will add AI search in mobile Safari, challenging Google
  • Apps like Kindle are already taking advantage of court-mandated iOS App Store changes

RSS mac surfer

  • Tot is new text editor for Mac, iPhone, and iPad focused on constraints and ease of use
  • TiPbITS: Google Drive Sorting Can Hide New Documents
  • How to take a screenshot on a MacBook Pro
  • How To Create Simple Animation With Mac Keynote
  • Last Week on My Mac: Virus pandemics

Donate

Copyright © 2025· Neil Gee - All Rights Reserved - Hosted by Runcloud

Copyright © 2025 · gee on Genesis Framework · WordPress · Log in