• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2665

Original Genesis Tutorials & 5000+ Guaranteed Code

Snippets

  • Support
  • Newsletter
  • Videos
  • Log in

Grid Columns

The tutorials in this archive enable you to use PHP code and/or CSS to display posts in columns. The tutorials include methods which use pure CSS, PHP code and PHP combined with CSS. You'll also find more tutorials related to creating grid columns by using the search form on the primary sidebar. The code is guaranteed to work as shown in the demo images and videos. Installation of all code as well as support for PHP code is provided for members.

Display Genesis Featured Page Widgets In Columns Using CSS Grid

The CSS to display featured page widgets and featured posts in grid columns is different. This CSS enables you to display 4 featured

Genesis Featured Page Widget Grid Columns

Add Countdown Timer To Genesis

This code adds a countdown timer to the site header or nav menu in the latest version of the Genesis Sample child theme. Order of Header

Grid Columns

Reorder Widget Areas on Mobile

The solution in this download folder enables you to change the order of the front page widget areas on smaller screens. You can also

Grid Columns Magazine Pro Theme

CSS Grid For Genesis Archives

This CSS enables you to display archive entries in columns without editing any existing code. All you need to do is copy & paste the CSS

Grid Columns

Modify Flexible Widgets To Display Any Number of Widgets In Columns

This tutorial shows you how to modify any widget area in any Genesis child theme which uses flexible widgets. You can use CSS Grid to

Grid Columns Infinity Pro Theme

Template To Display All Posts by Each Category In Genesis

This template lists the archive title for each category and displays all posts assigned to each category under each category header like

Grid Columns

Template For Custom Genesis Grid Loop With Image Hover Overlay

This template displays the featured image with a hover overlay effect. It is coded to display the image caption, if added, otherwise it

Featured Image Grid Columns

Genesis Responsive Menu & Sub Menu Items in Columns

This tutorial provides several solutions which enable you to display both menu items & sub menu items in any number of columns. The code

Grid Columns Nav Menu

Change The Order Of Genesis Responsive Menu Items

This solution enables you to re-order each menu item when the responsive drop down menu is displays at screen widths lower than 960px

Grid Columns Nav Menu

Change Number of Product Columns On WooCommerce Archive Pages In Genesis

The code snippets in this tutorial enable you to change the number of columns WooCommerce products are displayed in for specific archive

Grid Columns WooCommerce

Add Flexible Footer Widgets To Monochrome Pro

This tutorial provides several methods which enable you to add any number of footer widgets to the Monochrome Pro child theme by

Footer Widgets Grid Columns Monochrome Pro Theme

Add 3 Images Inline Below The Header Image In The Title Area

This tutorial provides the code which enables you to add 3 images below your default header image ( logo ) in Genesis like this : On

Grid Columns Header Image Wellness Pro Theme

Custom Genesis Layout Setting Using CSS Grid

This code enables you to add a custom layout setting which uses CSS Grid. You can select the setting under Layout Settings on any single

Grid Columns Layout

Click To Load More Videos In Page Template

This page template for Genesis enables you to add a button which loads more items when clicked. In this cases it loads videos added via a

Custom Fields Grid Columns Video

2 Column Genesis Split Widgets 50% Width

The following solution uses CSS Grid so it won't work in I.E. Based on this question : I have two widgets but I’m still struggling

Grid Columns

Genesis Infinite Scroll With Button To Load More Posts

This tutorial contains a Genesis archive template which displays your posts in a grid and also includes infinite scroll. The code

Grid Columns Infinite Scroll

Genesis Yearly Template To List All Posts For Each Month In a Responsive Grid

This template enables you to lists all posts for each year on 1 page in Genesis. Posts will display under a monthly header so they're easy

Grid Columns

Lifestyle Pro Blog Page Template Like Home

This template displays your posts exactly the same as the front page template in the Lifestyle Pro child theme by StudioPress. Here's the

Blog Page Grid Columns Lifestyle Pro Theme

Genesis Popular Posts In Columns

This tutorial provides the CSS & CSS for Media Queries for 2 different solutions which enable you to display popular posts in

Genesis Featured Posts Grid Columns

Show 1st Widget In Sidebar Before Content On Mobile

This code removes all widgets from the sidebar on mobiles except the first widget which is shown before the content like this : Video

Grid Columns

  • « Go to Previous Page
  • Go to page 1
  • Go to page 2
  • Go to page 3
  • Go to page 4
  • Go to page 5
  • Go to Next Page »

Primary Sidebar

PHP Code

template_include

get_body_class

if else

array

class_exists

foreach

sprintf

add_action

printf

variable

Advertise · WPEngine · Genesis · Log in

  • How Premium Membership Works
  • Sign Up
  • Support
  • Subscription Details/Invoice
  • Tagged Tutorials
  • Access-Download Problems