In this screencast I take a look at ungrid, a responsive and table-based CSS grid system and show how it can be used to split content into columns in WordPress (Genesis to be specific). Here’s the code you see in the above video:
Free Content
How to Remove Border From Image Links
Scenario: Problem: Solution: to get Source: http://stackoverflow.com/a/17925145/778809
How to limit Posts on Posts page to a specific Category in WordPress
In a comment on Genesis Starter Child Theme, a user asked, Thank you for the changes, they are great! In the Genesis > Theme Settings there is a ‘blog page template’ section that allows you to select to show only posts from a specific category. However, with the changes there is no blog page template […]
Featured images, Attached images and Embedded images
To display featured images of Posts linking to their permalinks my go-to code (inside a function hooked to an action in theme template files like home.php or in functions.php) is where posts-page-thumbnail is the image size handle registered in functions.php via genesis_get_image() and genesis_image() functions fetch/display featured images if present. If featured image is not […]
How to edit Altitude Pro’s style.css to fix the background images’ loading problem
If you have used a full width slider or background video in/for the front page 1 section of Altitude Pro you might have noticed the the backgrounds for other image sections either load incorrectly or partially in Google Chrome. The main reason for this buggy behavior seems to be a combination of z-index and relative […]
How to add support for custom backgrounds in CPTs
If you would like to add support for Custom Background Extended in single entries of a Custom Post Type, say WooCommerce products add the following in your child theme’s functions.php: Back end: Front end: Note: If you are using a theme like Agency Pro which uses Backstretch to display the (same) background image site-wide, you […]
How to add a Full Width Image below Header on Blog page in Dynamik
In the comments section of How to add a Full Width Image below Header on Blog page in Genesis, a user asked: How would you do this in Dynamik? Here’s how. Step 1 At Genesis > Dynamik Custom > Conditionals, add a new is_home() conditional like this: Step 2 At Dynamik Custom > Hook Boxes, […]
Full Content for Features in Grid Loop
When using Bill Erickson’s Genesis Grid plugin if you would like to display the full content for Features (wide posts), add the following in your child theme’s functions.php: Before: After: Related: http://sridharkatakam.com/show-full-post-followed-excerpts-genesis/
How to display a magnifying glass icon in the center of an image on hover using CSS
Want to show a magnifying icon when hovering on an image? In this tutorial I am going to share the code for displaying a Font Awesome magnifying glass icon when a thumbnail image is hovered. We are going to use FooBox plugin to open the full image in a lightbox when the thumbnail image or […]
Circular Color Bullets for List Items using Font Awesome
Please do not follow the tutorial below until further notice. There is currently a problem with the code that’s causing the click region for links inside list items to work erratically. Until I figure out a solution you may want to follow this method. While it is possible to set up color bullets for unordered […]
Recent Comments