Creating custom templates & sections for Instant Site
Ecwid provides a variety of pre-designed Instant Site templates that you can customize to your liking. With the built-in editor, you can adjust the content and design of the template, as well as add more sections, to create a competitive website for your business.
If the default Instant Site templates and sections don’t meet your brand's unique needs, you can code new, custom templates or sections. This requires programming skills, particularly in TypeScript and the Vue framework. You can do the coding yourself, hire a developer, or order help from Ecwid’s customization team.
Introducing custom templates for your Instant Site
Custom templates allow you to craft a unique online presence that will stand out and work seamlessly for both you and your customers. Eye-catching designs tailored to a brand's specific needs, advanced integrations, interactive elements — you’re only limited by your developer’s skills and your budget.
Compared to default templates offered by Ecwid, your custom template could include:
- Complex artisan layouts to create a memorable user experience and ensure a perfect match with your brand’s visual identity;
- Custom functionality like built-in booking or contact widgets to improve customer engagement and retention;
- Integrations with third-party services you use to run your business the way you like.
Each template is, in fact, a cohesive, fully functional list of website building blocks called “sections" that determine the overall style, content, and features of your website.
After your custom template is ready, you install it by going to Website → Edit Site → Settings → Templates, as you do with the default templates. You can then edit it however you like in the site editor: change its content and design, add pages and sections.
See development guidelines for Instant Site templates →
Introducing custom sections for your Instant Site
Sections are reusable building blocks of your Instant Site. You add individual sections like Cover&Headline, Contacts, or Delivery Info to your homepage and to other site pages to shape the web presence you desire. Custom sections allow you to enhance your website with advanced designs or functionalities.
Here’s just a couple of examples of how you could use custom site sections:
- Craft a very specific design piece, such as an image carousel with unique features to display your products or a sale banner with a distinctive layout;
- Add a booking widget to your website so that customers can easily schedule time with you and reserve your services;
- Add a custom contact form to make it easier for customers to get in touch with you;
- Enhance your website with any other custom functionality. For example, ski or surf stores can add weather, wind maps, or cameras to show current conditions.
After your custom section is ready, you can install it by going to Website → Edit Site → Add Section, as you do with the default sections. You can then change its content and design in the site editor based on the content and design settings defined by your developer.