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

How to add Blockquotes to your blog

Navigate to the Blog Editor

1. Login to TheWebConsole

2. From the left side menu click Blog and choose Blog posts.

3. From the blog post list either "Add Post" or click "Edit" on the desired blog.

Note: Information on How to Add or Edit a Blog can be found in more depth within separate knowledgebase articles.

 

Adding a Blockquote

1. Once the blog editor has loaded you will be given the option to add different content modules to the page. Click and drag the “Grid” content module into the page, you will notice a blue highlighted box appear on the page wherever it is possible to add the module.

 

Editing the Blockquote

1. Once the blockquote has been added onto a page, you will have the ability to edit the blockquote's formatting. This can be done by clicking the blockquote module on the page 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 the edit window will appear, there are numerous options across multiple tabs, you can find an overview of the primary settings below:

  • Quote

    • Quote: Here is where you will at the quoted text.

    • Author: This is where you can add the author that this quote originated from.

    • Source: This will allow you to name the source of the quote.

    • Source URL: This will allow you to link the original URL where this quote came from.

    • Layout: This will allow you to either have the quote Left Aligned or Right Aligned.

    • Container Class: This area allows our designers to add custom styling to the quote.

  • Default

    • Container: This will allow you to choose styles to apply to the quote.

              - Border: This will allow you to create a border around the quote.

              - Padding: This will allow you to add space between the quotes.

              - Margin: This will allow you to add margins between the quotes.

              - Background: This will allow you to choose if a background will be displayed within the quote.

              - Background Color: This will allow you to choose a background color or image for your quote.

    • Quote: This will allow you to choose the styles to apply to the quote.

              - Text Color: Allows you to change the color of the quote.

              - Font Family: This will allow you to change the font type from the default font of your site.

              - Font Size: Allows you to increase or decrease the size of the quote from the default.

              - Line Height: Allows you to choose the size of the space between lines of text.

              - Word Break: This property sets whether line breaks appear wherever the text would otherwise overflow its content box.

              - Border: Allows you to apply and style a border to sit around your heading text

    • Author: This will allow you to choose the styles to apply to the Author.

              - Text Color: Allows you to change the color of the quote.

              - Font Style: This will allow you to change the font style.

              - Font Weight: Allows you to increase or decrease the weight of the font.

              - Font Family: This will allow you to change the font type from the default font of your site.

              - Font Size: Allows you to increase or decrease the size of the quote from the default.

              - Line Height: Allows you to choose the size of the space between lines of text.

    • Source: This will allow you to choose the styles to apply to the source.

              - Text Color: Allows you to change the color of the quote.

              - Font Style: This will allow you to change the font style.

              - Font Weight: Allows you to increase or decrease the weight of the font.

              - Font Family: This will allow you to change the font type from the default font of your site.

              - Font Size: Allows you to increase or decrease the size of the quote from the default.

              - Line Height: Allows you to choose the size of the space between lines of text.

3. Once you have applied the section settings click the “Save” button to save the Blockquote changes and close the edit window.

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: 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 2023
In This Article