Sridhar Katakam

Genesis and WordPress Tutorials

You are here: Home / Archives for WordPress

WordPress

Downloadable and Searchable Genesis Code Snippets

by 34 Comments

Update: The snippets are now here: https://genesis.community/wiki/. It has been a little over 8 months since I stepped into the wonderful world of Genesis. The websites that I create now are leaner and visually better. During this period I have stored and constantly refer to a lot of code snippets, primarily from StudioPress website into […]

Hide header until it is needed in WordPress using Headroom.js

by 29 Comments

Want to slide your site’s header out of view when scrolling down and slide it back in when scrolling up? In this article I show how to incorporate Headroom.js in WordPress for non handheld devices. Upload headroom.min.js to your child theme directory/js (create js directory if it’s not present). Upload jQuery.headroom.min.js to the same location […]

Setting a random full-sized background image in WordPress using Backstretch

by 8 Comments

Scott Robbin, the creator of Backstretch shared a snippet for Random Backstretch image on GitHub. Here’s how it can be applied in WordPress: Upload jquery.backstretch.min.js to child theme/js directory. Create a file named say, backstretch-init.js having the following code in the same location. To view the full content, please sign up for the membership. Already […]

Equal height elements in WordPress using jQuery.equalHeights

by 13 Comments

jQuery.equalHeights is a simple jQuery plugin to equalize heights of multiple elements on a page by Matt Banks. In this article I show how jQuery.equalHeights can be used to set equal heights for footer widgets in Genesis teaser entries when using Bill Erickson’s Genesis Grid plugin The method in this tutorial can very well be […]

Parallax animations in Genesis using Stellar.js

by 8 Comments

Stellar.js is a jQuery plugin that provides parallax scrolling effects to any scrolling element. In this article I show how Stellar can be used for Parallax background and Parallax elements for a widgetized section on homepage in Genesis. Step 1 Upload jquery.stellar.min.js to child theme/js directory. Create a file named say, jquery.stellar.init.js having the following […]

>