How to use the Drag and Drop Tools in your Website Content Pages

How To Add A Content Section On A Page

Part 1: Navigate To The Page

 

1. Login to TheWebConsole

2. From the left side menu click Manage Pages and choose Content Pages.

3. From the content page list either add a new page or edit an existing page.

Note: Information on how to Add a New Page and how to Edit an Existing Page can be found in more depth within separate knowledgebase articles.

 

Part 2: Adding A Section

 

1. Once the drag and drop editor has loaded you will be given the option to add different content modules into the page. All of these content modules first require a “Section” to be added. To add a section simply click the “Section” module, located on the top portion of the side menu, once clicked, drag the module into the page, you will notice a blue highlighted box appear on the page wherever it is possible to add a section.

Note: Your page can contain as many sections as required, correct use of sections can help you format your page and make content easily accessible for your users.

 

Part 3: Editing A Section

1. Once a section has been added onto a page, you will have the ability to edit the section's formatting. This can be done by hovering your mouse cursor over the section and clicking the edit button, the edit button appears as a pencil icon in the top right of the section.

2. Once the edit button has been clicked an edit window will appear, there are numerous options across multiple tabs, you can find an overview of the primary settings below:

  • Layout tab

    • Column Layout: this will allow you to choose the layout of your section, by breaking it down into different column options

    • Section Layout: this allows you to choose the width of both the background and content of the section

  • Section Style and Column Style tabs

    • Add background: this will allow you to choose a background colour or image for your section or a column within the section

    • Border: this will allow you to create a border around the section or columns within the section

    • Section Padding: this will allow you to add space between the section or columns within the section and other sections or columns

3. Once you have applied the section settings click the “Save” button to save the section changes and close the edit window. Your section will now be ready to add in content, the addition of content modules will be covered in depth within other knowledge base articles

4. Once you have added your section and applied the settings click the “Save” button located at the bottom of the side menu, this will save your page.

 

Note: These settings mentioned are the primary settings for section edits, there are further settings that you can tweak to your liking, that can be used alongside the above.

Note: Always remember to follow the final point and save the page itself, or the hard work you have done will not be applied.

 

 

 

Last Modified: 14 September 2022