Skip to main content
All CollectionsKehio EditorCreationItems
Understanding and using the "Divider" item
Understanding and using the "Divider" item
Updated over a week ago

In this article, we'll look at how to use the "Divider" item when starting a creation from scratch, and how to modify it if you import it from one of our pre-configured creations.

Adding a Divider to your creation from scratch

To integrate a Divider into your project in Kehio Editor, follow these simple steps to visually structure and organize your content.

Step 1 : Open the Content panel

Start by accessing the left-hand panel of your Kehio Editor. Select or add Content. When you open this panel, it will display a "Text " item by default.

Step 2 : Adding a Divider

To insert a Divider, click on "Add Item ". Scroll through the available options until you find the choice "Divider " and select it. The Divider acts as a visual element that helps separate the different sections or contents of your page, improving organization and readability.

Step 3 : Customize the Divider

Once added, you can customize the appearance of the Divider, such as its color, thickness and alignment on computer or mobile, using the parameters available in the editor. This customization allows you to align the Divider's style with your site's overall design.


Using a custom divider

With Kehio Editor, you can also import custom dividers from our predefined creations. These dividers can then be modified to better suit your design with the SVG Color tool, enabling color adjustment to suit your specific needs.

Importing and customizing Divider :

  1. Select a divider: choose a custom divider from one of our creations

  2. Change color: Use the SVG Color tool to adjust the divider's color to match your site's color palette.

  3. Import your own Divider : If you have web design skills, you can also create and import your own dividers. This allows you to design unique elements that reflect your visual identity and add a professional touch to your Shopify pages.

  4. Kehio Editor integration: Once your custom or imported divider is ready, import it into your Shopify store's file library. Then copy the link and paste it into Kehio Editor. You can adjust the size and alignment of the divider, just as you would with the default divider.

Adding custom dividers is a great way to enhance the visual impact of your pages while maintaining consistency with the overall design of your site. This feature not only enriches the appearance of your pages, but also enhances the user experience by clearly structuring content.



Edit Divider color with SVG color

When you import a creation and want to keep the Divider but change its color, you can use the free SVG Color tool.

Here's how to change the color of your cover image:

Steps to change the color:

  1. Copy the URL of the cover image: Access the Kehio Editor interface and copy the SVG URL of the Divider you wish to modify.

  2. Access the SVG Color tool: Go to SVG Color.

  3. Paste SVG URL: In the tool, paste the SVG URL and click on "Load SVG".

  4. Change color: Once your SVG is displayed, you can change the colors to match your graphic identity.

  5. Download cover image: After modification, download the modified SVG and import it into your Shopify store files.

  6. Embed modified cover image: Retrieve the link to the uploaded cover image and paste it into Kehio Editor to update the cover image in your creation.

This method lets you customize the Divider to match your visual identity, while benefiting from the flexibility offered by the SVG format for precise, high-quality modifications.

If you need help understanding or modifying Divider items, feel free to contact our support team at any time by e-mail or live chat .

Did this answer your question?