All Collections
FAQ
How to customize a website template
How to customize a website template

Learn how to customize any website template

Updated over a week ago

Personalizing Zyro website templates is easy and enjoyable! Simply go to the Websites page, find your site and click Edit:

Customization possibilities

Customize colors

You can customize colors in two ways: globally and locally.


Change fonts

Just like colors, you can customize text styles in two ways: globally and locally.

Learn more:


Add new items: pages, sections, elements

You can add an unlimited number of pages, sections, and elements to your website.


Customize button elements: styles and linking options

Click on a button element and select Edit button to open its settings. There are two tabs of them (General and Style):

General

Style

Rename your button

Choose between the primary and secondary button style

Set up linking options: you can link a button to a specific page or section within your website, any URL, phone number, email address, or file

Change button color (+ hover color)

Change button text color (+ hover color)

Change button shape


Edit the website's navigation menu

The navigation menu, also called the header section, is the topmost section of your website. The header can also contain a logo.

To edit the navigation menu, click on the header and you'll see the settings menu on the bottom-right side of the header section:

NOTE: If you can't see the header section, it's likely that all your website pages are hidden from the navigation menu


Copy-paste sections and elements

To speed up the website building process, you can copy-paste elements and sections to other sections or even other pages of your website:


Duplicate pages, sections, elements

To save up some time, you can duplicate website pages, sections, and elements.

  • To duplicate a page, follow these steps: How to duplicate website pages

  • To duplicate a section, click on it and hit the Duplicate button on the right:

  • To duplicate an element, click on it and hit the Duplicate button:


Remove unnecessary content: delete pages, sections, element

You can easily delete irrelevant content from your website.

  • To delete website pages, follow these steps: How to delete a website page?

  • To delete a section, click on it and hit the Delete button on the right:

  • To delete an element, click on it, and hit the Delete button:


Add custom HTML code

There are two ways to add HTML code to your website, and it depends on the type of code you want to add.

If the code needs to be added to the <head></head> part of your website's source code, use the Custom code field in your website's integration settings.

If the code needs to be added to the <body></body> part of your website's source code, use the embed code element.


Customize the mobile version of your website

Make sure that the mobile version of your website looks good: switch to the mobile view by clicking on the mobile phone icon in the upper toolbar:

By default, website elements are displayed on the mobile view in the order they've been added to the desktop view. Even if you, later on, reorder elements on the desktop view, these changes are not automatically applied to the mobile view. You can sort the elements on the mobile view manually. This way, you can lay out elements differently on desktop and mobile views. Learn more: How to edit the mobile version of a website?


Add a blog

You can add a blog to any website template! Simply expand the Blog panel on the left and click Start a blog:


Add a store to any website template

With our Business plan, you can easily add an e-store to any website template: learn how to sell online!

Did this answer your question?