{"id":10680,"date":"2022-08-13T15:37:47","date_gmt":"2022-08-13T15:37:47","guid":{"rendered":"https:\/\/themenectar.com\/docs\/salient\/?page_id=10680"},"modified":"2022-08-24T02:01:55","modified_gmt":"2022-08-24T02:01:55","slug":"lottie-animations","status":"publish","type":"page","link":"https:\/\/themenectar.com\/docs\/salient\/lottie-animations\/","title":{"rendered":"Lottie Animations"},"content":{"rendered":"[vc_row type=”full_width_background” full_screen_row_position=”middle” column_margin=”custom” column_margin_custom=”5%” equal_height=”yes” content_placement=”middle” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” scene_position=”center” top_padding=”5%” bottom_padding=”2%” text_color=”dark” text_align=”left” row_border_radius=”none” row_border_radius_applies=”bg” overflow=”visible” overlay_strength=”0.3″ gradient_direction=”left_to_right” shape_divider_position=”bottom” bg_image_animation=”none” gradient_type=”default” shape_type=””][vc_column column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” column_position=”default” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/2″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][vc_column_text]\n

Lightweight, scalable animations<\/h2>\n[\/vc_column_text][vc_column_text]Lottie provides a simple flow to bring to your website without the need for coding. In version 15, we’ve added deep integration with Lottie to allow you to easily add and control the playback of Lottie animations directly from a page builder element.[\/vc_column_text][\/vc_column][vc_column column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” column_position=”default” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/2″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][nectar_lottie trigger_type=”play” mobile_func=”default” trigger_offset=”0.00,100.00″ frame_constraint=”0.00,100.00″ width_desktop=”70%” alignment=”center” preserve_aspect_ratio=”xMidYMid meet” json_url=”https:\/\/assets4.lottiefiles.com\/packages\/lf20_f8xnmcvu.json”][\/vc_column][\/vc_row][vc_row type=”full_width_background” full_screen_row_position=”middle” column_margin=”custom” column_margin_custom=”5%” equal_height=”yes” content_placement=”middle” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” scene_position=”center” top_padding=”5%” constrain_group_1=”yes” bottom_padding=”5%” text_color=”dark” text_align=”left” row_border_radius=”none” row_border_radius_applies=”bg” overflow=”visible” overlay_strength=”0.3″ gradient_direction=”left_to_right” shape_divider_position=”bottom” bg_image_animation=”none” gradient_type=”default” shape_type=””][vc_column column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” column_position=”default” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/1″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][vc_row_inner column_margin=”default” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” right_padding_desktop=”40%” right_padding_tablet=”20%” right_padding_phone=”0″ text_align=”left” row_position=”default” row_position_tablet=”inherit” row_position_phone=”inherit” overflow=”visible” pointer_events=”all”][vc_column_inner column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/1″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][vc_column_text]\n

Using an external source<\/h2>\n[\/vc_column_text][vc_column_text]The simplest method of adding Lottie animations to your site is to grab an existing animation and paste in the file URL into the Salient Lottie element.[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row type=”full_width_background” full_screen_row_position=”middle” column_margin=”custom” column_margin_custom=”5%” equal_height=”yes” content_placement=”middle” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” scene_position=”center” bottom_padding=”5%” text_color=”dark” text_align=”left” row_border_radius=”none” row_border_radius_applies=”bg” overflow=”visible” overlay_strength=”0.3″ gradient_direction=”left_to_right” shape_divider_position=”bottom” bg_image_animation=”none” gradient_type=”default” shape_type=””][vc_column column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” column_position=”default” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/1″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][tabbed_section style=”vertical_scrolling” tab_color=”Accent-Color” vs_navigation_func=”default” vs_navigation_width=”regular” vs_navigation_spacing=”15px” vs_navigation_mobile_display=”hidden” vs_tab_spacing=”20%” vs_tab_tag=”h6″ vs_cta_style=”see-through” vs_cta_bg_color=”default” vs_cta_heading_tag=”h6″ vs_sticky_aspect=”default”][tab icon_family=”none” title=”1. Locate a Lottie file” id=”1661306504364-2″ tab_id=”1661306504364-7″][vc_row_inner column_margin=”custom” column_margin_custom=”5%” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” text_align=”left” row_position=”default” row_position_tablet=”inherit” row_position_phone=”inherit” overflow=”visible” pointer_events=”all”][vc_column_inner column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/2″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][vc_column_text]\n

1. Locate a Lottie file<\/h3>\n[\/vc_column_text][vc_column_text]There are many collections of Lottie files you can find online, but for this tutorial, we’ll be using lottiefiles<\/a>.[\/vc_column_text][vc_column_text]Lottie files offers thousands of free animations you can browse. Once you’ve located an animation, copy the URL from the “Lottie Animation URL” field as shown on the right.[\/vc_column_text][\/vc_column_inner][vc_column_inner column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/2″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][image_with_animation image_url=”10686″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”zoom” alignment=”” img_link_large=”yes” border_radius=”20px” box_shadow=”none” image_loading=”default” max_width=”100%” max_width_mobile=”default”][\/vc_column_inner][\/vc_row_inner][\/tab][tab icon_family=”none” title=”2. Add the file through Salient” id=”1661306504413-1″ tab_id=”1661306504414-4″][vc_row_inner equal_height=”yes” content_placement=”middle” column_margin=”default” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” text_align=”left” row_position=”default” row_position_tablet=”inherit” row_position_phone=”inherit” overflow=”visible” pointer_events=”all”][vc_column_inner column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/2″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][vc_column_text]\n

2. Add the file through Salient<\/h3>\n[\/vc_column_text][vc_column_text]In the page builder, add a Lottie element in your desired location and paste the URL into the field.[\/vc_column_text][vc_column_text]If the URL is to a valid Lottie file, you’ll immediately see a preview of the animation within the page builder element.[\/vc_column_text][vc_column_text]Note: If you opt to use a site other than lottiefiles, ensure that you trust the source before adding any Lottie file to your site.<\/strong>[\/vc_column_text][\/vc_column_inner][vc_column_inner left_padding_desktop=”19%” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/2″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid” column_padding_type=”advanced” gradient_type=”default”][image_with_animation image_url=”10694″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”zoom” alignment=”” img_link_large=”yes” border_radius=”20px” box_shadow=”none” image_loading=”default” max_width=”100%” max_width_mobile=”default”][\/vc_column_inner][\/vc_row_inner][\/tab][tab icon_family=”none” title=”3. Configure Animation Properties” id=”1661306504448-2″ tab_id=”1661306504449-3″][vc_row_inner equal_height=”yes” content_placement=”middle” column_margin=”default” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” text_align=”left” row_position=”default” row_position_tablet=”inherit” row_position_phone=”inherit” overflow=”visible” pointer_events=”all”][vc_column_inner column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/1″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][vc_column_text]\n

3. Configure Animation Properties<\/h3>\n[\/vc_column_text][vc_column_text]\n

Trigger Type<\/h4>\n

Determines what action will cause the Lottie animation to play. The available options are:<\/p>\n

    \n
  1. Autoplay<\/strong>: automatically starts playing the Lottie animation as soon as the file loads<\/li>\n
  2. Play when visible: <\/strong>Similar to Autoplay, but starts the animation only when the user has scrolled down to where it’s in view<\/li>\n
  3. Scroll Position Seek: <\/strong>Scrubs through the animation from start to finish depending on the user’s scroll position.<\/li>\n
  4. Hover: <\/strong>Triggers the animation to play only when the user has hovered over it.<\/li>\n<\/ol>\n[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][vc_row_inner equal_height=”yes” content_placement=”middle” column_margin=”default” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” bottom_padding=”3%” text_align=”left” row_position=”default” row_position_tablet=”inherit” row_position_phone=”inherit” overflow=”visible” pointer_events=”all”][vc_column_inner column_padding=”padding-4-percent” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”center” tablet_text_alignment=”default” phone_text_alignment=”default” background_color=”#f4f4f4″ background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”15px” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/3″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid” column_padding_type=”default” gradient_type=”default”][nectar_lottie trigger_type=”play” mobile_func=”default” loop=”true” trigger_offset=”0.00,100.00″ frame_constraint=”0.00,100.00″ width_desktop=”70%” alignment=”center” preserve_aspect_ratio=”xMidYMid meet” json_url=”https:\/\/assets9.lottiefiles.com\/packages\/lf20_9r65d17y.json”][vc_column_text]Autoplay<\/strong>[\/vc_column_text][\/vc_column_inner][vc_column_inner column_padding=”padding-4-percent” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”center” tablet_text_alignment=”default” phone_text_alignment=”default” background_color=”#f4f4f4″ background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”15px” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/3″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid” column_padding_type=”default” gradient_type=”default”][nectar_lottie trigger_type=”seek” trigger_offset=”0.00,100.00″ frame_constraint=”0.00,100.00″ width_desktop=”70%” alignment=”center” preserve_aspect_ratio=”xMidYMid meet” json_url=”https:\/\/assets9.lottiefiles.com\/packages\/lf20_9r65d17y.json”][vc_column_text]Scroll position seek<\/strong>[\/vc_column_text][\/vc_column_inner][vc_column_inner column_padding=”padding-4-percent” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”center” tablet_text_alignment=”default” phone_text_alignment=”default” background_color=”#f4f4f4″ background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”15px” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/3″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid” column_padding_type=”default” gradient_type=”default”][nectar_lottie trigger_type=”hover” hover_func=”hover” width_desktop=”70%” alignment=”center” preserve_aspect_ratio=”xMidYMid meet” json_url=”https:\/\/assets9.lottiefiles.com\/packages\/lf20_9r65d17y.json”][vc_column_text]Hover<\/strong>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][vc_row_inner equal_height=”yes” content_placement=”middle” column_margin=”default” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” text_align=”left” row_position=”default” row_position_tablet=”inherit” row_position_phone=”inherit” overflow=”visible” pointer_events=”all”][vc_column_inner column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”30px” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/1″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid” column_padding_type=”default” gradient_type=”default”][vc_column_text]\n

    Loop Animation<\/h4>\n

    Determines whether the animation should start from the beginning and play infinite after each last frame. This is only available as an option when using the “Autoplay” and “Play when visible” trigger types.[\/vc_column_text][vc_column_text]\n

    Animation Start\/End Frames<\/h4>\n

    Allows you to limit the section of the animation that will play.[\/vc_column_text][vc_column_text]\n

    Animation Speed<\/h4>\n

    Determines how fast your Lottie animation will play.[\/vc_column_text][vc_column_text]\n

    Dimensions<\/h4>\n

    Allows you to define a custom width and height uniquely on each device viewport that you would like the Lottie animation display at. If this is left blank, the animation will attempt to fill the column width.[\/vc_column_text][vc_column_text]\n

    Preserve Aspect Ratio<\/h4>\n

    When this is enabled, your Lottie animation will not stretch its original aspect ratio. However, sometimes it might be useful to allow your animation to stretch to fill an area and setting this field to “none” will make that easier.[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/tab][\/tabbed_section][\/vc_column][\/vc_row][vc_row type=”full_width_background” full_screen_row_position=”middle” column_margin=”custom” column_margin_custom=”5%” equal_height=”yes” content_placement=”middle” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” scene_position=”center” top_padding=”5%” bottom_padding=”12%” text_color=”dark” text_align=”left” row_border_radius=”none” row_border_radius_applies=”bg” overflow=”visible” id=”create-your-own” overlay_strength=”0.3″ gradient_direction=”left_to_right” shape_divider_position=”bottom” bg_image_animation=”none” gradient_type=”default” shape_type=””][vc_column column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” column_position=”default” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/1″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][vc_row_inner column_margin=”default” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” bottom_padding=”3%” left_padding_desktop=”25%” constrain_group_2=”yes” right_padding_desktop=”25%” left_padding_tablet=”10%” constrain_group_4=”yes” right_padding_tablet=”10%” left_padding_phone=”0″ constrain_group_6=”yes” right_padding_phone=”0″ text_align=”left” row_position=”default” row_position_tablet=”inherit” row_position_phone=”inherit” overflow=”visible” pointer_events=”all”][vc_column_inner column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” centered_text=”true” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/1″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid” column_padding_type=”default” gradient_type=”default”][vc_column_text]\n

    Creating your own Lottie Animation<\/h2>\n[\/vc_column_text][vc_column_text]While we’re not going to cover a full example of the process, it is possible to create your own Lottie animations using Adobe After Effects. All you need to be able to export Lottie animations from After Effects is a free plugin. Below are two plugins that add the functionality.<\/p>\n[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][vc_row_inner equal_height=”yes” content_placement=”middle” column_margin=”default” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” text_align=”left” row_position=”default” row_position_tablet=”inherit” row_position_phone=”inherit” overflow=”visible” pointer_events=”all”][vc_column_inner column_padding=”padding-7-percent” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” centered_text=”true” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ background_image=”10714″ background_image_position=”center center” background_image_stacking=”default” background_image_loading=”default” column_backdrop_filter=”none” font_color=”#ffffff” column_shadow=”none” column_border_radius=”15px” column_link_target=”_self” overflow=”visible” enable_gradient=”true” color_overlay=”#000000″ color_overlay_2=”#00ddb3″ gradient_direction=”left_t_to_right_b” overlay_strength=”0.8″ width=”1\/2″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid” column_padding_type=”default” gradient_type=”default”][image_with_animation image_url=”10717″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”center” border_radius=”none” box_shadow=”none” image_loading=”default” max_width=”50%” max_width_mobile=”default” margin_bottom=”50″][nectar_cta btn_style=”text-reveal-wave” heading_tag=”h6″ button_color=”default” text_color=”#ffffff” button_border_color=”rgba(255,255,255,0.43)” button_border_color_hover=”#ffffff” button_border_thickness=”1px” link_type=”new_tab” alignment=”center” alignment_tablet=”default” alignment_phone=”default” constrain_group_3=”yes” constrain_group_4=”yes” display=”block” display_tablet=”inherit” display_phone=”inherit” nofollow=”true” icon_family=”none” padding_top=”20″ padding_bottom=”20″ padding_left=”40″ padding_right=”40″ link_text=”Explore plugin” url=”https:\/\/lottiefiles.com\/plugins\/after-effects”][\/vc_column_inner][vc_column_inner column_padding=”padding-5-percent” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color=”#ef8a97″ background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” font_color=”#ffffff” column_shadow=”none” column_border_radius=”15px” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/2″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid” column_padding_type=”default” gradient_type=”default”][image_with_animation image_url=”10728″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”center” border_radius=”none” box_shadow=”none” image_loading=”default” max_width=”custom” margin_bottom=”50″ max_width_custom=”130px”][nectar_cta btn_style=”text-reveal-wave” heading_tag=”h6″ button_color=”default” text_color=”#ffffff” button_border_color=”rgba(255,255,255,0.43)” button_border_color_hover=”#ffffff” button_border_thickness=”1px” link_type=”new_tab” alignment=”center” alignment_tablet=”default” alignment_phone=”default” constrain_group_3=”yes” constrain_group_4=”yes” display=”block” display_tablet=”inherit” display_phone=”inherit” nofollow=”true” icon_family=”none” padding_top=”20″ padding_bottom=”20″ padding_left=”40″ padding_right=”40″ link_text=”Download Bodymovin” url=”https:\/\/exchange.adobe.com\/creativecloud.details.12557.bodymovin.html”][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row]\n","protected":false},"excerpt":{"rendered":"

    [vc_row type=”full_width_background” full_screen_row_position=”middle” column_margin=”custom” column_margin_custom=”5%” equal_height=”yes” content_placement=”middle” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” scene_position=”center” top_padding=”5%” bottom_padding=”2%” text_color=”dark” text_align=”left” row_border_radius=”none” row_border_radius_applies=”bg” overflow=”visible” overlay_strength=”0.3″ gradient_direction=”left_to_right” shape_divider_position=”bottom” bg_image_animation=”none” gradient_type=”default” shape_type=””][vc_column column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default”…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"_links":{"self":[{"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/pages\/10680"}],"collection":[{"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/comments?post=10680"}],"version-history":[{"count":48,"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/pages\/10680\/revisions"}],"predecessor-version":[{"id":10736,"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/pages\/10680\/revisions\/10736"}],"wp:attachment":[{"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/media?parent=10680"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}