To connect the template you purchased in Webflow to your hosted website project, follow these steps:
1. Create a new project in your Webflow account. This will be where you will modify the template.
2. In your new project, go to the Dashboard and click on the "Import" button.
3. Select the option to import from a template and choose the template you purchased. Webflow will import all the assets and styles into your new project.
4. Once the template is imported, you can start customizing it to fit your needs. You can modify the layout, colors, typography, and content using the Webflow Designer or Editor.
To work on modifying the template without it being visible to the public, you have a few options:
1. Password-protect your webflow.io subdomain: By default, Webflow provides you with a subdomain (yourproject.webflow.io) where you can preview your website. You can password-protect this subdomain to prevent public access. To do this, go to your Project Settings, then the Hosting tab, and enable password protection. You can set a password that you can share with stakeholders who should have access to view the site.
2. Enable draft mode in the Editor: If you're using the Webflow Editor to make modifications, you can work in draft mode. This allows you to make changes to your live website without affecting the public-facing version. To enable draft mode, go to the Editor settings for your project and turn on the "Enable drafts" option. Once draft mode is enabled, you can make changes in the Editor without them being visible to the public until you publish them.
3. Use staging environments: If you have a Webflow Team or Enterprise plan, you can make use of staging environments. Staging environments are separate copies of your project where you can experiment with changes without affecting the live site. You can create a staging environment, modify the template there, review the changes, and then publish them to the live site when you're ready.
Remember to thoroughly test your modifications and gather feedback before publishing your changes to ensure a smooth transition for your live website.