Contact the Support

SKT Blocks Plugin Documentation

By SKT Themes - www.sktthemes.org

Plugin Installation

Through Dashboard

  • Log in to the WordPress Dashboard.
  • Go to Plugins.
  • Click on Add New.
  • Click on Upload Plugin button.
  • Click on Choose File button and select skt-blocks.zip then click on Install Now button and wait for the install to complete.
  • After the Plugin installed successfully, click on Activate button.

Manual Installation using FTP

  • Unzip skt-blocks.zip to your Desktop.
  • Using an FTP client to access your host web server. Go to /wp-content/plugins/
  • Upload Plugins to /wp-content/plugins/.
  • Go to plugins and activate Plugin from Dashboard.

Begin creating or editing a page or post

  • Create a post or a page that you wish to build with the Gutenberg editor.

Click on the + icon than Click on Browse all and in left pannel top see SKT Blocks section

Info Block

This block allows you to add an icon or image along with a heading and description.

Image/Icon

Select Source: Choose an icon or an image to display in the block.

Select Position: You can display the icon/image above or below the title, at the left or right of the title, or at the left or right of the title and text.

With Source selected as icon following options will be available
Icon Size, Icon Color, Icon Hover color.

Background Options

You can select a background image for the block from here.

Background Color: Select a color for the background of the block from here.

Opacity: You can set opacity from here for the block.

Spacing

Specify space around the content by using Content Padding.

Spacing tab offer options to customize the bottom spacing for Prefix, Title, Separator, and Description.

There are also options to customize the Icon/Image margin for Top, Bottom, Left, and Right.

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Border Width - Set a width for the border from here.

Border Color - You can give color to the border from here.

Border Radius - You can give border-radius to the box from here.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Separator

Select Position: You can display the separator after icon/image, prefix, title, or description.

Separator Style - You can select the style of the separator as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Separator Thickness - Set thickness for the separator from here.

Separator Width - Set a width for the separator from here.

Separator Color - You can give color to the separator from here.

Call to Action

Type: Select to display the call to action as a text or a button or choose to hide it.

If you select the type as text, you will get the following controls to manage it-

  • Text and Link for the text
  • Option to open the link in new tab
  • Color options are available for Text.

If you select the type as Button, you will get the following controls to manage it-

  • Text and Link for the button.
  • Option to open the link in new tab
  • Color options are available for Text.
  • Button Padding
    1. Horizontal Padding: Set padding to increase the width of the button.
    2. Vertical Padding: Set padding to increase the height of the button.
  • Button Border
    1. Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.
    2. Border Width - Set a width for the border from here.
    3. Rounded Corners - You can give border-radius to the box from here.
  • Color options are available for text, background, border, and for hover elements respectively.

Content

Under this tab, you can hide or display title, description, and prefix for the block and choose a font size, font-weight, and color for them individually.

You can set responsive font size of Title for Mobile and Tablet view.

Post Carousel

Post Carousel provides options to showcase custom post types with carousel layout. It provides an option to select available post types – posts, pages, media, or any CPT you have. It also offers taxonomy controls and predefined controls for every part of the post like Featured Image, Excerpt, Author, etc.

General

Equal Height - Enable this option to make all posts to have equal height.

Featured Image - Choose to display the featured image in the carousel or not.

Post Title - Hide or Display the post title.

Post Author - Hide or Display the name of the author of the post.

Post Date - Hide or Display the published date of the post.

Post Content - Hide or Display the content of the post.
If you choose to display the content, a slider will appear for you to select the content length of the post.

Columns - Decide the number of columns to display for the grid.

Order by option allows you to order posts according to date or alphabetically dependent on the title.

Category controls allow you to choose posts according to categories or tags.

Orientation for the icon and a post timeline can be set to Center, Left, Right from Orientation. Arrow Alignment can be set vertically top, bottom, or center with respect to timeline card.

Carousel

Carousel tab offer options to customize the post slider. The options are –

  • Pause On Hover
  • Autoplay
  • Autoplay speed
  • Infinite Loop
  • Transition Speed (ms)
  • Show Arrows & Dots
  • Arrow Size
  • Arrow Border Size
  • Arrow Border Radius

