Launch a Website from Scratch

Starting with a blank canvas for your website might seem daunting, but our CRM makes the process straightforward. This guide will walk you through creating and publishing a complete website from the ground up.

Preparation and Planning

Before you begin building, a little planning will make the entire process smoother and lead to a more effective final product.

Define Your Website's Purpose and Audience:

• Purpose: What is the main goal? Is it to generate leads, sell products, share information, or book appointments? This will guide your design.
• Audience: Who are you trying to reach? Understanding their needs helps you create content that resonates.

Outline Your Content and Structure:

• Pages: List the pages you need. A typical business site includes a Home, About, Services, and Contact page.
• Content: Decide what key information and calls-to-action (like "Contact Us" or "Buy Now") belong on each page.
• Assets: Gather your logo, brand colors, images, and any written content you plan to use.

Create a Blank Website

To get started, navigate to Sites > Websites in your CRM dashboard. Click the New Website button and select the From Blank option. Then, click Create.

You will then be prompted to add your first page. Give it a name, such as "Home," and click Create New Page.

Build the Home Page

On the page creation screen, click Create From Blank to open the website builder.

Understanding the Builder Interface:

• Top Control Panel: Manages what is displayed in the Left Panel, such as elements and pages.
• Device Switcher: Allows you to toggle between desktop and mobile views to ensure your site looks good on all devices.
• Meta Controls: Include options for undo, redo, preview, save, and publish.
• Left Panel: Contains the elements and page settings you can add to your site.
• Center Panel: This is the live, editable preview of your webpage.
• Right Panel: Displays styling and configuration options for whatever element, row, or section you have selected.

Adding Content to Your Home Page:

1. Add a Section: In the center panel, or by clicking the + (Add Element/Section) icon in the Left Panel, choose Sections. Select a section width, like Full Width.
2. Add a Row: Inside the new section, drag to add a Row and select a 1 Column layout.
3. Add a Headline: Inside the row, click Add Element. Drag a Headline element into place. Click the text to edit it (e.g., "Welcome to Our Business"). Use the Right Panel to adjust the font, size, and color.
4. Add a Sub-Headline: Click + Add Element again and drag a Sub-Headline below the main headline. Edit the text and style it to complement the headline.
5. Add a Button: Add a Button element below the sub-headline. Edit the button text to something like "Contact Us Today." In the button's settings in the Right Panel, scroll to Button Actions, select an action like Call or Link to Page, and configure it appropriately.
6. Continue adding sections, rows, and elements to build out the rest of your homepage. Remember to click the Save icon periodically.

Add More Pages

To add additional pages, navigate back to Sites > Websites and click on your website's name to view its details. Click the Add New Page button. Name the new page (e.g., "About Us") and click Create New Page. On the next screen, click Create From Blank and build the page using the same method as your homepage. Add elements like text blocks and images. Click Save and then the Back button when you are finished.

Add Navigation

A website needs a way for visitors to move between pages. You'll add this using a navigation menu and footer.

1. From your website's details page (Sites > Websites > [Your Website Name]), click Edit on your Home page.
2. At the very top of the page, above all other content, add a new Full Width section.
3. Inside this new top section, add a 1 Column row, and then drag the Navigation Menu element into it.
4. Click on the navigation menu. In the Right Panel, you can configure the menu links to point to the correct pages and add your logo.
5. Next, scroll to the very bottom of the page and add another new Full Width section.
6. In the Left Panel, navigate to Elements > Prebuilt Elements > Footer and drag a footer into this bottom section.
7. Select the footer element and use the Right Panel to edit its content, such as copyright information and links. Click Save and then Back when you are done.

Previewing, Settings, and Publishing

Before you go live, always preview your site.

• From your website's details page, click the preview page button (typically an icon of a box with an arrow).
• If you are in the page builder, click the preview button (an eyeball icon).
• Use the Device Switcher (the mobile phone icon) in the builder to preview how your site looks on mobile devices. Adjust element sizes and layouts in the editor until everything displays correctly on both desktop and mobile.
• Once you are satisfied with the preview, you can publish your website from the builder's top controls or the website details page.