CC Creator - Section
Sections are the basic component that can be added to a page.Within the sections you can add rows (which can have 1 or several columns).
The rest of the elements and components (texts, images, videos...) will be added inside the rows and columns.
Each editing mode allows you to perform different actions with the sections:
- Add sections
- Duplicate or delete sections
- Modify session properties
- Add rows within sections.
- Add other components.
- Move components out of position.
When using the Easy edit mode, the only thing you can add within a page are new sections. If you move the mouse pointer over the page you will see that some elements are highlighted with a blue label. These elements are the sections.
And associated to the sections you will see two + buttons that allow you to add a new section, before or after the selected section.
You can add the sections that have been predefined for the theme.
Within the sections you will find texts, audios, videos, images and other elements that you can configure by clicking on them.
Duplicate or delete sections
To configure a section, you must first select it. You have two ways to do this:
- If you move the mouse pointer over the page you will see that some elements are highlighted with a blue label. These elements are the sections. Simply click on their label to select the section.
- Using the breadcrumb trail.
Once you have selected a section, you can duplicate or delete it from its label.
Modify section properties
To set up the properties of a section, you must have it selected. When you place the mouse pointer over a section you can click on its blue label. Click on it to select the section.
The properties that you can set up in a section are:
- Its title. It will be useful to customize it to recognize the section from the breadcrumb trail.
- Its identifier. This is an auto-generated data by the system, but you can customize it. If you customize it you will help the trace that sends the unit to the platform to be clearer (it is not the same for the content to send to the platform that "student1 interacted 29cb85cfg44", than to send, for example, that "student1 interacted page1"). Remember that the Identifiers must be different, you cannot repeat any identifier of any element within the unit, so you must be careful when modifying them and not repeat them.
- Its background image. In some sections, only if the designer who created the theme has allowed it, you will be able to remove or replace the background image for the section.
Add rows within sections.
With the Professional editing mode you can manage the rows within the sections. When you move the mouse pointer over the sections, the rows are also displayed, which are labeled orange.
New rows and other components can be added by clicking on the + button in the lower left-hand corner.
By pressing the + button you can add rows or other components.
You will be able to add the type of rows that have been added to the topic.
To add a row you can:
- Have previously selected a row or a section of the screen. If you click on the row style you want to add, it will be added directly below the selected row (or within the selected section).
- Select it and drag it to the screen. When doing so, move the mouse pointer around the screen until the area where you want to add it lights up yellow.
To learn how to set up the rows and their columns, see this article.
Add other components.
With the Professional editing mode you can add any additional components you may need on the screen. Imagine you have two images but you need a third one. Or you want to add additional text.
To do so, you have the + button located in the lower left area.
For each component you will have different templates, according to the characteristics of the theme that have been configured.
Remember that any component you add will always be inside a row, so you have two ways to add a new component (text, audio, video, image...):
- Select on the screen some already existing element (a row, a text, an image...). Then, simply add the desired component by clicking on it. It will be added below the selected element (or as the last element of the row).
- Drag the component to the screen. By moving the mouse pointer over the elements on the screen you can decide where to place the component. To help you, a color-coded bar will be displayed:
Move components out of position.
With the Professional editing mode you can move components in position: move one section over another, reposition a row, or any other component (texts, images, videos...).
All you have to do is select the element by clicking on its label and use the initial icon to drag the element.
Remember that to help you choose the desired position, color-coded bars will be displayed:
- Blue: will move creating a new section.
- Orange: will move creating a new row.
- Green: will move creating a new column.
- Gray: it will move under another existing element.
Modify section visibility
You can decide whether the section is visible or not according to the condition you decide. Click on the "Add condition" property.
Here you can decide which object/component will be used as a referent and then you can decide which trigger will make the section visible. Depending on the object you choose, you will have different triggers. For example, you could make a section not visible until the learner answers a quiz, or gets a specific activity right, or completes the viewing of a video/audio...