Image Settings

Size - Select a size for the image as full or thumbnail.

Image Position - Select the position of the featured image as top or background.

CTA Settings

Under this tab, you will get the option to edit the continue reading text.

Border Settings
Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Border Width - Set a width for the border from here.

Border Radius - You can give border-radius to the button from here.

Border Color - Select a color for the border from here.

Color Settings
Under the Colors tab, color options are available for Text and Background for the CTA button.

Typography

Under the Typography tab, options for font size, font-weight, color, and line-height are available for Title, Meta, Excerpt, and CTA.

You can now set responsive font size of Title for Mobile and Tablet view.

Color Settings

Under the Colors tab, color options are available for Blog Post Background, Title, Text, Content, Author, Date, and Arrow & Dots.

Testimonial

Testimonials are customer reviews that can be displayed on the site to add credibility. Testimonial block allows you to display a single testimonial block on your site.

General

Number of Team Member Boxes - Increase or decrease the number of cards.

Gutter - Set space between the blocks with this setting.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Border Radius - You can give border-radius to the box from here.

Padding - You can control the content padding of columns from here.

Font-Size - Choose the font-size for your testimonial.

Color and Background

Under the Colors tab, color options are available for Text and Background Color.

Background Color Opacity: You can set opacity from here for the block.

Gradient Image - You can set gradient background by enabling this toggle button. Upon enabling the toggle, you will see Secondary Color option to select the second color for gradient effect. You can also customize the gradient degree.

Background Image: You can select a background image for the block from here.

Background Position: You can select the position of the background image for the block from here. If you want to show the top left part of the image, select the position as left top. Similarly, choose the part of the image that you want to display from Left Top, Left Center, Left Bottom, Right Top,..Center Bottom etc.

Background Repeat: You can choose to repeat the image on x-axis, y-axis or on both axis.

Background Size: You can select the size of the background image for the block from here.

Typography

Under the Typography tab, options for font size, font-weight, text-transform, and line-height are available for Content, Name and Title separately.

Image

Image Shape - Select the shape of image as square, circle, or blob.

Size - Select the size of the image as small, medium, large, or full.

Width - Select the width for the image.

Spacing

Spacing tab offer options to customize the spacing for Content, Title, Name, and Image.

Testimonial Slider

Testimonials are customer reviews that can be displayed on the site to add credibility. Testimonial Slider block allows you to display multiple testimonials in a slider form on your site.

General

Number of Testimonials - Increase or decrease the number of testimonials in a slider.

Columns - Increase or decrease the number of columns in a slider.

Skin - Select skin for the block as default or bubble.

Bubble Settings

This option is available only when the skin type is selected as Bubble.

Background Color - Select background color for bubble.

Padding - Update padding for the bubble.

Border Radius - Update border-radius for bubble.

Carousel

Pause on Hover - Pause the slider when the user hovers over it.

Autoplay - Enable this feature to autoplay the slider when the page is loaded.

Autoplay Speed - Specify the speed of the slides in milliseconds.

Infinite Loop - Enable this feature to make the slider loop infinitely.

Transition Speed - Specify speed in milliseconds required for the transition of one slide to another slide.

Show Arrow & Dots - Select option for pagination as only dots or both arrow & dots. If both Arrow & Dots option is selected you can design arrow size, arrow border size & arrow border-radius.

Image

Here you can select images for individual slides.

Image Position - Select position of the image from Top, Bottom, Left, Right, Stacked.

Image Style - Select the shape of image as normal, circle, or square.

Image Size - Select the size of the image as small, medium, large, or full.

Width - Select the width for the image.

Typography

Under the Typography tab, options for font size, font-weight, text-transform, and line-height are available for Content, Name and Title separately.

Color Settings

Under the Color Settings tab, options for color are available for Testimonial, Name, Company, Arrow & Dots separately.

Spacing

Spacing tab offer options to customize the spacing for Content, Title, Name, and Image.

Background

Background Type - Select background as color or image.

Border

Here you can update border style & border-radius.

