Getting Started

Welcome to Responsible

My goal is to help you win customers online by building an effective and outstanding website. In this Starting guide I put together customisation steps to save you some time and make the process easier. And if you have any problems, you can reach me by sending an email to olga@zerocodegirl.com or you can check my website zerocodegirl.com for more information.

1

Styleguide Page

After you have your real products updated. The best way to make this template look like your brand is to customise colours and fonts. You need to go to the page "Styleguide" and update all the elements there.To change the colour scheme across the whole website you need to update all the Global Colours by selecting them and editing them. To change all the text styles, make sure that all the font tags including "Body (All Pages), All H1 Headings, All H2 Headings etc are updated.

2

Images Optimisation

Before uploading product photos and images on the website make sure they all are properly resized and optimised. You can use the tinypng.com to reduce the size of your .PNG and .JPG images. The better way is to use .JPG format instead of .PNG whenever it is possible.

3

Categories & Products  

The best way to start making this website your own is to update default products with your real products. To do so you need to select the Ecommerce tab on the left and update each product one by one or use the template to update all products at ones. Before uploading product images make sure they are not overly big and optimised. We'll talk about image optimisation below. You can learn more about Webflow Ecommerce on Webflow University Ecommerce course.

4

CMS Content

The best way to update blog posts is to go inside the CMS tab on the left and edit each blog post manually or you can use the template same way as with Ecommerce items. You can learn more about Webflow CMS in the CMS & dynamic content course.

5

Website Content

After you website is updated with your own products, colours and fonts it's the time to update texts and images. You can do it though the Designer mode or though the Editor mode.

6

Instagram

This template does not include built-in functionality for automatically displaying Instagram photos. Please have a look at how you can display your Instagram posts:
1. You can connect Instagram with third party plugins. For example, Elfsight Instagram Feed Plugin.
2. You can display Instagram posts using Instagram oEmbed.
3. Or you can just simply upload photos manually and link them to your Instagram account.

7

Website Settings

When your website's Look & feel is in on point and your content is in place. It's the time to launch your new online store. Make sure you've updated your SEO Settings, Open Graph settings, favicon, email to receive notifications about form submissions, connected your custom domain and Google Analytics. To enable your Ecommerce website you will need to follow the Ecommerce setup guide.