This tutorial provides the steps to implement Monochrome Pro’s header search feature in Genesis Sample 2.8.0. The idea is to show a search box covering the entire site header when a magnifying search icon at the right of nav menu is clicked. As with the earlier tutorial for Showcase Pro, we shall use the WooCommerce’s […]
Search Results for: genesis
User Info in the Site Header in Genesis
In Genesis Facebook group a user asks: Hey guys, I’m building a custom theme based on Genesis Sample and want to add a small area to the top of a submenu that will show logged in users name and date they joined the site… any ideas if adding a widget area here is possible? In […]
Split Navigation in Genesis Sample 2.8.0
This members-only tutorial provides the steps to display primary navigation menu at the left, title area in the middle and secondary navigation menu at the right in Genesis Sample 2.8.0. Between 960px and 1399px (inclusive) we shall center the site header elements one below the other. 959px and below, it will appear as usual. Tested […]
How to use SEOPress Breadcrumbs in Genesis
This members-only tutorial provides the steps to replace Genesis’ breadcrumbs with SEOPress Pro’s. We will ensure that breadcrumbs visibility per Genesis theme settings are honored. Tested in Genesis 2.8.1. Step 1 Install and activate SEOPress Pro if you have not already. Note: The free version of SEOPress does not include Breadcrumbs feature. Go to SEO […]
Two-column entry layout on content archives in Genesis
Updated on January 28, 2019 In my Facebook group, a user asked: Hi Sridhar, what’s the best way to do this on the blog page? Column 1: Entry image Column 2: Everything else (entry header, entry content and entry footer) Thank you This members-only tutorial provides the steps to display an image (featured if present, […]
Title Area at left, Header Right widget area at right with Primary Nav below centered in Genesis Sample
This members-only tutorial provides the steps to customize Genesis Sample to arrange title area at left and Header Right widget area at the right in a custom div.header-top with the primary nav appearing below centered. Sample HTML markup Tested in Genesis Sample 2.8. Step 1 Edit Genesis Sample’s functions.php. Let’s remove the code that unregisters […]
How to add a search form in nav menu in Genesis
This tutorial provides the steps to add a search form with a Font Awesome’s SVG search icon submit button as the last nav menu item in Genesis. While the tutorial has been written for Genesis Sample 2.8.0, it should work with a few adjustments in any Genesis theme. Step 1 If you have not already, […]
Home Featured widget in Genesis Sample
This tutorial provides the steps to register a Home Featured widget area display the widget area below the header on the front page modify JS so the top margin (equal to the height of the fixed site header) applies to the widget area on the homepage and to .site-inner on every other page add CSS […]
How to apply Full Width Content Layout to a CPT’s single pages in Genesis
Looking to force Full Width Content layout to all the singular pages of a Custom Post Type in Genesis so there’s no sidebar? Just add the following in child theme’s functions.php: If you are using Genesis Sample 2.6.0, add the following in its style.css:
Customized Woocommerce Product Category Page in Genesis Sample Theme
Hello Sridhar, I’ve been enjoying all of the great tutorials on Genesis. Thank you for the great work over the years! Recently, one of my good friends asked me to create a custom product category archive page that displays products and its custom fields in a list-style layout, similar to this website: www.jcb.com/en-us/products/access-platforms/electric-scissors I run […]
Recent Comments