WP Clickable Background – WordPress Plugin

Blog Plugins

Wordpress Plugin in order to make the background of your website clickable.

I built a WordPress plugin that gives the possibility to make the background image clickable, I have worked on this plugin with the idea in mind that a plugin has to be the more possible standard in order to work with any existing WordPress theme, but I realized that making such plugin is virtually impossible as long as any theme has a different design and the background image is not always visible or clickable, most of the time the background image is coved by other HTML elements making the plugin useless. I manage to way around this problem giving the possibility to choose what HTML element trigger in case of click.

Description.

WP Clickable Background is a WordPress plugin that gives the possibility to make a chosen HTML element of your website clickable, you can select what element make clickable by CSS class, you can choose what page you want to open on click, you can select where you want to open the page (in the same page, on a new tab or a new window). You can also add your custom Javascript code on the footer (for instance a google analytics script to track the click).

Settings include:

  • Active/Deactive click
  • Element Class to trigger
  • The page where you want to redirect
  • Where to open the page
  • Custom Javascript section

WP Clickable Background settings

Installation.

Download the plugin on your computer, explode the ZIP file on your plugin folder in your WordPress website. On your WordPress dashboard, go to Plugins => Installed Plugins, search for WP Clickable Background, and activate the Plugin.

DOWNLOAD WP Clickable Background Here

Here is the GITHUB repository of this project

Settings.

The WP Clickable Background setting is on the WordPress dashboard on Settings => WP Clickable Background, please read the note on the top of the page. This plugin works only when the event click is direct on the element with the class specified on-field “Element Class” without any other HTML element on top of it, Please be sure that the chosen element is directly clickable.

3 comments

  1. Many thanks for the article, I have a lot of spray lining knowledge but always learn something new. Keep up the good work and thank you again.

Leave a Reply to Anatomia Cancel reply

You May Like

woocommerce-min-max-checkout-plugin

Woocommerce Min Max Checkout is a plugin that extends your Woocommerce e-commerce in order to give you the possibility to set the minimum or maximum checkout amount or in order to set a minimum or maximum order quantity on the cart or checkout pages. With Woocommerce Min Max Checkout you can also set e customizable […]

February 12, 2022
Read More...

How to add Read More/Read Less button next to a too long HTML element. This tutorial will take you through how to display a certain number of rows of an HTML element and hide the rest of it, then we will see how to read a clickable “Read More” element at the end of the […]

January 15, 2022
Read More...

Today we try to analyze the error that appears on the browser inspector and that is a bit tricky to fix and we try to understand what is causing the error, the error is called “Failed to load resource: net::ERR_BLOCKED_BY_CLIENT“. This error is always followed by an URL, this URL is the link that has […]

May 28, 2021
Read More...