Post and Page Grid

This block provides options to showcase custom post type anywhere on the page. It provides category controls to choose categories or tags. It also offers predefined controls for every part of the post like Featured Image, Title, Excerpt, author, etc.

Post and Page Grid Settings

Content Type option allows choosing post types – posts or pages.

Taxonomy option is available to filter your post from Categories or Tags. Upon selecting Categories, Category control will be visible to allow you to choose posts according to categories.

Post and Page Grid Settings

Under the Post and page grid settings tab, the following options are available.

Number of Items - Increase or decrease the number of posts to display.

Order by option allows you to order posts according to date, title, random order, or menu order.

Order option allows you to order the posts in descending or ascending order.

Column - Customize the number of columns that you want to display.

Equal Height - Switch on the toggle to display the posts for equal height.

Post Pagination - Switch on the toggle to display the posts pagination.

Page Limit - Select the limit of pages to display for pagination

Pagination

Select the Layout and Alignment of Pagination.

Post and Page Grid Content

Display Section Title - Hide or Display a title on top of the post grid. If you choose to display the title, an input box will appear for you to write a title.

Display Featured Image - Hide or Display featured image of post/page if there is one.

Display Title - Hide or Display the title of the post.

Display Author - Hide or Display the name of the author of the post.

Display Date - Hide or Display the published date of the post.

Display Excerpt - Hide or Display the excerpt of the post.

If you choose to display the excerpt, a slider will appear for you to select the excerpt length of the post.

Display Continue Reading Link - Hide or Display a continue reading link for the post. If you choose to display the link, an input box will appear for you to customize continue reading text.

Post and Page Grid Markup

Post Grid Section Tag section - You can select the tag that you want to allot to the grid section such as div, header, section, main, aside, footer.

Section Title Heading tag - You can select the tag that you want to allot to the section title from H2 to H6.

Typography

Under the Typography tab, options for font size, font-weight, color, and line-height are available for Excerpt, Meta, and Title.

You can now set responsive font size of Title for Mobile and Tablet view.

Colors

Under the Colors tab, color options are available for Blog Post Background, Title, Meta, and Excerpt.

Spacing

Space can be managed for the content from here.

Advance Column

Advanced Columns block acts as an outer wrapper and allows adding any Gutenberg block within it.

General

Columns - Decide the number of columns to display.

Column Gap option allows you to adjust the space between two columns.

ontainer Width controls allow you to choose a width for the columns. You can give a custom width of your choice to the columns from here.

Background

You will get an option to select the background type as color, gradient, or an image.

Spacing

Spacing tab offer options to customize the post slider. These options are separate for desktop, tablet, and mobile devices. The options are –

  • Top Padding
  • Bottom Padding
  • Left Padding
  • Right Padding
  • Top Margin
  • Name Bottom Margin

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it

Border Radius - You can give border-radius to the columns from here.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

FlipBox

FlipBox Block allows you to add a flipbox to your website.

General

Select Front for settings of the front of the box and Back for settings of the back of the box.

Front Content Settings

Here you will find 3 separate settings for all 3 boxes named FlipBox 1 Settings, FlipBox 2 Settings, FlipBox 3 Settings. These settings contain the following options

Title - Setting a title to display on the front of the box.

Content - Setting the content to be displayed on the front of the box.

Front Icon Settings

Here you will find 3 separate settings for all 3 boxes named Flip Box 1, FlipBox 2, Flip Box 3. Select Icon for 3 boxes separately.

Background Image

Select a background image to be displayed in the front. You can also set opacity from here.

Color Settings

Under the Colors tab, color options are available for Text and Background. You can also set opacity from here.

Spacing

Spacing tab offer options to customize the spacing for Top, Bottom, Left, and Right.

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it

Border Radius - You can give border-radius to the boxes from here.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Divider

Add a divider and spacer between your blocks.

Vertical Margin - Give space for the top and bottom of the divider.

Divider Style - You can select the style of the divider as solid, dots, or rigged.

Divider Height - You can set height for the divider from here.

Divider Weight - You can set weight for the divider from here.

Divider Color

