Highlight your image content with clickable link

You can make your image content clickable without having any coding skills ๐Ÿ™‚

I was working for a client and there were lots of modification on the landing page. One day he sent me an image and said he wants to show the image on the home page. He wants his user to click on each block of the image and then they will be redirected after clicking on the selected block. That means he wanted to cut the images into pieces and attach a link to each piece.

Easy work for a developer but if it is in the middle of the running project then it’s not good. I was thinking that How can I add this into the template which already created. I though I have to create a new template again for the home page with the image.

Today I believe that research can make your work easier. That day I have searched the web to find out a good solution and found one.

What did I get?ย 

After searching for a couple of hours I got a very helpful and money maker pluginย Draw Attention. This plugin did the job for me. You can easily highlit your image content with URL for your website. It saves time and money.

Responsive Design

Interactive images resize to fit your theme and the available screen size

 

Accessible

Image info is accessible to everyone who visits your site, regardless of device or capabilities.

Progressively Enhanced

Your content is accessible even to users who have JavaScript disabled – SEO friendly too! Draw Attention uses canvas elements in modern browsers and falls back to image maps in older browsers.

Customizable Colors

Choose your own custom color scheme to match your site

Highlight on Hover

Highlight different areas of your image when your site visitor moves their mouse over the interactive image

Easy to Draw

Easy to draw the highlightable areas of your image – and easy to edit the shapes later too!


More Info on Click

When a highlighted area is clicked, show more information.

Go to a URL

Optionally send a site visitor to another URL when clicking a highlightable area of the image map.

 

Installation

Using The WordPress Dashboard

  1. Navigate to the ‘Add New’ in the plugins dashboard
  2. Search for ‘draw attention’
  3. Click ‘Install Now’
  4. Activate the plugin on the Plugin dashboard

Uploading in WordPress Dashboard

  1. Navigate to the ‘Add New’ in the plugins dashboard
  2. Navigate to the ‘Upload’ area
  3. Select draw-attention.zip from your computer
  4. Click ‘Install Now’
  5. Activate the plugin in the Plugin dashboard

 

Leave a Reply

%d bloggers like this: