Editing Content on a Webpage

Editing Content on a Webpage

Website Design Widgets

In order to customize the content for a page you must first select the page from the “Pages” tab on the left hand side.  A page is essentially a series of rows, called “columns,” that contain content.

A column can have 1 - 6 sections, aligned horizontally.  Within a column you can place a wide range of content and/or widgets, including text, videos, images, buttons, products, designs, and more.

A column can also be placed within another column, which helps to organize the content in a way that translates well to mobile device screens.  The columns dictate how content is seen on tablets and smartphones, so you must organize them properly for your website to be functional across all device types.

1. Add a Column

To add a column, go to the “Widgets” panel on the left hand side and find “1 Column.” Click on and drag it to the place on the page where you want it to be located.

2. Configure Column Settings

Once you have added the column, you can set how many sections you want to be in the row (you can also start by selecting “2 Column” or “3 Columns” in the “Widgets” panel).  You have the ability to add a border, shadow, padding, an entrance animation, and even control if & how it will appear on certain devices.

3. Drag Content Widget onto Column

Once you have placed the column on the page and configured it to your liking, you will then want to go back to the “Widgets” panel and drag your desired content widget to the column.

The most common widgets you will use are likely:

Page Title

Heading

Text

Button

Image

Video

Blank Product Listing / Categories

Decorated Product Listing / Categories

Design Listing / Categories

4. Configure Content Widget

Once a widget has been added to the page, you will need to configure it.  Each widget has different features/variables that must be configured, but all widgets come with responsive behavior settings and a similar layout to columns.

Tips:

- Add a Hover Effect to buttons, product links, & image links

- Add Shadows around images, videos, & buttons

- Make Designs/Products 250-300 pixels in width for easier visibility

- Clone Columns to act as templates & paste in footer to copy to other pages