Home - Widgets - Fancy Icon Box

Fancy Icon Box

Preview Widget
Preview Widget
Getting Started
Content
Icon & Text Styling
Container Design
Tilt Hover

More Widgets

• Hover Info Box
• Modern Flip Box
• Icon Box Action
• Interactive Icon Box

# Getting started

The fancy icon box is a widget that allows you to display information about your website or business services in very fancy way with an image, a title and text, and a tilting hover effect.Multiple modern effects and layouts can be used.

You can find the options available down below.

Content

The content section is going to be used to define the fancy icon box text and its positioning.

  • Icon : Apply an icon from our extensive icon libraries..
  • Heading :  A title text that gives a global insight about the information or service you are showcasing.
  • Short text : A description text that gives more information about what you want to showcase.
  • Vertical & Horizontal Alignement : Control the content horizontal and vertical positioning.
  • Link : Specify a go to link on click.You can click on the link options button(The cog wheel on the right) to enable the 'open in new window' and the 'no follow' options.

Styling

Under the styling tab section, you will have the full control over the styling & design of all the fancy icon box widget elements, you can change the sizes, colors, backgrounds...

  • Text Content Styling

Customize the text properties for : the heading & short text.You can change the font size, letter spacing... choose from hundreds of Google font families.

-Colors : Customize the color of your text elements to create your own design.

-Distances : control the margins & distances between each element.

  • Icon Styling

Control the icon size and margins, and change the color scheme.

-Gradient Colors : You can apply a solid single color, or a gradient color with custom directions.

 

Container Design

Under the styling tab, you will find the container styling section, there, you can change everything about the design of the container.

  • Container Styling

-Container Size : Control the height of your widget & apply custom padding.

-Background : Customize the background & choose between using a background image or applying either a solid background color, or gradient color with the possibility to control the direction of the gradient.

-Remove Overlay On Hover : Enable this if you want the overlay to disappear when the user hovers over the widget.This can be used to create a dynamic hover effect for a great visual result.

-Borders & Shadows :
Control the border and customize its width and color, and apply a custom box shadow.Note that these options can also be alternated for the hover status of the widget.

Tilt Hover

The last section under the styling tab is the Tilt Hover section.This will be used to change the behavior of all the effects available in the fancy icon box widget.

  • Tilt Hover

-Enable 3D Hover : Enable/disable the 3D hover effect.We strongly recommend enabling this option as its a great visual aspect of this widget but we know that in some cases simplicity can be key.

-: Control the mouvement sensitivity in conjunction with the hover effect.Changing this value will affect the behavior and speed of the 3D effect.

-Enable Glare : Enabling  this add extra brightness to create a glaring effect and give the widget a different visual touch.This effect is better used with a background image as it doesn't make as much of a difference when used on a color painted background.

- : Control the value for the glare effect.The higher this value is, the more intense effect.

-Enable Reset : Disable this if you don't want the effect to reset to its initial position after hovering over the widget.Essentially this means that the widget will stay in the same position after the hover action is over.

Get Help From Professionals

Can't find what you are looking for?

If you can't find what you are looking for any our documentation website, please feel free to open a support ticket  & get help from our support team.

Open a Ticket
Open a Ticket

WHO ARE WE ?

We are a group of talented WordPress developers & designers from Morocco our main goal is to create great products & provide the best services to our customers.

BOOSTER ADDONS

CREATIVE ELEMENTOR BUNDLE

FOLLOW US

Email : contact@certaindev.com

WebSite : Certain Dev

Made with love from Earth!

Certain Dev | all rights reserved © 2020