$atts = shortcode_atts( array(
'path' => 'https://s.w.org/about/images/logos/wordpress-logo-simplified-rgb.png'
), $atts);
The above is a part of the shortcode. In WordPress text editor this shortcode is produced like this →
[theimg path=""]
the inverted comma needs to have the image URL of this →
[theimg path=”https://geordiebiker.files.wordpress.com/2011/10/audrey-marnay-longchamp-commando-drive-side.jpg”]
Problem:
when we are in the visual mode of the text editor and we put an image URL in those commas it actually pulls the image, not URL. I have done a gif to explain this.
I believe that this missing sanitization such as esc_url etc, but I do not know the exact fix.
Update:
if I put only the URL in the shortcode, the editor adds the <img src="">
tags?
P.S.→ the image can’t be uploaded here as it was above 2MB.
Update 11 Jan 2018
$output="<div class="someclasss">";
$output .= '<img class="someclass1" src="'.$atts['simg'].'" alt="' .$caption. '" >';
$output .= '<i class="fa fa-expand" aria-hidden="true"></i>';
$output .= '</div>';
return $output;
The above way the output is rendered in the browser.
Finally, in the browser, it will appear like this:
<img src="<img src="https://www.qygjxz.com/data/out/84/6074239-free-image.jpg" />">
Is there a way we can ensure that in the src="'.$atts['path'].'"
this part:
.$atts['simg'].
only takes URL and strips out everything?