Custom Content Section

Modified on Wed, 30 Dec, 2020 at 2:13 PM

When you need to create a custom section for a specific usage, the Custom Content section will help you with your job.

To create a new Custom Content, click Add Section > find Custom Content > Click Add button.


TABLE OF CONTENTS


1 - Settings

Layout

  • Boxed layout: Add a padding around the main wrapper. 
  • Section padding: Insert values in order of clockwise motion starting from Top padding.


Section heading

To modify the section heading & subheading.

  • You can add a Heading & Subheading for the Blog Post section or leave it blank.
  • Modify the text Alignment: Auto/ Left/ Right/ Center.
  • Choose Heading & Subheading colors with the color picker.


Layout content

To modify the content arrangement.

  • Column grid layout: Set the position for each content.
  • Item spacing: Add space between contents.


2 - Content

Paragraph

Used to add simple custom paragraphs.

  • Input your information in the Text 1 & Text 2 fields
  • Custom content
  • You can also add extra SVG contents by filling in the custom content section.


  • Button
  • To create a button, you need to fill in the Button label field then link it to another page with Button URL field.
  • Drag the bar and choose one from available button designs.
  • Block settings: General settings for the whole block
  • Vertical alignment: Let you adjust the position of the content in vertical direction.
  • Block padding: Add custom padding around the content wrapper.
  • Border: Enable top/ right/ bottom/ left border on different devices.


HTML

Used to add custom HTML content.

  • Insert the information in the HTML field.
  • Block settings: General settings for the whole block
  • Vertical alignment: Let you adjust the position of the content in vertical direction.
  • Block padding: Add custom padding around the content wrapper.
  • Border: Enable top/ right/ bottom/ left border on different devices.


Blog

Used to add custom Blog post

  • Firstly, you need to insert your blog posts. You can choose an available blog or create a new one.
  • Total items is the post quantity of the section.
  • Max number of content per row field is used to set the post quantity on one row.
  • Block settings: General settings for the whole block
  • Vertical alignment: Let you adjust the position of the content in vertical direction.
  • Block padding: Add custom padding around the content wrapper.
  • Border: Enable top/ right/ bottom/ left border on different devices.


Newsletter

To set your section display and newsletter storage.

  • Form type: Mailchimp or Klaviyo.
  • Form URL: Paste your form URL here.
  • Form style: Choose the displaying style for the text box.
  • Text 1 works like a heading and Text 2 is a subheading.
  • Insert the text you want for the button in the Button label box and adjust its design with the Button style bar.
  • Background settings
  • You can insert an image to set it as the section background.
  • With a bigger or smaller image, use the Background Image Fit field to adjust the image zoom.
  • Background image repeat field is used to repeat smaller image to fill the whole section.
  • When you're satisfied with the size, let's move on to the next step - choose the display position from the drop-down box.


  • Block settings: General settings for the whole block
  • Vertical alignment: Let you adjust the position of the content in vertical direction.
  • Block padding: Add custom padding around the content wrapper.
  • Border: Enable top/ right/ bottom/ left border on different devices.

Video

To add videos on your home page. If you want to bring your YouTube channel into your store, please check out this app for more advanced options.

  • Video URL: To get the link, go to Settings > Files > Upload files and choose your video. After the uploading process is done, copy the URL and paste here.


  • Image placeholder: Works as a video thumbnail and system will automatically adjust the video player to fit inserted image size. 
  • Button
  • To create a button, you need to fill in the Button label field.
  • Drag the bar and choose one from available button designs.
  • Block settings: General settings for the whole block
  • Vertical alignment: Let you adjust the position of the content in vertical direction.
  • Block padding: Add custom padding around the content wrapper.
  • Border: Enable top/ right/ bottom/ left border on different devices.


Note:

To apply for all content, bring the [+] ticket on top of the content section.
To apply for 1 specific content, drag and place it right down below that content.


[+] Style Paragraph

  • Apply to: Main content/ Sub content
  • The elements can be set for Text 1 & 2:
  • Font size & Font weight
  • Color
  • Margin
  • Line height


[+] Style Button

The elements can be set:

  • Font size & Font weight
  • Padding
  • Margin
  • Text & background color
  • Border width
  • Border color



How to insert values for your theme.

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article