✓ In this article, we'll take you step-by-step through the process of editing a creation.
Once you've imported a pre-configured creation into the Kehio Editor application, all that's left to do is customize it and modify its textual and graphic elements to suit your shopify online store.
ℹ️ Notice: In this article, we won't go into the detailed editing of creations, as each creation is unique but works on the same principle thanks to our item-based architecture that makes up the blocks. This article is designed to help you find your way around an imported creation, so that you understand where the elements to be modified are located. You'll learn how to identify the different parts of the creation so you can make the necessary adjustments to suit your specific needs.
Block or section :
When you choose to import a creation, we advise you to modify only the textual and graphic content, as this creation has been optimized for all media. That's why, when you first decide to import a creation, we recommend that you don't change its main function. For example, if the creation is designed as a full-page section, we suggest you use it exclusively as such. Similarly, if it's a creation optimized for the product block, it's best to use it only for this type of block.
Step 1 : Check the style
Once you've imported your creation into the application, the first thing to check is the style of the creation to make sure you've imported the right one and that it's set up with the appropriate style. This initial check allows you to confirm that the appearance and configuration match your expectations before making any further modifications.
Step 2 : Visualize
You can visualize what your creation will look like once it has been integrated into your site. Selecting the right view is essential for setting up your creation correctly. This ensures that you compose correctly, whether for a product block, a left or right block or a full-page section. When importing our pre-configured creations, we recommend that you leave the initial view unchanged, as it is optimized precisely for the type of view you are viewing.
Step 3 : Number of blocks
Whether you're importing an accordion, a tab or a grid block, it's important first to check how many blocks make up the creation. You can view this from the left-hand side of the Kehio Editor interface. This approach will help you understand how the creation is structured and ensure that you don't forget any blocks when editing. This allows you to manage every element of your creation with the utmost precision.
Step 4 : Visualizing content
In your imported creation, each block is made up of different contents. As with blocks, it's important that you visualize the type of items that make up each content item. This will enable you to identify them clearly, and then modify and adapt them to your needs.
Step 5 : Modifying items
The background preview in the Kehio Editor preview is purely indicative, allowing you to visualize the color to make it easier to work on your creation live. However, if you wish to add an actual border or a definitive background to your creation, these modifications will have to be made directly from the theme editor of your Shopify store. This approach ensures that all appearance changes are properly integrated into the overall design of your site.
📖 If you'd like to learn more about items, we recommend you read this article.
Step 6: Adding a background color
When you import a creation, if it has a background color, it will appear in the Kehio Editor preview as an indication. The background color preview in Kehio Editor allows you to visualize the color to make it easier to work on your creation live. However, if you wish to add or modify the background color of your creation, these changes will have to be made directly from the theme editor of your Shopify store.
Here's how to do it:
1- Copy the color: If you wish to keep the same background color as the design imported from our demo stores:
Click on the background color and copy the hexadecimal value of the color.
2- Access the Shopify theme editor :
Go to the theme editor of your Shopify store.
3- Apply the color in the theme editor :
Select the section of your creation in the theme editor.
Paste the color into its corresponding field.
From the editor, you can also create a color gradient for the background.
Step 7: Adding an SVG border :
1 .For creation in Kehio Editor:
Click on "Add a block" and select the "SVG Border" application extension.
For a standard section in your theme:
Click on "Add a section" and select the "SVG Border" application extension.
Move this section above or below your section.
Edit your SVG border
In the SVG Border panel, you can customize your border according to your preferences:
Select a default template or import a custom border :
You can choose from one of the default templates or import a custom border from our demo stores or one of your own.
Adjust border width :
Adjust the border width for a perfect visual fit on computer, mobile and tablet.
Adjust border height :
Change the height of the border to fit correctly on computer, mobile and tablet.
Adjust border to fit inside your section :
Choose whether your border should intersect the inside of your section for a better fit, especially for default sections like your theme banner.
Animate your border:
Enable the animation of your border and adjust the speed of this animation according to your preferences.
If you need help editing your creation, feel free to contact our support team at any time by e-mail or live chat .