Content blocks overview

Friday, January 7, 2022

Team Polaris

Content blocks overview

Content blocks are pieces, which helps you to produce modern and readable web pages for your club or district. They allow you to fill-in your text, place pictures, files, external videos, calendar events, member cards and other visuals and control. You can mix all types of content blocks on one page and design it by varying the content block order.

The layout of the content block is pre-defined, with limited possibility to adapt it.  Content blocks do not offer you the the full flexibility of an HTML editor, but ensure that your web-page will always look reasonable and will work also on tablets and smartphones. That's why all content blocks use the full width of the page.

In addition to the primary text and image, following content blocks are available:
  1. Title
  2. Text/HTML
  3. Image with text
  4. Single image
  5. Single file
  6. Separator
  7. Video
  8. Related Event
  9. File collection
  10. Image collection
  11. Related content
  12. Related project
  13. Folder
  14. Member
  15. Buttons
  16. Image map

More content blocks are yet under construction and will be available in the future Polaris releases.

The best possibility to learn more about content blocks is to try them out!

Create a new article and place content blocks of any type there to see how they look like, how they behave and how they suit your demands.

Content blocks on a multi-district page


Primary text and image

The primary image and text has a special meaning because the text and image are used for the various displays such as the list, the detailed pages and the carousel and slider.

The elements of this block are:

  • Primary text
    The first sentences may appear on many places, in calendar, in the invitation e-mail, in newsletter, in slider, etc.
  • Primary image 
    It will also appear in the slider or the carousel. If you do not provide an image the rotary logo will appear there. Line separator appears by default under the description.

There are no other options for this block.

You cannot delete this block but you can change its position in some articles!

Primary image and text of this page.

1. Title

Its purpose is to display one or several titles between the various blocks of a given article.

The title, in all languages of that article, is the one and only mandatory element of this block. Line separator appears by default under the title.

Title

2. Text/HTML

The text block is the most generic content block. The text, in all languages of that article, is the one and only mandatory element of this block.

Remember, that the text editor gives you the possibility to format the text and also to place small images into it.

Text

3. Image with text

The image with text allows you to place an image and a texte side by side on the page.

The elements of this block are:

  • Layout (mandatory) one of:
    • image left / text right
    • image right / text left
    • image left / text floating right
    • image right / text floating left
  • Image (mandatory): you can chose between large, medium and small images.
  • Description (optional) of the image in all languages of that article. Line separator appears by default under the description.
  • Text (mandatory) in all languages of that article.

image right / text left

4. Single Image

Allows you to put one image on the page. The image is aligned to the left page boarder and will keep the original size as long as it does not exceed the 1280 x 1024 px size.

Description (optional) in all languages of that article, is the the only element of this block. Line separator appears by default under the description.

Single image

5. Single file

Single file allows you to attach one file to the page. The icon shows the type of the file. If you upload an image, it will be shown as uploaded file, not as an image.

Description (mandatory) in all languages of that article, is the the only element of this block.

Two line separators appear by default before and after the file.

Single file

6. Separator

A Separator is the line between two content blocks. You can define it's length as xs, s, m, l, xl.

Separator

8. Video

Allows you to place a link to a video. The video player will appear and will allow the user to play the video directly from the page.

The elements of this block are:

  • Description (optional) of the video in all languages of that article. A line separator appears by default under the description.
  • URL to the video (mandatory) 

Attention: Depending on the format of the video and the compatibility of the player with the user browser, some problems may occur.

Video

8. Related Event

Allows you to insert an advertising block for an existing event.

In order to select the existing events of your club you must type at least 3 characters in order to display the available ones. Only events of your club are presented.

Attention: take care of visibility of the event and the page on which you put this block.


Event

9. File collection

Allows you to attach multiple files to the page. The icon shows the type of the file. Each file must be uploaded separately. If you upload an image, it will be shown as uploaded file, not as an image.

Description (mandatory) in all languages of that article, must be provided for each file.

Line separator appears by default between each file.

File collection

10. Image collection

Allows you to show a small image gallery on to the page. The images are placed left to right, then top down. Each image must be uploaded separately.

Description (mandatory) in all languages of that article, must be provided for each image.

Line separator appears by default under each image description.

Image collection

11 + 12. Related content | Related project

Allows you to insert an advertising block (News, Various, Project) for another content of the site.

In order to select the existing contents of your club you must type at least 3 characters in order to display the available ones. Only contents of your club are presented.

Attention: take care of visibility of the content and the page on which you put this block.

Related content | Related project

13. Folder

Allows you to place a document folder and its documents as links.

You must first type at least 3 characters before you see the list of the available folders. Only folders of your club are presented.

The user may click on the folder as well as on the documents.

Attention: take care of visibility of the folder and the page on which you put this block.

Folder

14. Member

Allows you to insert the card of a given rotary member.

You must first type at least 3 characters before you see the list of the available members. Only active members of your club are presented.

Attention: take care of  personal data protection. For this reason, no example is provided. Try it yourself!

Member

15. Button

Allows you to put one or more buttons on the page. 

The elements of this block are:

  • Layout - you can chose one of:
    • Button blue - full size
    • Button blue - original size (text size)
    • Button yellow - full size
    • Button yellow - original size (text size)
  • Open in new window
  • Title of the button in all languages of that article.
  • URL of the button in all languages of that article.

Multiple buttons are placed left to right and then top down.

Buttons

16. Image map

Allows you to display a clickable image map .

The elements of this block are:

  • Image (mandatory)
  • One or more areas consisting of: 
    • Link (URL)
    • Coordinates separated with commas
    • Shape (poly-gonal, rect-angular, circle)
    • Target (_blank = open in new tab or window)


Tip: Use the tool on https://www.image-map.net/ or https://eapatil.github.io/Tool to create the coordinates and test the image map.

Image map