In the members-only forum, a user asked: I added a span to widget titles so that the span can sit on top of a background (similar to the old Metro theme). The archive titles need the same styling, but I can’t see a way to do it with CSS without also adding a span…Actually, it […]
jQuery
Using PowerTip to display mouse-following tooltips for Font Awesome Icons in WordPress
In the members-only forum, a user asks: What must be done to use the jQuery PowerTip on some Font Awesome Icons in Textwidgets in your Genesis Sample? Something like this on a text link in a widget. In this tutorial I show how tooltip text can be set up for social media icons in a […]
Posts Grid on Archives in Genesis
In this article I show how Posts can be displayed in columns on archives and Posts page in Genesis. For each entry, published date will appear at the top left . Categories and Tags (if present) will appear near the bottom when the featured image is hovered. We shall use matchHeight jQuery to make all […]
How to split list items into columns using Columnizer jQuery plugin
A user asked, Have you done any tutorials on how to use a custom menu in a widget and make it appear on the page in 3 columns using the column classes? I searched, but nothing is coming up. I considered using the uber menu plugin, but that seems heavy for what I am trying […]
End of page Slide Out Box in Genesis using jQuery
In this tutorial I show how we can slide out the contents of a widget area when visitors scroll to the bottom of pages in Genesis. In this example we are going to show Genesis eNews Extended plugin’s widget in the slide out box. The box will slide back off the screen when the visitor […]
How to make Primary navigation in Genesis sticky on scroll for desktops and mobile responsive on handhelds
In this tutorial I share the code for setting up a sticky Primary navigation below as users scroll past it. We are going to use Sticky-Kit jQuery script to make the nav fixed on non-handhelds and use code from Beautiful Pro for the hamburger menu. Set up: Genesis Sample is the active theme with menus […]
Horizontal Constant Contact Opt-in Form with Input Placeholders
This tutorial provides details of setting up a horizontal Constant Contact opt-in form in WordPress with custom input placeholders via jQuery. Sallie has a good tutorial on Genesis eNews Extended plugin with Constant Contact here. I gave it a try first only to find out that when the Submit button is clicked after a user […]
Video Background in WordPress using BigVideo.js
In this tutorial I show how BigVideo.js, a jQuery plugin that uses Video.js for background video can be set up in WordPress. Live Demo In handhelds devices like tablets and mobiles, a poster image (screenshot of one of the video frames, usually the first one) is going to be set to appear in place of […]
Displaying Custom Post Type entries as a Slider using Slick in Genesis
On a site that I am currently working on, the client asked Sridhar, I want a slider that looks like Soliloquy but not using Soliloquy. My users need a simple Posts like editing interface where they can specify the title, caption text and upload the image for each slide. Is this possible? And the answer […]
Using ScrollToFixed for a sticky bottom widget in Genesis
In the past I wrote how a fixed bottom section can be added in Genesis here. In this article I show how ScrollToFixed jQuery script can be used to make an element fixed on page load but becomes unstuck or static as it is scrolled to and scrolls up with the rest of the page. […]
Recent Comments