Feature Wiki

Information about planned and released features

Tabs

Page Editor » New, Responsive Page Templates

Page Overview

[Hide]

This request is part of the project for a New Page Editor.

The revision of the page templates is described in the following feature requests:

1 Initial Problem

The existing Page Layouts use advanced tables for their layout and are this not responsive. Some of them are not very useful, while some useful layouts are missing. All default page templates are listed below:

Template 1
Template 2
Template 3
Template 4
Template 5

2 Conceptual Summary

New default Page Templates

The new Page Templates are to become more responsive. Accordingly, the Templates will be changed from Advanced Tables to Column Layouts.

In addition, some unnecessary page templates will be abandoned, the structure and layout of the Page Templates will be revised and Page Templates will be added if necessary (see 3.2 User Interface Details).

3 User Interface Modifications

3.1 List of Affected Views

  • Administration > Layout and Navigation > Page Layouts 
  • SCORM Learning Module > Edit
  • Portfolio > Edit
  • ILIAS Learning Module > Edit
  • ...

3.2 User Interface Details

Page templates to be abandonned:

Template 2 and Template 4 hardly differ from each other. Only the text below the question is added in template 4. However, users can also add this themselves. Accordingly, template 4 should be abandoned.

Template 4

Page templates to be revised:

  • Transfer to a Column Layout.

Template 1

  • Transfer to a Column Layout.

Template 2

  • Transfer to a Column Layout.

Template 3

  • Transfer to a Column Layout.
  • We want to keep some page templates that include a tile layout. However, the text above the tile layout is to be omitted. This can simply be inserted and supplemented by the user. The templates are mainly intended to simplify the complex process of creating a tile view in the page editor.

Template 5

Page templates to be introduced

  • By converting the page templates into column layouts, the column order is important due to the mobile view. According to Template 1, this template is to be introduced. In the mobile view, the video is displayed above the text. 

NEW

  • Another Page Template with a large lead image is also to be introduced. The description of the lead image should partially overlay the image. To create this Page Template, the Standard Content Style must be extended.

3.3 New User Interface Concepts

None.

3.4 Accessibility Implications

{ If the proposal contains potential accessibility issues that are neither covered by existing UI components nor clarified by guidelines, please list them here. For every potential issue please either propose a solution or write down a short risk assessment about potential fallout if there would be no solution for the issue. }

4 Technical Information

{The maintainer has to provide necessary technical information, e.g. dependencies on other ILIAS components, necessary modifications in general services/architecture, potential security or performance issues.}

5 Privacy Information

No new personal data that will need to be stored or processed to implement this feature. 

6 Security Implications

We do not see any special security relevant changes.

7 Contact

8 Funding

If you are interest in funding this project, please add your name and institution to this list.

  • …
More Informations: Page Editor Revision - Step 2 (Crowdfunding for ILIAS 8)

9 Discussion

Kunkel, Matthias [mkunkel], 03 MAR 2021: I would like to suggest a third new template: a two-column layout with equal width containing each a H2 and a standard text paragraph. This is quite useful and prevents some users from creating a table for such a layout.

JourFixe, ILIAS [jourfixe], 08 MAR 2021: We highly appreciate this suggestion and accept the feature for ILIAS 8. It's great to get rid of the extended tables and to use column layouts instead. Concerning the suggested templates:

  • We fully agree to remove the introducing text on template 5 and offer it mainly as easy way to insert a tile look layout.
  • The template with lead image should not come with specific CSS rules to present text on top of the picture. This contradicts the suggestion that templates are always using the column style of the parent object (where this CSS rule might not exist).
  • All headlines should be removed from the layouts as well to make them easier to use as parts of page.
  • The additional template of a two-column layout with headline and text section in each column is highly appreciated.

JourFixe, ILIAS [jourfixe], 12 JUN 2023: We still like this suggestion and re-schedule the feature for ILIAS 9, incl. the requests made in the JF decision of March 2021.

Zenzen, Enrico [ezenzen], 14 SEP 2023: In order to revise the page template and make it more modern, the content style needs to be adjusted. In a first iteration only the block "Highlighted" will be added.

1
2
3
4
5
6
7
8
9
10
div.ilc_section_Highlighted {
  min-height: 120px;
  margin-right: 15px;
  margin-bottom: 30px;
  margin-left: 15px;
  padding: 30px;
  box-shadow: 0 0 50px 0 #d6d9e1;
  border-radius: 10px;
  transition: all 0.5s ease-out;
}

The block allows to structure page templates as follows (see screenshot). Another content style revision will be made in late 2023 once Features Introduce ::before selector for sections and Introduce ::before selector for lists are implemented.

10 Implementation

Test Cases

Test cases completed at 2023-10-16 by Spirou, Ilias [ispirou]

  • 63533 : Layoutvorlagen im Seiteneditor hinzufügen
  • 31974 : Seitevorlage über "Kapitel" einfügen

Privacy

Information in privacy.md of component: updated on {date} by {user} | no change required

Approval

Approved at 2023-10-12 by Brauns, Johanna [jbrauns].

Last edited: 16. Nov 2023, 17:00, Tödt, Alexandra [atoedt]