Shortcodes – Image Boxes

Image boxes are flexible and can be used right in your main content or in a text widget. They can have a title only, content, or a title with content. Here is a demo screenshot of one style:

sc imagebox

Here is another one that is used on the front page of the live demo for this theme and has a button that was added (using shortcode).

sc imagebox2

The available attributes for image boxes are:

  • background – this is the background for your content area
  • colour – this is the colour of your text
  • titlecolour – this is the colour for your heading (title)
  • image – this is the full URL for your image to load
  • alt – as with any image, it’s best to add an ALT tag with a short description for the image
  • link – this is the link (URL) for a button (if you use a button)
  • buttonbg – this is the background colour for your button
  • buttontext – this is the button text (label)
  • buttoncolour – this is the colour for your button label

You do not have to use all the attributes, but you do need the image attribute at least.

Your shortcode for the first image box like the demo:

[sp-imagebox title="Image Box One" image="http://demos.shapedpixels.com/shapedpixels/wp-content/uploads/sites/22/2016/12/imagebox1.jpg"]Fusce vitae aliquam urna. Aliquam sit amet praesent iaculis massa vulputate, vestibulum nec, feugiat purus. Morbi id tempor felis. Proin quis velit tellus. Suspendisse potenti.[/sp-imagebox]

This is your shortcode for the front page demo image box:

[sp-imagebox title="Your Spa Vacation" image="http://demos.shapedpixels.com/shapedpixels/wp-content/uploads/sites/22/2017/01/imagebox1.jpg" alt="imagebox" link="#"]
Fusce vitae aliquam urna. Aliquam sit amet Praesent iaculis massa vulputate, vestibulum nec, feugiat purus. Morbi id tempor felis. Proin quis velit tellus. Suspendisse potenti.[/sp-imagebox]