Linking Post (Wordpress) to a Clickable Featured Image

niceties55

Daemon Poster
Messages
787
Hello! I am new to Wordpress and I have just inherited a Wordpress website that I have figured out most of the things on it except for the rotating banner at the top.

The banner is the featured image of a post. My question is, how do I make the featured image clickable so that when a customer clicks on the banner (post's featured image) it opens up the blog post.

The website is: Randee's Music - Premier music store featuring the finest guitars and pianos. Buy used, new, and vintage musical instruments from a trusted source. We offer factory qualified repairs and private lesson programs.
You can see the banner at the top.
Wordpress is fully updates, as well as all the plugins. We use Woocommerce.

Thanks!
 
It depends on your page builder if you have on and the slider you are usung some slider plugins allow for it and some dont. Some allow you to place text on the slide , so i would place a hyperlink ontop of image in text and then with the css make its opacity 0 . this is the ugly way of doing it. Preferentially you would go into the sliders php templates and allow for linking there however this is impossible to tell you how unless you can tell me which slider i can have a look at its php for you ,
 
You'll need to edit the code in your theme files. Here's a general guide:

  1. Access the Theme Editor: In your WordPress dashboard, navigate to Appearance > Theme Editor.
  2. Edit the Template File: Locate the template file that contols the display of your banner or featured image. This could be single.php, content.php, or a custom template file.
  3. Insert Link Code: Find the code that displays the featured image and wrap it with an <a> HTML tag to create a link.

    Here's an example:

Code:
<a href="<?php the_permalink(); ?>">
    <?php the_post_thumbnail(); ?>
</a>

  1. This code uses the_permalink() to get the link to the post and the_post_thumbnail() to display the featured image. When the image is clicked, it wil take users to the respective blog post.
  2. Save Changes: After making the necessary changes, click on "Update File" to save your edits.
 
Back
Top Bottom