Circle Image – Add URL instead of opening in lightbox

[daniellemarie]

I’d like the circle images to have hyperlinks instead of opening in a lightbox.

I’ve tried to add the following code to the ’rounded image’ section in the functions-shortcodes.php file but it doesn’t seem to work:

href=”‘.$url.'”

I want to be able to add url=”#” to the short code itself. How can I get this working?

Thanks

[Abe]

Hi, To what shortcode are you referring to?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[daniellemarie]

The rounded image shortcode that currently opens the image in a lightbox when you click on it…

[Abe]

Just remove the data-rel=”prettyPhoto[gallery1]” attribute from the anchor tag

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[daniellemarie]

Okay, I’ve done that, however the image now links to the image source URL.

How do I get it to link to the url that I add to the short code? For example, if I add the following to the short code:

url=”http:”

Thanks

[daniellemarie]

This is my short code:

[kleo_img_rounded src="imageURL" url=hyperlink"]

How do I get it to link to the hyperlink ?

[Abe]

That is just an image, and images can’t link to something unless you put them in an “a” tag

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[daniellemarie]

Okay, so in functions-shortcodes.php you have the code for the rounded images.

I want to be able to set the URL for the image within the wordpress short code, instead of the image linking to the image source. Something like:

[kleo_img_rounded src="#" url="#"]

How can I change the code in the functions-shortcodes.php to allow me to set an URL for each image within the shortcode? Instead of the image opening in a lightbox, I want the image to link to an URL specified when adding the shortcode.

I’ve tried putting the images in an “a” tag, however the heart that appears when hovering over the images sits above the image instead.

How can I achieve this?

Thanks!

[Abe]

this is how it should look like:

COPY CODE

	function kleo_img_rounded( $atts, $content = null ) {
		extract(shortcode_atts(array(
			'src' => '',
			'class' => '',
			'url' => '#'
	    ), $atts));

            $output = '<div class="circle-image '.$class.'">';
            $output .= '  <a href="'.$url.'" class="imagelink" data-rel="prettyPhoto[gallery1]">
                <span class="overlay"></span>
                <span class="read"><i class="icon-'.apply_filters('kleo_img_rounded_icon','heart').'"></i></span>
                <img src="'.$src.'" alt="">
              </a>
            </div>';
            
           return $output;
        }

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[Author]

Posts