The circle image frame shortcode allows you to add a circled image with an optional title to a page.
To add a circle image frame in the Jupiter theme, you’ll need to add/edit a page, and then add the shortcode via Visual Composer. The title, image and all other settings are inside the shortcode pop-up screen.
To see the circle image frame in action, check out the demo page.
Displaying a Circle Image Frame Shortcode
To add the shortcode to a page or post:
Configuring the Settings
There are a few settings in the Circle Image Frame Settings pop-up that you can use to configure the shortcode.
| Setting | Description |
|---|---|
| Heading Title | Sets a title to your circled image. The title will display above the image. This setting is optional. |
| Image Link | Adds a link to your image and makes it clickable. Make sure to add https:// at the beginning of the URL for the image link. |
| Image | Upload your desired image which you wish to display in circled frame. |
| Image Diameter | Sets the diameter of circle containing your image. If this value was set to e.g. 200px, the circled image would have 200px width and height. |
Configuring the Visibility for Devices
To make the button shortcode visible only for some devices such as Smart Phones, Tablets, Mega Tablets, Netbooks, Desktops, there is a setting in the button settings pop-up which is called Visibility For Devices. The usage of this setting is easy and straightforward but if you need a step by step tutorial, read the Configuring the visibility for devices article.
Adding an Entrance Animation
To show the testimonial shortcode on scroll with animation, there is a setting in the Circle Image Frame Settings pop-up which is called Viewport Animation. Using this setting is easy and straightforward but if you need a step-by-step tutorial, read this tutorial.
