Feature Section

Inserting a Feature Section

A feature section is a great way to showcase or highlight a particular feature with a full width image .

Step 1: Switch To Backend Editor

To insert a feature section, start by clicking the button "Backend Editor" button then click the "+"(Add Element) button, for example:

VC Editor Backend
Step 2: Select Feature Section

Click "Feature Section" in the Visual Composer Modal to insert a feature section, for example:

Feature Sections Settings
Step 3: Edit Feature Section Settings

Once the feature section element has been inserted click the Edit Link(pen icon) of the icons, for example:

Feature Sections Settings

Here is an overview of available feature section options:

  • Feature Section Image

    Upload an image to be used for the feature section.

  • Feature Section Content

    Feature section content goes here.

  • Extra Class Name

    If you wish to style this component differently, then use the extra class name field to add one or several class names and then refer to it in your css file.

  • Media Alignment

    Determines whether the feature section image should be left or right aligned.

The feature section allows you to animate both the feature image and the feature content. Below is an example of the animation settings for the feature image. Repeat settings for the feature content content.

  • Media Animation Type

    Determines the type of animation that will be applied to the column.

  • Media Animation Duration

    How long the animation should be. Expressed in milliseconds i.e. 1000 represents 1 second.

  • Media Animation Delay

    How long before the animation should begin upon entering the viewport. Expressed in milliseconds i.e. 100 represents 0.1 second.

  • Media Animation Threshold

    Represents what percentage of the element should be visible in the viewport before animation begins. Expressed as a decimal i.e. i.e. 0.5 represents 50%.

Can't find what you're looking for? Submit a request in our forum.