I have a short code in wordpress, below is a part of the shortcode →

[tm_single_image animation="fadeInLeft" classname="sub-banner1" image="http://trafficspinners.com/wp-content/uploads/2016/11/wedding-seating-chart-downloadable2.jpg"]

I want to put a clickable anchor text in this image, Please guide me.

Widget Definition →

/*=============Sub Banner ============ */
function shortcode_subbanner($atts, $content = null)
{
    extract(shortcode_atts(array(
            'image' => '',
            'padding' => '',
            'margin' => '',
            'height' => '',
            'width' => '',
            'class' => '',
            'link_url' => ''    

        ), $atts));

        $variables  = '';
        $output = '';

        if(!empty($image)) :
            $variables .= 'padding:'.$padding.';';
            $variables .= 'margin:'.$margin.';';
        endif;

        $output .= '<div class="sub-container '.$class.'" style="'.$variables.'">';
        $output .= '<div class="inner-image"><a href="'.$link_url.'" target="_Blank"><img src='.$image.' height="'.$height.'" width="'.$width.'"></a></div>'; 
        $output .= '</div>';
        return $output;
}
add_shortcode('subbanner', 'shortcode_subbanner');
  • Please post the relevant code for the shortcode defintion, thanks. – birgire Nov 14 '16 at 19:11
  • Done sir, Please check. – The WP Novice Nov 14 '16 at 19:52
  • You've posted the definition of the [subbanner] shortcode, not [tm_single_image] that you first posted. Note that the subbanner shortcode code snippet is missing attribute escaping and is using extract that's no longer recommended. – birgire Nov 14 '16 at 20:05
up vote 1 down vote accepted

I think you just need to add link_url to the shortcode, like so?

[tm_single_image animation="fadeInLeft" classname="sub-banner1" image="http://trafficspinners.com/wp-content/uploads/2016/11/wedding-seating-chart-downloadable2.jpg" link_url="YOUR-LINK-HERE"]

Unless I am not understanding what you mean by 'clickable anchor text'.

Agree with Michelle. In the code you can see the options available in the widget:

'image' => '',
'padding' => '',
'margin' => '',
'height' => '',
'width' => '',
'class' => '',
'link_url' => '

Adding "link_url" to your widget will add an anchor to the image.

Your Answer

 
discard

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.