Give Comments Fields Some Full Width Love

full-width-input-field

Looking at the WordPress comments field input fields in Genesis on mobile leaves you a bit shortchanged…   Give them a full width feeling… @media only screen and (max-width: 860px) { .comment-respond input[type=”email”], .comment-respond input[type=”text”], .comment-respond input[type=”url”] { width: 100%; } } Just change the max-width value to the pixel number that you want the…

Read More

Adding Classes and Attributes to HTML elements in Genesis

Attributes can be added into various HTML markup elements via filters in the Genesis Framework, these attributes can be adding in an ID or additional CSS Class, or amending the Microdata Schema including role, itemscope or itemtype attributes. The HTML markup elements/sections also known as ‘contexts‘ are originally declared as functions in the core Genesis Framework in:…

Read More

Using Slick Responsive Navigation Mobile Menus on Genesis Child Theme

slick-nav-menu-twentytwelve

This guide uses a jQuery mobile responsive menu from Josh Cope and shows how you can use it for a mobile menu in a Genesis Child theme in WordPress. There is also a guide for regular WordPress themes here. Also I have made a plugin which will work  on Genesis and regular WordPress themes. SlickNav mobile menu is supports all modern…

Read More

Adding in a Responsive HTML Logo/Image Header via the Customizer for Genesis

genesis-header-image

This tutorial looks at replacing the CSS background technique used to display a logo/image in the Genesis framework header with an actual HTML markup inline image tag, which is better for responsive design across all devices.  This can be achieved in a couple of ways, one with a filter and one with an action. But first…

Read More

Remove Archive Title on all the Archive Pages in Genesis

Here’s how you can remove all the archive titles that appear at the header of various archive pages in your Genesis Theme, you can either remove all of them or selectively choose which one… Add the code snippet to your functions.php file and all the archive titles will be removed – all these actions are initially…

Read More

Move Header and Footer into Site Inner in Genesis

To move both and header and footer into the Site Inner container of Genesis there needs to be a lot of repositioning going on. The gist below is based off theWordPress Genesis  Sample Theme – I need all four main elements header, content, footer-widgets and footer also to have structural wraps – header, footer-widgets and footer already have…

Read More