Give color to the divider from here.

Spacer

Add a spacer between your blocks.

Spacer Height - You can set height for the spacer from here.

Spacer Color - Give color to the spacer from here.

Spacer Color Opacity - Set opacity for spacer color from here.

Gradient Effect - You can also enable or disable the gradient effect for the spacer.

Count Up

Count up block allows you to add count up blocks.

General

Alignment - Choose left, center, or right as the alignment of the text.

Columns - Decide the number of columns to display.

Content

Under this tab, you can hide or display title, description, and an icon for the block.

Icon

If you have chosen to display the icon, this tab will appear with the following options:

Select Icon - Choose an icon for an individual item from a number of options.

Icon Color - You can choose a color for the icon from here.

Typography

Under the Typography tab, options for font size, font-weight, color, and line-height are available for Number, Description, and Heading.

You can now set responsive font size of Heading for Mobile and Tablet view.

Color Settings

Under the Colors tab, color options are available for Title, Text, Number, and Background. Opacity option is also available for background color.

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Border Width - Set a width for the border from here.

Border Color - You can give color to the border from here.

Border Radius - You can give border-radius to the box from here.

Post Timeline

Post Timeline block allows you to choose Custom Post Type and displays them in the timeline. It provides an option to select available post types as posts or pages

Query

Taxonomy: Select Tags or Categories to filter the posts from.

If you select Tags, you will see another option to select the tags whose post you want to display, and if you select category, you will see the Category option to select category whose post you want to display.

Post Timeline Settings

Under the Post timeline settings tab, Content Type option allows choosing post types – posts or pages.

Order by option allows you to order posts according to date, title, random, or menu order.

Order the posts in ascending or descending order.

Border Radius option is available to set border-radius for posts.

Orientation for the icon and a post timeline can be set to Center, Left, Right from Orientation. Arrow Alignment can be set vertically top, bottom, or center with respect to timeline card.

Post Timeline Content

Display Section Title - Hide or Display a title on top of post timeline. If you choose to display the title, an input box will appear for you to write a title.

Display Featured Image - Hide or Display featured image of post/page if there is one.

Display Title - Hide or Display the title of the post.

Display Author - Hide or Display the name of the author of the post.

Display Date - Hide or Display the published date of the post.

Display Excerpt - Hide or Display the excerpt of the post.

If you choose to display the excerpt, a slider will appear for you to select the excerpt length of the post.

Display Continue Reading Link - Hide or Display a continue reading link for the post. If you choose to display the link, an input box will appear for you to customize continue reading text.

Open link in new tab - Toggle on to open the continue reading link in a new tab.

Post Timeline Markup

Post Timeline Section Tag - You can select the tag that you want to allot to the grid section such as div, header, section, main, aside, footer.

Post Title Heading tag - You can select the tag that you want to allot to the section title from H2 to H6.

Connector Settings

Choose an icon for the connector from a number of options.

Icon Size - Increase or decrease the size of the icon from here.

Border Width - Set a border to the connector element from here.

Connector Width - Set the width of the connector line with this option.

Connector Color Settings - Under the Colors tab, color options are available for Line, Icon, Background, and Border.

Colors

Under the Colors tab, color options are available for Blog Post Background, Heading, Author, Content, Continue Reading Text.

Typography

Under the Typography tab, options for font size, font-weight, color, and line-height are available for Date, Heading, Author, Content, and Continue Reading Text.

Padding

Space can be managed for the content of the timeline card from the Padding tab.

Spacing

Spacing tab offer options to customize the spacing for Block, heading, and author.

Button Box Shadow

You can give box-shadow to the CTA button with a number of options available for customization such as color, blur, spread, position, etc.

Icon List

This block allows you to place an icon in a list format.

General

Layout - Decide the layout of the list to be displayed from the two options; horizontal, vertical.

Hide Labels - You can display or hide the text from here.

Gap between Items and Gap between Icon and Label option is to manage the space for the icon list.

Labels Font Size - You can increase or decrease the font size of the text from here.

Icon Alignment - This manages the Icon Position with respect to the Label.

