CC Creator - Rows and columns

Last modified:

The rows are the main component to be added inside the sections.

Once you have rows and columns, you can add inside them the rest of the components (texts, videos, images...). 

Image 47023

Each editing mode allows different actions to be performed with rows and columns:

Easy Mode:  You cannot interact with rows and columns.

    Professional Mode:

    • Modify rows and columns properties
    • Add rows within sections.
    • Add other components.
    • Move components out of position.
    • Duplicate or delete rows.

      Modify row and column properties

      An author in Easy mode will only be able to select rows and columns using the breadcrumb trail.

      Activate this functionality from the edit menu: 

      Image 47226

      Then click on any element on the page (a text, an image). In the breadcrumb trail you will see that this element is contained within a column and, at the same time, within a row. 

      Selecting the row or column from the breadcrumb trail you can set up its properties. 

      Image 47227

      The properties that you can set up in the rows and columns are:

      Image 47228

      • Its title. It will be useful to customize it to recognize the row or column 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 visibility. You can decide whether the row or column is visible or not according to the condition you decide. Click on "Add condition". Here you can decide which object/component will be used as a referent and then you can decide the trigger that will make it visible. Depending on the object you choose, you will have different triggers. For example, you could make a row not visible until the learner answers a quiz, or gets a specific activity right, or completes the viewing of a video/audio...

      Image 47027

      Image 47028

      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 area.

      Image 47085

      Pressing the + button you can add rows or other components.

      Image 47086

      You will be able to add the type of rows that the Designer has added to the theme.

      Image 47087

      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 around the screen until the area where you want to add it lights up orange.

      Image 47088

      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.

      Image 47089

      Image 47090

      For each component you will have different templates, according to the characteristics of the theme that have been set up.

      Image 47092

      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).

      Image 47094

      - 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:

      Image 47093

      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.

      Image 47095

      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: will move under another existing element.

      Duplicate or delete rows

      First you must split the row. You have two ways to do this:

      • Moving the mouse pointer over the screen you will see the rows highlighted in orange. Simply click on its label to select it.
        Image 47244
      • Using the breadcrumb trail.

      Image 47245

      Once the row is selected, from its label, you can duplicate or delete it.

      Image 47246

      Is this article helpful for you?
      © 2023 Netex Knowledge Factory. All Rights Reserved. Disclaimer | Privacy policy | Cookie Policy.