Documentation:UBC Content Management System/Shortcodes/image with src

From UBC Wiki

Intro

As of WordPress 4.2.3, the shortcodes API changed meaning that nested shortcodes (i.e. loop, tabs, accordion) could not contain shortcodes within html attributes. That means that code such as the following, no longer produced the expected result; 

[loop query="posts_per_page=5"]
<img src="[the_post_thumbnail_src size=thumbnail]" alt="Thumb" />
[/loop]

The nested [the_post_thumbnail_src] shortcode does not get parsed. It is simply are left as an empty string and as such, you get a broken image tag.

WordPress made this change for security reasons and sadly, this was a breaking change.

[image_with_src]

[image_with_src] is equivalent to <img src="[the_post_thumbnail_src]" alt="" />

[image_with_src with_permalink="1"] is equivalent to <a href="[the_permalink] title="[the_title]"><img src="[the_post_thumbnail_src]" alt="" /></a>

Paramaters

  • link - defaults to an empty string. If you wish to link the image somewhere. If you specify with_permalink AND link, with_permalink takes precedence
  • link_title - defaults to the current post's title, i.e. get_the_title() in the loop
  • with_permalink - defaults to an empty string - if you specify any value here, i.e. with_permalink="yes" or with_permalink="1" this will wrap the image in the current post's permalink
  • link_class - defaults to an empty string. The class applied to the anchor tag surrounding the image should you use one
  • link_target - defaults to _self. The target attribute of the link should you use one. i.e. to open a new tab when someone clicks the image use link_target="_blank"
  • link_is_cf - Use the value of the defined custom field as link URL and will override link attributes.
  • img_url - defaults to the current post's thumbnail url. (Note: img_size or img_url_is_cf has priority over this attribute)
  • img_url_is_cf - Use the value of the defined custom field as image src URL and will override img_url and img_size attributes.
  • img_class - defaults to an empty string. The class attribute of the image tage. (Note: if img_class_is_cf is declared, this attribute will be overridden)
  • img_class_is_cf - Use the value of the defined custom field as image class and will override img_class attribute.
  • img_alt - defaults to an empty string. the alt text for the image. (Note: if img_alt_is_cf is declared, this attribute will be overridden)
  • img_alt_is_cf - Use the value of the defined custom field as image alt value and will override img_alt attribute.
  • img_before - defaults to an empty string. Any markup to output before the image tag
  • img_after - defaults to an empty string. Any markup to output after the image tag
  • img_size - support of post_thumbnail size (thumbnail, medium, large, full), will override img_url with post featured image. (Note: If img_url_is_cf is declared, this value will not be used)

Examples

[loop query="posts_per_page=5"]
[image_with_src]
[/loop]

[loop query="posts_per_page=5"]
[image_with_src link_title="Click to view image" with_permalink="1" link_class="class-1 class-2" link_target="_blank" img_class="class-3 class-4" img_alt="Image of a thing doing something" img_before="Before image" img_after="After image" img_size="full"]
[/loop]

See Also

Other shortcodes were affected with the 4.2.3 upgrade. Please see the following;

Retrieved from "https://wiki.ubc.ca/index.php?title=Documentation:UBC_Content_Management_System/Shortcodes/image_with_src&oldid=386623"