Icon Size - Increase or decrease the size of the icon from here.

Border Radius - You can give border-radius to the box from here.

Icon Settings

Select Source: Choose an icon or an image to display in the block.

Choose an icon for an individual item from a number of options.

Icon Color Settings

Under the Colors tab, color options are available for Text, Icon, Icon Background, Icon Border.

Buttons Group

This block allows you to place a number of buttons in a group format.

General

Under the General tab, you can select the button alignment as left, right, or center.

Button Settings

Inherit from theme - Enabling this option will apply the styles of the theme to the button.

Open link in new tab - Here you will get the option to open the link in a new tab.

Hover Effect: Select the effect as lift, scale, lift & scale, scale more, and lift & scale more. You will see this effect when you bring the cursor on the button.

Under the Colors Settings tab, color options are available for Text, Background, Border. You can also choose the color as transparent.

Background: You will get an option to select the background type as color or gradient.

Border : The following settings are available in the border panel -

Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it

Border Thickness - You can set the thickness of the border from here.

Rounded Corners - You can give border-radius to the buttons from here.

Spacing

Spacing tab offer options to customize the button padding and margin separately for Vertical and Horizontal. You can set different spacing for mobile and tablet view.

Icon Settings

Select an icon to display on the button from here.

Select Position: You can display the icon after or before the text.

Icon Size - Increase or decrease the size of the icon from here.

Icon Spacing - Increase or decrease the spacing between icon and text from here.

Typography

Under the Typography tab, options for font size and line-height are available for Button.

Box Shadow

You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Section

Section block acts as an outer wrapper and allows adding any Gutenberg block within it.

General

Content Width - Select width as Boxed or Full-width.

Width - Increase or decrease the width of the section.

Spacing

Spacing tab offer options to customize the padding and margin separately for Top, Bottom, Left, and Margin.

Background

You can select a background type for the block from here. The options available are:

  1. Color
  2. Gradient
  3. Image
  4. Video

Opacity: You can set opacity from here for the block.

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Border Width - Set a width for the border from here.

Border Color - You can give color to the border from here.

Border Radius - You can give border-radius to the box from here.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Text Settings

Preset Size - Select the size of the text as small, default, large, or assign a custom value of your choice.

Under the Colors tab, color options are available for Text, Background.

Image Boxes

This block allows you to add an image block along with the title.

General

Number of Image Boxes Blocks - Increase or decrease the number of image boxes.

Height - Increase or decrease the height of the section.

Border Radius - You can give border-radius to the box from here.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Alignment

Horizontal Alignment - This manages the alignment of content. Set is at left, center, or right.

Vertical Alignment - This manages the vertical alignment of content. Set is at top, center, or bottom.

Image Settings

Size - Select a size for the image as full, medium, large, or thumbnail.

Background Position: You can select the position of the background image for the block from here. If you want to show the top left part of the image, select the position as left top. Similarly, choose the part of the image that you want to display from Left Top, Left Center, Left Bottom, Right Top,..Center Bottom etc.

Background Repeat: You can choose to repeat the image on the x-axis, y-axis, or on both axis.

Background Size: You can select the size of the background image for the block from here.

Overlay Color

You can select an overlay color for the block from here.

Background Color: Select a color for the background of the block from here.

Gradient: You can set a gradient color as overlay by switching this as on.

Opacity: You can set opacity from here for the block.

Hover Overlay Color

You can select an overlay color for the block on hovering from here.

Background Color: Select a hover color for the background of the block from here.

Gradient: You can set a gradient color as overlay by switching this as on.

Opacity: You can set opacity from here for the block.

Typography

Under the Typography tab, options for font size, font-weight, text-transform, and line-height are available for Description and Title separately.

You can now set responsive font size of Title for Mobile and Tablet view.

Padding

The Padding tab offer options to customize the spacing for Top, Bottom, Left, and Right.

Hover Effect

Select an effect for the block on hovering.

Spacing

Spacing tab offer options to customize the spacing for Title and Description.

Arrow

Hide or Display arrow after content. Select a color for the arrow and increase or decrease its size.

