Here is a guide on how to make an image carousel thumbnail slider with ACF in WordPress using the ACF gallery field. Lightslider, a lightweight image slider seems to fit the bill perfectly – I need it to just display simple thumbnails below the main image which on click/touch show the image in the main slide…

Read More
swap image on button click with jquery

jQuery replace an image on click- example below, this is a method to swap numerous images in HTML by manipulating the images src attribute value from the click of another element such as a button. HTML <div class=”button-container”> <button class=”black-button”></button> <button class=”red-button”></button> <button class=”blue-button”></button> <button class=”yellow-button”></button> </div> <img id=”change-image” src=”/wp-content/uploads/2018/09/black.jpg” alt=”Black Image” /> jQuery jQuery(document).ready(function($){ $(‘.black-button’).on({…

Read More
show-category-image-on-posts

You can add a featured image to a Category Taxonomy in WordPress by using ACF and selecting the categories taxonomy, so now a new image field appears in the category back end page,  the same process can be applied to other taxonomy templates such as custom taxonomies. Create a ACF Image Field for Taxonomy  …

Read More
add-title-attribute-featured-image

The title attribute for the WordPress featured post has been removed for a while, but you can get it back with the wp_get_attachment_image_attributes filter which can add the HTML attribute markup back in, add to your functions.php file…   add_filter( ‘wp_get_attachment_image_attributes’, ‘tl_add_img_title’, 10, 2 ); // Add title attribute to featured image function tl_add_img_title( $attr, $attachment…

Read More
wordpress-media-library-sizes

Keeping your WordPress image media library under control can mean a big difference to your site loading faster as well as your hard disk size footprint with the ability to easily back up or migrate your site. You basically need to remove any unused image sizes and images themselves not used, optimise existing image sizes and ensure future…

Read More
remove-wordpress-default-images

WordPress image sizes contain defaults, small, medium and large as well as medium-large which is used in their implementation of responsive images. You can remove these default images with a WordPress filter intermediate_image_sizes_advanced Why you may want to do this could be that you definitely don’t need certain sizes or you are saving on web disk…

Read More

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 1600 x 1000px. Prepare your images Get your images ready at 1600 x 1000px and…

Read More
slick-slider-featured-images-genesis

You can create a slider of Featured Images from the posts in Genesis by creating a custom loop and using Slick Slider. Setting Up Slick Slider First download and set up the Slick files needed, you’ll need to file these in your theme’s js and css directories: slick.min.js ~> js slick-theme.css ~>css ajax-loader.gif ~>css fonts/ ~>css…

Read More

SVG images are almost 96% supported in browsers but need a bit of backward compatibility for the 4% of stragglers, out of the box WordPress does not support the upload of SVG images via the media loader but you can circumnavigate that by adding the image format to the list of allowed types. There is a…

Read More