Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Need an image from url shortcode WordPress

  • SOLVED

I need a shortcode that allows me to pull in an image from a certain url.

I already know that code such as this:



function og_img($atts, $content = null) {
extract(shortcode_atts(array("src" => ''), $atts));
return '<img src="' . $src . '" alt="'. do_shortcode($content) .'" />';
}
add_shortcode('img', 'og_img');


Will let me do a shortcode like this:

[img src="https://outergain.com/images/whatever.jpg"] this is alt text [/img]

But I don't want it that way. I want to specify only the short code on the page. So something like this:

[og_image]

Would place the entire <img src="..." alt="..."> line in there.

Hopefully that makes sense.

Answers (7)

2018-12-03

Arnav Joy answers:

URL means, a page which has image?

2018-12-03

Cesar Contreras answers:

What will be the source of your image, where will it be taken, will it be taken from the highlighted image of the post or page?

2018-12-03

Dario Ferrer answers:

Hello. Let's suppose this is you image URL:

http://www.my-website.com/wp-content/themes/my-themes/images/image.jpg

And you only want the shortcode [og_image] to show that image.

Copy the following code in your theme's funtions.php file. Be sure to point right the image URL (into the variable $path):


add_shortcode( 'og_image' , 'the_og_img' );

function the_og_img() {
$imgurl = trailingslashit( get_stylesheet_directory_uri() ) . 'images/image.jpg';
return '<img src="'. $imgurl .'" alt="Image" />';
}


$path also can be a static url. When you update the URL, be sure to check the wrapper quotes, like this:


$path = 'http://www.my-website.com/wp-content/themes/my-themes/images/image.jpg';


Kyler Boudreau comments:

Thanks! This is what worked based on your answer:

add_shortcode( 'og_image' , 'the_og_img' );

function the_og_img() {
$imgurl = 'http://www.my-website.com/wp-content/themes/my-themes/images/image.jpg';
return '<img src="'. $imgurl .'" alt="Image" />';
}


Dario Ferrer comments:

Excellent Mr. Kyler, you're welcome. Glad to help. If you have an issue just let me know.


Cesar Contreras comments:

Good. You wanted to show a static image.
Tip: You can omit the variable and enter the url directly in the "SRC"

return '<img src="http://www.my-website.com/wp-content/themes/my-themes/images/image.jpg" alt="Image" />';

it will not affect the operation at all, simply because it is a line of code less and because it is not necessary to use variables.


Dario Ferrer comments:

Hi Cesar:

1) Thinking that "is a line of code less" is better for programming, is not a good practice. That's a WordPress image URL, maybe Kyler will find better ways soon for print it.

2) Also the variable is for comfort, especially if the URL needs to be written in a dynamic way, so for him it's better to do this...


$imgurl = 'http://www.my-website.com/wp-content/themes/my-themes/images/image.jpg';

// Then...

return '<img src="'. $imgurl .'" alt="Image" />';


... than this


return '<img src="'. trailingslashit( get_stylesheet_directory_uri() ) .'images/image.jpg" alt="Image" />';

// or...

return '<img src="http://www.my-website.com/wp-content/themes/my-themes/images/image.jpg" alt="Image" />';


Shrinking the long version of code is a good practice.

2018-12-04

Fahid Javid answers:

So "Kyler Boudreau" the question is solved? Or let us know if you still need an improvement in it?


Kyler Boudreau comments:

yes it was solved - I marked the 3 stars by the winner. is there something else i need to do?

2018-12-03

Rempty answers:

Hello
But what image is going to show if your shortcode don't have a url parameter?

If the url will not change you can use
function og_image_func( $atts ){
return '<img src="here_the_src" alt="here_the_alt" >';
}
add_shortcode( 'og_image', 'og_image_func' );

2018-12-03

isp_charlie answers:

you can use featured image for this:


function og_img($atts, $content = null) {
extract(shortcode_atts(array("src" => '','featured'='no'), $atts));
$image = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), 'single-post-thumbnail' );
if(featured=='yes'){
$src = $image[0];
}
return '<img src="' . $src . '" alt="'. do_shortcode($content) .'" />';
}

add_shortcode('img', 'og_img');

// use:
[og_image featured='yes' ] or [og_image src ='url_custom_image' ]

2018-12-03

Echeverri answers:

Congratulations, excellent solution, other option is:
return '<img src="'. trailingslashit( get_stylesheet_directory_uri() ) .'images/image.jpg" alt="Image" />';

// or...

return '<img src="http://www.my-website.com/wp-content/themes/my-themes/images/image.jpg" alt="Image" />';