You can create various types of images to insert into your pages. Images can be resized to the dimensions specified and positioned around content.
[hr]Styled Images
Create theme styled images using the styled_image shortcode and optional settings for image dimensions, links, etc. You can also add captions and lightbox effects as needed.
Parameters
- w
- (integer) Image width. Exclude parameter for proportional adjustment based on height setting or set to «0» for original width.
- h
- (integer) Image height. Exclude parameter for proportional adjustment based on width setting or set to «0» for original height.
- image
- (integer/string) ID of the desired media file or URL of the image file.
Special usage: Enter the text ‘featured’ as the image name to automatically insert the assigned feature image for the current page or post.
- align
- (string) (Optional) Image alignment: left, right, center.
- alt
- (string) (Optional) Image description or alternate text.
- caption
- (string) (Optional) Caption text displayed below the image.
- link
- (string) (Optional) URL for the image link.
- lightbox
- (string) (Optional) Open link in a lightbox: Yes, No. If opening the full size version of the image being resized the «link» parameter is not needed.
- rel
- (string) (Optional) Text for link’s «rel» tag. Multiple images with the same rel tag will be connected through the lightbox next/previous buttons.
Examples
Basic styled images.
The images below use the styled image shortcode with lightbox enabled. They are linked together in the lightbox with a matching rel parameter and the lightbox description text is added with the alt parameter.
[styled_image w=»290″ h=»175″ lightbox=»yes» align=»left» rel=»styled-1″ alt=»Styled Image Shortcode Sample 2″ image=»3937″][/code] [clear] [hr]
Plain Image
A basic image resized and output to the specified width and height.
[code][plain_image w=»400″ h=»300″ image=»http://mysite.com/myimage.jpg»][/code] [clear]Parameters
- w
- (integer) Image width. Set to «0» for original width.
- h
- (integer) Image height. Set to «0» for original height.
- image
- (integer/string) ID of the desired media file or URL of the image file.
- align
- (string) (Optional) Image alignment: left, right, center.
- alt
- (string) (Optional) Image description or alternate text.
Example
[plain_image w=»500″ h=»300″ alt=»Plain Image Shortcode Sample» image=»3920″] [clear] [code][plain_image w=»500″ h=»300″ alt=»Plain Image Shortcode Sample» image=»3920″][/code] [hr]Resized Image URL
Returns the full URL to create a resized image at the size specified. This is useful for inserting a resized image path into other shortcodes or widgets.
[code][resized_image_path w=»400″ h=»300″ image=»http://mysite.com/myimage.jpg»][/code] [clear]Parameters
- w
- (integer) Image width. Set to «0» for original width.
- h
- (integer) Image height. Set to «0» for original height.
- image
- (integer/string) ID of the desired media file or URL of the image file.
Samples
[resized_image_path w="400" h="200" image="http://para.llel.us/themes/razor-wp/wp-content/themes/parallelus-razor/assets/images/placeholder.jpg"]