Under the Colors tab, color options are available for Text, Background. You can select different colors for hover items.

Accordion

This block allows you to answer the user’s common queries in an easy and attractive way.

General

Layout: Select Layout as Accordion or Grid.

Collapse Other Items - Enable to set accordion item to be closed by default.

Expand First Item - Enable to set the first accordion item to be open by default.

Icon

Select an expand icon and collapse icon from here.

Icon Alignment: You can select the alignment of the icon from here.

Icon Size - Increase or decrease the size of the icon from here.

Icon Color - Select the color of the icon separately for the active and hover element.

Color

Under the Colors tab, color options are available for Title and Content.

Spacing

Spacing tab offer options to customize the vertical and horizontal margin and also control the gap between rows.

Typography

Under the Typography tab, options for font size, font-weight, color, and line-height are available for Title and Content.

Style

This tab comes when you select a single accordion item

Border : The following settings are available in the border panel -

Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it

Border Thickness - You can set the thickness of the border from here.

Border Radius - You can give border-radius to the block from here.

Box Shadow

You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Call to Action

This block allows you to add a call to action section with a title, text, and a button.

General

Border Radius - You can give border-radius to the block from here.

Box Shadow - You can give border-radius to the block from here.

Typography

Under the Typography tab, options for font size, font-weight, and line-height are available for Title and Description.

You can now set responsive font size of Title for Mobile and Tablet view.

Text Color: Select color for the text from here.

Background Options

You can select a background type for the block from here. The options available are:

  1. Color
  2. Gradient
  3. Image
  4. Video

Opacity: You can set opacity from here for the block.

Image Settings

These settings will appear if you select Background Type as Image.

Background Position: You can select the position of the background image for the block from here. If you want to show the top left part of the image, select the position as left top. Similarly, choose the part of the image that you want to display from Left Top, Left Center, Left Bottom, Right Top, Center Bottom, etc.

Background Repeat: You can choose to repeat the image on the x-axis, y-axis, or on both axis.

Background Size: You can select the size of the background image for the block from here.

Button Options

Choose to open the link in a new tab.

Button Size - Choose the size of the button as small, medium, large, or extra-large.

Button Shape - Choose the shape of the button as square, rounded square, or circular.

Border: The following settings are available in the border panel -

Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it

Border Thickness - You can set the thickness of the border from here.

Spacing options are also available to customize the button padding and margin separately for Vertical and Horizontal.

Under the Colors tab, color options are available for Background, Button, and Button Text.

Icon Settings

Select an icon to display on the button from here.

Select Position: You can display the icon after or before the text.

Icon Color - Select a color for the icon.

Icon Spacing - Increase or decrease the spacing between icon and text from here.

Spacing

Spacing tab offer options to customize the padding and margin separately for the block.

Advance Heading

With this block, you can customize your headings, add a sub-heading, use separator, align them left, right, or center and customize them completely.

General

Heading - You can display or hide the heading from here.

Sub-heading - You can display or hide the sub-heading from here.

Separator - You can display or hide the separator from here.

Heading tag - You can select the tag that you want to allot to the section title from H1 to H6.

Typography

Under the Typography tab, options for font size, font-weight, color, and line-height are available for Heading and Sub-Heading.

You can set responsive Heading font size for Mobile and Tablet view.

Separator

Style - You can select the style of the separator as solid, dotted, dashed, etc. You can also choose to hide it.

Thickness - You can give thickness to the separator from here.

Width - You can choose the width of the separator from here.

Color - You can choose the color of the separator from here.

Spacing

Spacing tab offer options to customize the spacing for Heading Bottom Spacing and Separator Bottom Spacing.

Content Timeline

Content Timeline allows displaying historical events with vertical timeline items. The block contains various customization options; you can add a title, description, icon, date to the timeline items.

General

Number of Items - You can select the total number of items to display in a grid.

Orientation for the icon and a post grid can be set to Center, Left, Right from Orientation.

Arrow Alignment can be set vertically top, bottom, or center with respect to timeline card.

Timeline Event

Heading tag - You can select the tag that you want to allot to the section title from H2 to H6.

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Padding - Space can be managed for the content of the grid from the Padding tab.

