To start creating a website you will need to start by creating the "Pages". Once you have the initial pages you want, you will move to the "Website".
Creating Website Pages:
Click on “Pages” on far left
Go to "Web Pages on the top menu.
Click on “New Page"
Create a title, slug, and choose your format.
Click “create”
You can then edit just as you would with any page. Refer to “Web Pages” Video below to learn how to use the toolbar features to edit.
Once you have your page created, you will want to start making the page your own by adding design elements. You will want to start by clicking on the Plus sign.
Watch the video to learn how to add the design elements.
Plus Sign Definition of Icons:
- When you are editing a webpage, you will notice that there is a plus sign on your top toolbar that includes a large number of features. Here we will go through those features.
 | Clicking this button allows you to insert a paragraph textbox |
| Clicking this button will allow you to insert an image. Upon clicking it, you will be prompted to either paste an image url, upload a new image from your computer, or select an image from your gallery. |
| By selecting this button, you will be prompted to embed a code to insert something like a Facebook timeline or a form onto your page or a url to embed a Vimeo or Youtube video. |
| This button will immediately insert a horizontal line onto your page that you can use to break up your format and transition into another section. |
| This button will insert a table onto your webpage that automatically includes 2 columns and 3 rows, with one dedicated to headings. When you are editing this feature, you will notice that a table button replaces the plus sign on your toolbar. By clicking this table button, you can add and remove columns and rows |
| By clicking this button, you will have access to 16 different templates. Once you select one, you can edit the pictures and text. This may make large website edits very simple, especially if one of the templates is what you had in mind for your new changes. |
| By clicking this button, a quote format will be entered onto your webpage. This will allow you to easily feature a quote on your page without having to restructure alignments and font sizes. |
| The grid button makes it easy for you to create side by side templates on your webpage. You will see that there are different sizes for these side by sides and they range from 1 to 4 columns. |
| The layer button essentially creates a separate box that you can layer above or below an already existing image or text box. |
| Inserting a card give you a small card like template that includes an image, title, date, text, and button. You can add, delete, and edit anything within this card. |
| The carousel button allows you to create a small slideshow of pictures on your webpage. Upon inserting a carousel, you will be prompted to select pictures that you would like to include. The process for this will be similar to that of inserting a single image through the image button. |
Block toolbar options:
| This tool will move the text box up on the page. If there is another element directly above the text box, it will move the text box above it |
| This tool will move the text box down on the page. If there is another element directly below the text box, it will move the text box below it. |
| This tool will delete the text box entirely. |
| This tool will duplicate the text box and its contents. |
| This tool will show you the HTML Script of your text box. |
Text Boxes:
To start editing a text box on a web page, you are first going to click on “Pages” on the far left toolbar and then click “Web Pages” on the top toolbar.
Next, select your text box by clicking on it. Remember that a text box and a header box will be different. A text box is one that you use to write paragraphs/information in smaller text rather than a large headline for your page.
Once you click on the text box, you will see two different sets of tools to use: one on the left side of the text box where you will see 5 options, and one on the top toolbar where you have 16 options.
| This tool will give you access to tools such as snippets, images, tables, etc… You can refer to the specialized training for this feature. |
| This tool will undo. |
| This tool will redo. |
| This is the text size format tool. It will allow you to change the size of your text. |
| This is the alignment tool. You can center, left align, right align, and justify your text using this tool. |
| This tool will bold your text. Highlight the text you would like to bold and then click this button. To un-bold text, highlight it and click this button again. |
| This tool will italicize your text. Highlight the text you would like to italicize and then click this button. To un-italicize text, highlight it and click this button again. |
| This tool will link text for you. To use it, highlight the text you would like to link, click this button, click “link”, and then insert the url in the “URL” line. If you would like this to be opened in a new tab, check the box at the bottom. Click “Insert” to save. |
| This tool will help you insert a button. This can be used easily with the link tool. To use the button tool, highlight the text that you would like to turn into a button. Choose the button style you prefer and you will see your text turn into a button. To link your button, click somewhere within the button and then click the link tool. Here you can edit the text within the button and the URL. Click “Save” to save your changes. |
| This is the icon tool. Click on it and choose from a wide variety of icons to insert within your text. |
| This is the box styles tool. If you click on it, you will see that you are able to change the width of your textbook. |
| Here you will find a large group of special characters that may not be on your keyboard. You can use these to insert special characters within your text. |
| This tool is called text formatting. When you click on it, you will get a large drop-down menu of different styles of text. Some examples include shadowed text, emphasized text, underlined text, etc… This will help you change fonts and other text styles to diversify your website. |
| This tool helps to change the weight of your fonts. It has a range of super thin and light next to very thick and dark text. This is essentially a more intricate version of bolding your text.
|
| This tool allows you to change the margins and padding of your text box. When you click on it, you will see a visual guide to where the margins lay and where to padding lays. You can change the top, left, right, and bottom space on both the margins and the padding. When done, click “Apply” to apply your changes. |
| This tool helps you change the colors. The available colors on this tool will be altered to your theme colors. When you click on it, you will see that there are three different categories within this tool. First, you can change the color of the text itself. Second, you can change the color of the background. Last, you can change the color of the border which creates a colored box around your text without filling it in with a background color. |