Articles are containers for content elements. Grouping content elements that belong together makes it easy to move, publish, copy, edit or export them all at once instead of one by one. Each article is associated with a particular page and layout section and therefore has a fixed position in the site structure and on the website. Contao optionally shows only the article teaser with a "Read more" link.

Content elements

Content elements are an easy and intuitive way to create content. Instead of just using a Rich Text Editor, Contao provides a separate element for each type of content like texts, lists, tables, hyperlinks, images or downloads. Here is an overview of the Contao core content elements:

Name CSS class Description
Headline ce_headline Generates a headline (h1 - h6).
Text ce_text Generates a rich text that can be formatted using TinyMCE.
HTML - Allows you to add custom HTML code.
List ce_list Generates an ordered or unordered list.
Table ce_table Generates an optionally sortable table.
Code ce_code Highlights code snippets and prints them to the screen.
Markdown ce_markdown Generates HTML code from a markdown text.
Accordion (single element) ce_accordionSingle Generates a single accordion element (with MooTools).
Accordion (wrapper start) ce_accordionStart Generates the opening part of the accordion wrapper.
Accordion (wrapper stop) - Generates the closing part of the accordion wrapper.
Content slider (wrapper start) ce_sliderStart Generates the opening part of the slider wrapper.
Content slider (wrapper stop) - Generates the closing part of the slider wrapper.
Hyperlink ce_hyperlink Generates a link to another website.
Top link ce_toplink Generates a link to jump to the top of the page.
Image ce_image Generates a stand-alone image.
Gallery ce_gallery Generates a lightbox image gallery.
Video/audio ce_player Generates a video or audio player.
YouTube ce_youtube Adds a YouTube video.
Vimeo ce_vimeo Adds a Vimeo video.
Download ce_download Generates a link to download a file.
Downloads ce_downloads Generates multiple links to download files.
Article - Includes another article.
Content element (parent class) Includes another content element.
Form ce_form Includes a form.
Module (parent class) Includes a front end module.
Article teaser ce_teaser Displays the teaser text of an article.
Comments ce_comments Adds a comment form to the page.

Access control

Each content element can be protected so only guests or members of a particular group can see it on the website.

Flash content

Flash content is a special type of content which is not shown in an article on the website but loaded into a dynamic Flash movie using "loadVars()". To allow communication between Contao and Flash, you have to add the following function to the root frame of your movie:

TextField.prototype._loadArticle = function(flashID) {
  tf = this;

  // Enable HTML mode and remove content
  tf.html = true;
  tf.htmlText = "";

  // Instantiate a new LoadVars object
  lv = new LoadVars();
  lv["flashID"] = flashID;
  lv.sendAndLoad(URL + "flash.php", lv, "POST");

  lv.onLoad = function(success) {
    if (success) {
      tf.htmlText = lv["content"];

// Load the Flash content "myArticle" into the text field "myTextBox"

Importing a style sheet

The following ActionScript allows you to import a style sheet to format a dynamic text field:

TextField.prototype._addCSS = function(style_sheet) {
  tf= this;
  tf.styleSheet = null;

  // Instantiate a new StyleSheet object
  st = new TextField.StyleSheet();
  st.load(URL + style_sheet);

  st.onLoad = function(success) {
    if (success) {
      tf.styleSheet = st;

// Add the style sheet "basic.css" to the text box "myTextBox"

Note that Flash only supports a small subset of HTML tags, so some of your styles might not display correctly.

results matching ""

    No results matching ""