Date Settings

Display Date - Hide or Display the published date of the post.

Date Format - Select a format for the date.

Date Settings - A date can be set for individual timeline card. If the option ‘Display Post Date’ is set as ON, then add a date for each timeline card individually.

Connector Settings

Choose an icon for the connector from a number of options.

Icon Size - Increase or decrease the size of the icon from here.

Connector Width - Set the width of the connector line with this option.

Connector Color Settings - Under the Colors tab, color options are available for Line, Icon, Background, and Border.

Spacing

Spacing tab offer options to customize the horizontal and vertical spacing.

Typography

Under the Typography tab, options for font size, font-weight, and line-height are available for Date, Heading, and Content.

Colors

Under the Colors tab, color options are available for Date, Heading, and Content.

Image Slider

Image Slider blocks give you an option to display multiple images as a slider.

Image Carousel

Size - Select the size of the image as large or extra-large.

Radius - You can set the radius width of the corners of an image.

Heights in Pixels - Set a height for the image.

Thumbnails - Hide or display thumbnails of the images at the bottom.

Lightbox - Enable or disable the lightbox feature from here.

Arrow

Color: You can select a color for the arrow from here.

Background Color: Select a color for the background of the arrow from here.

Opacity: You can set opacity from here for the arrow.

Border Radius - You can give border-radius to the arrow from here.

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Border Width - Set a width for the border from here.

Border Color - You can give color to the border from here.

Slider Settings

Carousel tab offer options to customize the post slider. The options are –

  • Pause On Hover
  • Autoplay
  • Draggable
  • Free Scroll
  • Transition Speed (ms)
  • Dot Navigation
  • Arrow Navigation
  • Align Cells

Team Block

Team block allows displaying team members with a descriptive block. You can display a team with their name, pictures, designation, social links, etc.

General

Number of Cards - Increase or decrease the number of cards.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position etc.

Border Width - Set a width for the border from here.

Border Radius - You can give border-radius to the box from here.

Padding - You can give padding to the content from here.

Content

Here you can enable / disable the following elements of the block Image, Name, Designation, Description, Social icons

Image

Image Shape - Select the style of image as square, circle, or normal.

Image Size - Select a size for the image as full, medium, large, or thumbnail.

Image Width - Select the width for the image.

Typography

Under the Typography tab, options for font size, font-weight, color, and line-height are available for Title, Designation, Description, and Social Icon.

Spacing

Spacing tab offer options to customize the spacing for Title Bottom Spacing, Designation Bottom Spacing, Description Bottom Spacing, Inter Social Icon Spacing, Image Margin Top, and Image Margin Bottom.

Social Links URL

You can give URL to display social icons such as twitter, Facebook.

Color Settings

Under the Colors tab, color options are available for Title, Designation, Description, and Social Icon.

Expand More Block

This block allows you to add expand/show more block on your webpage.

General

Hide or Display Title of the block.

Typography

Under the Typography tab, options for font size, font-weight, and line-height are available for Title, Text, and Link.

Spacing

Spacing tab offer options to customize the spacing for Title, Text, and Link.

Color Settings

Under the Colors tab, color options are available for Title, Text, and Link.

Blockquote Block

This block allows you to add expand/show more block on your webpage.

General

Under the General tab, options for font size, font-weight, alignment, and line-height are available.

Quotation Mark

Hide or Display Quotation Mark of the block.

Choose an icon for a quotation mark from a number of options.

Size - Choose a size for the quote.

Quote Color - Select a color for the quote.

Horizontal Position: Increase or decrease the space to control quotation mark horizontally.

Vertical Position: Increase or decrease the space to control quotation mark vertically.

Background

You can select a background type for the block from here. The options available are:

  1. Color
  2. Gradient
  3. Image
  4. Video

Opacity: You can set opacity from here for the block.

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it

Border Radius - You can give border-radius to the box from here.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Spacing

Spacing tab offer options to customize the horizontal spacing and vertical spacing.

Color Settings

Under the Colors tab, color options are available for Text and Background.

Card Block

