Features Single

This shortcode allows adding a section with different features information to the page.

How To Add Features Single Widget To Your Page

  1. Click the   icon to create a Section
  2. Set your Column structure 
  3. Right-click to Edit, Duplicate, Copy, Delete, etc.
  4. Insert Widget using drag and drop inside your Columns

5. Choose Widget style (Custo Simple, Features Single 3, Custo Consult Simple with image, Features Single 43, or Custo Creative) in the  Layout section.

Custo Simple Layout:

Custo Consult Simple with image Layout:

Custo Creative Layout:

Features Single 3 Layout:

Features Single 43 Layout:

6. Customize widget and add content in  Content Section. Here you can also customize content Typography.


Content Settings:

1. Custo Simple Layout

Image - Here you can add the image to this section

Heading - Here you can add the text for the heading.

Use the custom font for heading? - Turn on the switcher if you want to customize heading typography. 

Background Image - Here you can choose an image for the background.

Select color for image background - Please, choose the color for background from the color palette.

Select color for border - Please, choose the color for the border from the color palette.

Block height - Please, set the block height here.

How to customize typography you can check in Typography Settings Category:

2. Custo Consult Simple with image Layout

Image - Here you can add the image to this section.

Add your title - Here you can add the text for the title.

Add your description - Please, enter your description text here.

Use custom font for title? - Turn on the switcher if you want to customize the title typography. 

Use custom font for description? - Turn on the switcher if you want to customize the description typography. 

Content orientation - Please, select the orientation for the content: line or column.

How to customize typography you can check in Typography Settings Category:

3. Custo Consult Simple with image Layout- Here you can add the image to this section.

Image - Add your image here.

Add your title - Here you can add the text for the title.

Add your description - Please, enter your description text here.

Use custom font for title? - Turn on the switcher if you want to customize the title typography. 

Use custom font for description? - Turn on the switcher if you want to customize the description typography. 

Border position - Please, select the border position (top or bottom).

How to customize typography you can check in Typography Settings Category:

4. Features Single 3 Layout

Image - Here you can add the image to this section

Heading - Here you can add the text for the heading.

Use the custom font for heading? - Turn on the switcher if you want to customize heading typography. 
Description - Please, enter your description text.

Use the custom font for description? - Turn on the switcher if you want to customize description typography. 

Content orientation - Please, select the orientation for the content: line or column.

Mark as active? - Turn on the switcher if you want to make the mark active.
Set image height? - Please, set the image height here.
  • Image height - Please, set the height of the image in px, % or vh.

Images size for images:

Image original size - Select the image size here.

How to customize typography you can check in Typography Settings Category:

4. Features Single 43 Layout

Image - Here you can add the image to this section

Heading - Here you can add the text for the heading.

Use the custom font for heading? - Turn on the switcher if you want to customize heading typography. 
Description - Please, enter your description text.

Use the custom font for description? - Turn on the switcher if you want to customize description typography. 

Link Text - Add link text to the button here.
Link - Add URL to the button.

How to customize typography you can check in Typography Settings Category:


Advanced Settings:

  1. Margin: Set the section Margin.
  2. Padding: Set the section Padding.
  3. Z-index: Set the Z-Index. 
  4. CSS ID: Set a CSS ID for your section.
  5. CSS Classes: Set CSS Classes for your section.

Motion Effects

  1. Sticky (Pro only): Set your section as Sticky, and choose between Top or Bottom. 
  2. Scrolling Effects (Pro only): Set Scrolling Effects to On to choose from a variety of animations and interactions that can occur when the user scrolls through the page. 
  3. Entrance Animation: Click the dropdown to choose an animation.

Background

The following options can be set independently for both the normal and hover states.

  1. Background Type: Choose between Classic or Gradient

Border

The following options can be set independently for both the normal and hover states.

  1. Border Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or grooved
  2. Border Radius: Set the border radius to control corner roundness
  3. Box Shadow: Adjust box-shadow options

Positioning

  1. Width: Select the width of the element, choosing from Full Width (100%), Inline (auto), or Custom. 
  2. Custom Width: Only available if Custom is chosen. Use the slider to adjust the width of the element within the column.
  3. Vertical Align: Only available if Full Width (100%) or Inline (auto) is chosen. Select to display the element at the Start, Center, or End.
  4. Position: Select the position of the element, choosing either Default, Absolute, Fixed, or Custom. Absolute positions an element absolutely to its first positioned parent. Fixed positions an element relative to the user’s viewport. 

If either Absolute or Fixed is selected, the following options also become available.

  1. Horizontal Orientation: Sets the horizontal reference point for the absolute positioning, with choices of either Start or End.
  2. Offset: Changes the horizontal reference point by the amount of the offset
  3. Vertical Orientation: Sets the vertical reference point for the absolute positioning, with choices of either Start or End.
  4. Offset: Changes the vertical reference point by the amount of the offset

Responsive

  1. Reverse Columns: Slide to reverse the order of your columns (Great for Mobile).
  2. Visibility: Show or Hide your section on Desktop, Tablet, or Mobile