https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/Topics Content Box Content Slider Elements with slanted edges Grid Header image Headings Hyperlinks Pricing table Simple box Teaser Box Text with iconsHugoen-UShttps://relaunch.pdir.de/docs/en/contao/themes/odd/elements/content-box/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/content-box/To add a content box, place an element of type Content Box. To display several elements side by side, place them as described in the section Grid. You find an example in the ODD demo on the page Weitere ODD-Elemente.https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/content-slider/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/content-slider/The content slider must always be placed in its own article, which needs the classes slider and fullwidth under Expert settings. If the slider should also get a slant to the bottom right or left, give the article the class skw-br or skw-bl as well, see the table below. In the article, place the elements Content-Slider (Umschlag Anfang) (wrapper start) and Content-Slider (Umschlag Ende) (wrapper stop). Between the wrapper elements, place one element of type Slider-Element per slide.https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/elemente-mit-schraegen/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/elemente-mit-schraegen/The page Elemente mit Schrägen already contains various examples of elements with slanted edges. Each section must be in its own article, which needs various classes: primary-bg: background color skw-tl: slant to the top left skw-tr: slant to the top right skw-bl: slant to the bottom left skw-br: slant to the bottom right For example, to give the article slants to the top right and bottom right (like the first example on the demo page), add the classes primary-bg skw-tr skw-br in the article settings under Expert settings.https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/grid/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/grid/The theme uses Bootstrap 4, which lets you, among other things, display elements side by side and at the same time in a single column on mobile devices. For example, to display two text elements side by side, first add one element each of type Contao Themes (Inhaltscontainer Anfang) (content container start) and Contao Themes (Inhaltscontainer Ende) (content container end). The content container start element needs the class row.https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/headerbild/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/headerbild/To place a header image, use the element type Image and select the template ce_image_headerimage_odd (up to Contao 4.13) or content_element/image/header_image_odd (Contao 5 and later) under Template settings. Header image without slant For a header image without a slant, select the image size Headerbild (1920x400). You have to place the header image in its own article and select the template mod_article_fullwidth in the article settings.https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/ueberschriften/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/ueberschriften/You find examples of the headings on the page Textelemente. Underlined, left-aligned To display the heading left-aligned and underlined, give the text element the class bordered-heading. Underlined, centered To display the heading centered and underlined, give the text element the classes bordered-heading and text-sm-center.https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/hyperlinks/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/hyperlinks/If you give a link the class btn, it is displayed as a button.https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/preis-tabelle/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/preis-tabelle/To display a pricing table, place an element of type Preis-Tabelle (pricing table). To highlight a box, fill in the field Bezeichnung für Hervorgehobene Box (label for highlighted box). To display several elements side by side, place them as described in the section Grid. You find two examples in the ODD demo on the page Weitere ODD-Elemente.https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/inhaltsbox/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/inhaltsbox/If you select the template ce_text_cthemes_simplebox under Template settings of a text element, it gets a white background as in the following screenshot. To display several elements side by side, place them as described in the section Grid. You find an example in the ODD demo on the page Weitere ODD-Elemente.https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/teaserbox/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/teaserbox/To add a teaser box, place an element of type Teaser Box. Add the image via the checkbox Add an image. Select the image size Teaserboxen (350x200). To display several elements side by side, place them as described in the section Grid. You find an example in the ODD demo on the page Weitere ODD-Elemente.https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/text-mit-icons/Mon, 01 Jan 0001 00:00:00 +0000https://relaunch.pdir.de/docs/en/contao/themes/odd/elements/text-mit-icons/Place an element of type Text und Icon (text and icon). You can define a headline, a text, the Font Awesome icon and optionally a link. You find a list of available icons on the Font Awesome website. When you click an icon, you also see the classes at the top that you have to enter in the field Font Awesome 5 Icon (Klassen).