This block allows you to add cards to describe your product, service, or person.

General

Number of Cards - Increase or decrease the number of cards.

Image

You will get an option to upload an image for each card individually.

Image Settings

Size - Select a size for the image as full, medium, large, or thumbnail.

Image Position: You can select the position of the background image for the block from here. If you want to show the top left part of the image, select the position as left top. Similarly, choose the part of the image that you want to display from Left Top, Left Center, Left Bottom, Right Top, ..., Center Bottom, etc.

Image Repeat: You can choose to repeat the image on the x-axis, y-axis, or on both axis.

Image Size: You can select the size of the image as cover, auto, or contain from here.

Column Background

You can select a background type for the block from here. The options available are:

  1. Color
  2. Gradient
  3. Image

Typography

Under the Typography tab, options for font size and line-height are available for Title, Sub-title, or Content.

Button Settings

Choose to open the link in a new tab.

Button Size - Select a size for the image as small, medium, large, or extra-large.

Button Border
Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Border Width - Set a width for the border from here.

Rounded Corners - You can give border-radius to the box from here.

There are options to customize the button padding and margin separately for Vertical and Horizontal.

Under the Colors tab, color options are available for Button and Button Text.

Icon Settings

Select an icon to display on the button from here.

Icon Position: You can display the icon after or before the text.

Select a color for the icon.

Spacing

Spacing tab offer options to customize the spacing for Title, Sub-title, Content, and Block.

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it

Border Width - Set a width for the border from here.

Border Color - You can give color to the border from here.

Border Radius - You can give border-radius to the box from here.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position etc.

Spacing

Spacing tab offer options to customize the spacing for Title, Sub-title, content, and button.

Color Settings

Under the Colors tab, color options are available for Text and Background.

Pricing Block

This block allows you to add an attractive Pricing block. It allows adding item name, its image, description, and price.

General

Number of Pricing Tables - Increase or decrease the number of tables to display.

Gutter - Set space between the blocks with this setting.

Title - Hide or Display the title.

Price Prefix - Hide or Display prefix of the price.

Price - Hide or Display the price.

Price Suffix - Hide or Display the suffix of the price.

Sub Price - Hide or Display the sub-price.

Features - Hide or Display the features of the block.

Button - Hide or Display the button in the block.

Image

Image Shape - Select the style of image as square, circle, or normal.

Image Size - Select a size for the image as full, medium, large, or thumbnail.

Image Width - Select the width for the image.

Button Settings

Open in a new tab - Choose to open the link in a new tab.

Horizontal Padding: Set padding to increase the width of the button.

Vertical Padding: Set padding to increase the height of the button.

Column Background

You can choose a background type for tables from here. You can select an image, color, or gradient as the background from here.

Typography

Under the Typography tab, options for font size, font-weight, color, and line-height are available for Title, Amount, Features, and CTA.

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Border Width - Set a width for the border from here.

Border Color - You can give color to the border from here.

Border Radius - You can give border-radius to the box from here.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Color Settings

Under the Colors tab, color options are available for Text.

Shape Divider

This block allows you to add a shape divider to visually distinquish page sections.

Styles - You can select the style of the shape divider as Wavy, Hills, Waves, Angled, Sloped, Rounded, Triangle, Pointed

Divider Settings

Shape height in pixels: Increase or decrease the height of the shape

Background height in pixels: Increase or decrease the background height of the shape

Background Options

You can select a background type for the block from here. The options available are:

  • Color
  • Gradient

Shape Color - Select a color for the shape.

Video Popup

This block allows you to add a video in a popup on page.

Video URL : Here you add video url in .mp4 format or Paste a Youtube / Vimeo URL to show video in popup.

Container

Width - Increase or decrease the width of the video box.

Height - Increase or decrease the Height of the video box.

Background Options - Using this option you can set video cover image.

Play Button

Style - You can select the style of the play button as Normal Play Button, Play Button with Circle, Outline Play Button, Video Play Button.

Border - The following settings are available in the border panel

Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it

Border Radius - You can set border radious to popup box here.

Box Shadow - You can set box shadow to popup box here.