Anchor Link Offset to Other Pages with Fixed Header Size

anchor-offset-links

Here is a snippet of code that will link to an anchor link on another page with a fixed offset which allows for a fixed header size, so the link appears further down below the header of further down the…

Use jQuery SlideToggle to Show/Hide Multiple Rows or Divs

slide-show-slidetoggle-jquery

In this tutorial a set of links control the visibility of a number of corresponding divs or rows. It uses jQuery’s slideUp and slideToggle sliding effects. I have used a list as the triggers that will open close the corresponding div/row…

Add Scroll Back to Top of page Functionality in WordPress

How to add a scroll back to top of page in WordPress? – I am sure there are a dime a dozen tutorials and plugins on this subject – here is the solution I went with. jQuery scrollToTop was my choice…

Tab to Accordion Responsive Layouts in WordPress

There is a nice responsive Tabs plugin which is jQuery based called aptly called Responsive-Tabs, it handles changing the layout from a tabbed content structure to an accordion layout at a set media query size. The accordion layout is better…

Create Tabbed Content in WordPress with ACF Repeater and Tabslet

acf-tabs-wordpress-tabslet-repeater

This tutorial walks through how to create a Tabbed content section in WordPress using Advanced Custom Fields and Tabslet. ACF (Advanced Custom Fields) Pro comes with an addon called the Repeater field which allows a user to perpetually add additional rows of data of certain…

Creating a FAQ Page in WordPress using ACF and jQuery

How to create a FAQ page in WordPress using Advanced Custom Fields and jQuery. ACF (Advanced Custom Fields) Pro comes with a great inclusion called the Repeater field which allows a user to continually add additional rows of data of certain custom fields to…

Coding a User Friendly Carousel Slider in WordPress

carousel-easy-slider-wordpress

This tutorial uses Slick and Advanced Custom Fields Pro to code a user friendly carousel slider in WordPress. It uses the gallery field from which a user can easily add or change order of slides without having to touch the code. The…

Add Multiple Site Background Images To Genesis Agency Pro Theme

You can add a multiple images as alternating site background images in the Genesis Agency Pro theme by tweaking the backstretch jQuery plugin that comes with the theme. Out of the box Agency Pro uses one master site background image as set in the Customizer, preferably at…

Create Equal Heights for Text Columns in a Row

To create equal heights for text columns in a row depending on data entered can be a CSS challenge, instead of futzing with CSS and height rules at different media queries there is a nice jQuery solution that automagically solves the…

Create a Masonry Layout on the Home/Blog Page in WordPress

WordPress already comes with Masonry either as pure Javascript or a jQuery plugin, here is how you can style a home blog page in a Masonry format with 3 columns. Enqueue the built in WordPress jQuery Masonry script and create…