Alert Message Shortcode
Avada includes an alert message shortcode that you can use throughout the site. These are perfect for displaying important information, alerts or messages to your viewers. The options we include allow you to animate the box when it shows in the viewport, use font awesome icons, customize the colors, accent colors, border sizes and more. Many options to fit every situation.
[fusion_alert type=”general” accent_color=”” background_color=”” border_size=”1px” icon=”fa-star” box_shadow=”yes” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ class=”” id=””]Message Box Shortcodes[/fusion_alert]
Choose From 4 [fusion_popover title=”Unleash The Power of Avada” title_bg_color=”” content=”Create beautiful, eye catching layouts with all the various elements Avada provides, like this nice little popover.” content_bg_color=”” bordercolor=”” textcolor=”” trigger=”hover” placement=”top” class=”” id=””]Message[/fusion_popover] Types Or Build Your Own!
[fusion_alert type=”custom” accent_color=”#848484″ background_color=”rgba(255,255,255,.25)” border_size=”1px” icon=”fa-info” box_shadow=”yes” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ class=”” id=””]Message Box Shortcodes[/fusion_alert][fusion_alert type=”error” accent_color=”” background_color=”” border_size=”1px” icon=”” box_shadow=”yes” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ class=”” id=””]Message Box Shortcodes[/fusion_alert]
[fusion_alert type=”success” accent_color=”” background_color=”” border_size=”1px” icon=”fa-star” box_shadow=”yes” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ class=”” id=””]Message Box Shortcodes[/fusion_alert][fusion_alert type=”notice” accent_color=”” background_color=”” border_size=”1px” icon=”fa-star” box_shadow=”yes” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ class=”” id=””]Message Box Shortcodes[/fusion_alert]
Color Control
Control the background color and accent color (text / icon / border)
[fusion_alert type=”custom” accent_color=”#fff” background_color=”#e5694b” border_size=”1px” icon=”fa-laptop” box_shadow=”yes” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ class=”” id=””]Message Box Shortcodes[/fusion_alert]
Border Control
Control the border size and color of the message box.
[fusion_alert type=”custom” accent_color=”#39a4c3″ background_color=”#fff” border_size=”7px” icon=”fa-trophy” box_shadow=”yes” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ class=”” id=””]Message Box Shortcodes[/fusion_alert]
Box Animations
Animate the message boxes with smotth CSS3 animations. 5 animations types, 4 directions, speed control
[fusion_alert type=”custom” accent_color=”#39a4c3″ background_color=”” border_size=”1px” icon=”fa-thumbs-up” box_shadow=”yes” animation_type=”bounce” animation_direction=”down” animation_speed=”1″ class=”” id=””]Message Box Animations[/fusion_alert]
[fusion_alert type=”custom” accent_color=”#f56441″ background_color=”” border_size=”1px” icon=”fa-magic” box_shadow=”no” animation_type=”shake” animation_direction=”down” animation_speed=”1″ class=”” id=””]Message Box Animations[/fusion_alert]
Box Shadow
Choose if the box displays a subtle bottom shadow or not.
[fusion_alert type=”general” accent_color=”” background_color=”” border_size=”1px” icon=”fa-trophy” box_shadow=”yes” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ class=”” id=””]Subtle Bottom Shadow[/fusion_alert]
[fusion_alert type=”general” accent_color=”” background_color=”” border_size=”1px” icon=”fa-trophy” box
_shadow=”no” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ class=”” id=””]No Bottom Shadow[/fusion_alert]
_shadow=”no” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ class=”” id=””]No Bottom Shadow[/fusion_alert]