Sets the angle of the gradient functionality. Available options are: Linear and Radial. This option will be available if you set the Background Color Style option to Gradient Color. Sets the style of the gradient functionality. Sets the ending point color of the gradient spectrum.
![jupiter custom image to iconbox jupiter custom image to iconbox](http://www.uncleodiescollectibles.com/img_lib/Jupiter-2%20Diorama%2034%2010%209-4-10.jpg)
Sets the starting point color of the gradient spectrum. This option will be available if you set the Background Color Style option to Image or Single Color. Sets the background color of the custom box. Available options are: Image, Single Color, and Gradient Color. Sets the background color style of the custom box. You can read the Adding custom CSS class to a shortcode article for further explanation.Ī separate tab is present in the custom box settings window to configure the styling – Styles and Colors. It’s useful when you need to target the shortcode in a style sheet or JavaScript file. The Extra Class Name field in the setting pop-up allows you to add an extra class name to the shortcode. You can read the Configuring a shortcode’s entrance animation article for further explanation. The Viewport Animation field in the settings pop-up allows you to hide the shortcode initially and make it visible with animation when you scroll in the browser. You can read the Configuring the visibility for devices article for further explanation. The Visibility For Devices field in the settings pop-up allows you to configure the visibility of the shortcode in different devices. Sets the amount of space between the bottom of your custom box and the next shortcode. SettingĪdds spacing on the top and bottom of the box.Īdds spacing on the left and right of the box. There are several settings in the custom box Settings pop-up that allow you to set the margin and padding values.
#Jupiter custom image to iconbox update
You can read the Adding custom CSS class to a shortcode article for further explanation.6 Click on Save Changes and publish or update the page to check the result.Īfter you’ve added the custom box shortcode, click on the pencil icon and a modal window will appear with the options. The usage of this setting is easy and straightforward but if you need a step by step tutorial, read the Configuring shortcode’s entrance animation article. To make the Icon Box shortcode visible on scroll with animation, there is a setting in Icon Box settings pop-up which is called Viewport Animation. To hide/show the Icon Box for a particular device (mobile, tablet, …), there is a setting in Icon Box 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 shortcode’s visibility article. Sets the color of any probable links you may add in description section.Īdds a spacing between this Icon Box and the next shortcode. Sets the paragraph color of Icon Box description. If you don’t want the container have a border, please set this option to blank. Use this option to set the icon container border color. This option will be available if you enable the Circle Container option. Use this option to set the icon container background color. This option will only work for icon size of Small and Medium. Available options are: Small, Medium, Large, X LargeĮnable this option if you want your icon to be contained by a circle frame. Available options are: Simple minimal, Simple Ultimate, Boxed. Use this option to set the style of Icon Box shortcode. To style your icon box you’ll find these settings in the icon box pop-up window: Setting You need to add at the beginning of the URL.
![jupiter custom image to iconbox jupiter custom image to iconbox](https://d34b8fs2z18t5a.cloudfront.net/wp-content/uploads/2017/02/custom-box-shortcode-front-end.png)
If you don’t want to have read more option, simply set this option to blank.Īdds Read More link to the Icon Box. The default WordPress editor will be available for you in this option, in case you want to fine tune the styling of description.Īdds a read more text for Icon Box. Sets the font weight of the Icon Box TitleĪdds a description for the Icon Box. Sets the font size of the Icon Box title.
![jupiter custom image to iconbox jupiter custom image to iconbox](https://i.pinimg.com/originals/83/d6/23/83d623df6126da62e7e3894afb6e8a22.jpg)
There are some general settings in icon box settings pop-up. 5 Click on Save Changes and publish or update the page to check the result.