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%;…

Removing The Default Genesis Responsive Mobile Menu

This guide looks at removing the Genesis responsive built in mobile menu, well,  not just removing it but making it more modular to either use or not This is based on using the sample theme and with a simple code comment/uncomment…

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…

Up and running with Sidr Off Canvas Menu for WordPress

Sidr is a very popular jQuery off canvas menu that can slide content from the left or right into the viewport which is a great solution for mobile or tablet display. Here’s how to get it up and running in…

How to Make Images Scale for Responsive Web Design

scale-image-responsively

So you have got your web layout flexing and changing layout in a fluid or responsive web layout – but the images are not quite working they are being stubborn and not scaling and moving around like the text! The…

Responsively Removing Width and Height Attributes on Images and wp-caption on WordPress

If you are looking to go responsive for images on your site and want a theme that responds to various devices such as tablets and mobiles there are a couple of issues to sort out with existing hard coded images that…