.. You may want to use the usual include line. Uncomment and adjust the path. .. include:: ../Includes.txt ================= Introduction Plus ================= :Created: 2010-10-13T21:40:33 :Changed by: dirk :Changed: 2014-08-08T23:15:15 :Classification: introductionplus :Description: Features for the official Introduction Package: 15 default bootstrap themes, additional top bar, unlimited menu levels, CSS multicolumn menu, interfaces for language menus among others. :Keywords: introduction, package, multilevel, menu, langauge, manager, official :Author: Dirk Wildt - Die Netzmacher :Email: http://wildt.at.die-netzmacher.de :Website: http://die-netzmacher.de :Language: en |img-1| |img-2| Introduction Plus|img-3| .. _Introduction-Plus: Introduction Plus ================= Features for the official Introduction Package: 15 default bootstrap themes, additional top bar, unlimited menu levels, CSS multicolumn menu, interfaces for language menus among others. |img-4| Version: 1.2.0, 2014-08-08 Extension Key: introductionplus Language: en Keywords: introduction, package, multilevel, menu, langauge, manager, official Copyright 2014, Dirk Wildt - Die Netzmacher, This document is published under the Open Content License available from `http://www.opencontent.org/opl.shtml `_ The content of this document is related to TYPO3 a GNU/GPL CMS/Framework available from `www.typo3.org `_ .. _Table-of-Contents: Table of Contents ----------------- `Introduction Plus 1 <#__RefHeading__1165_1172745218>`_ `Screen Shots 3 <#__RefHeading__370_387655266>`_ `Themes 3 <#__RefHeading__538_2057499597>`_ `Top bar 3 <#__RefHeading__5616_1106668378>`_ `Language Management 4 <#__RefHeading__5618_1106668378>`_ `Menu with unlimited levels 4 <#__RefHeading__540_2057499597>`_ `CSS multicolumn menu 4 <#__RefHeading__3140_2015946129>`_ `Introduction 5 <#__RefHeading__492_1861042281>`_ `What does it do? 5 <#__RefHeading__1169_1172745218>`_ `What do you need? 5 <#__RefHeading__6727_1266816573>`_ `Quick Install 6 <#__RefHeading__1177_1172745218>`_ `Install 7 <#__RefHeading__374_387655266>`_ `Features 8 <#__RefHeading__27034_1567600255>`_ `Theme 8 <#__RefHeading__5620_1106668378>`_ `Top bar 10 <#__RefHeading__873_354167147>`_ `Unlimited menu levels 12 <#__RefHeading__5622_1106668378>`_ `CSS multicolumn menu 13 <#__RefHeading__3142_2015946129>`_ `Language management 15 <#__RefHeading__5624_1106668378>`_ `Bootstrap pills 18 <#__RefHeading__5626_1106668378>`_ `Constant Editor 20 <#__RefHeading__5649_1106668378>`_ `Bootstrap themes 20 <#__RefHeading__5634_1106668378>`_ `Language 20 <#__RefHeading__5636_1106668378>`_ `Language menu 20 <#__RefHeading__5638_1106668378>`_ `Top bar 21 <#__RefHeading__5640_1106668378>`_ `Known bugs 22 <#__RefHeading__5642_1106668378>`_ `Bugs 22 <#__RefHeading__20850_1266816573>`_ `Latest bugs are published at 22 <#__RefHeading__20852_1266816573>`_ `Sub menus 22 <#__RefHeading__5644_1106668378>`_ `Helpful suggestions 23 <#__RefHeading__1283_2006342602>`_ `Credits 24 <#__RefHeading__5646_1106668378>`_ `imsotec AG 24 <#__RefHeading__1804_194558368>`_ `The team of the introduction package 24 <#__RefHeading__6729_1266816573>`_ `Further Information 25 <#__RefHeading__6731_1266816573>`_ `Other extensions published by Die Netzmacher 25 <#__RefHeading__11111_182679940>`_ `Illustration Index 26 <#__RefHeading__5651_1106668378>`_ `Change log 27 <#__RefHeading__6733_1266816573>`_ .. _Screen-Shots: Screen Shots ------------ .. _Themes: Themes ^^^^^^ |img-5| |img-5| |img-5| Examples with two out of 15 bootstrap themes. The Introduction Package with the theme - Introduction Package (TYPO3) - Amelia (Bootstrap) - Slate (Bootstrap) See details at "15 Bootstrap default themes"on page 9 below. .. _Top-bar: Top bar ^^^^^^^ |img-5| |img-5| Introduction Plus adds a top bar to the layout of the introduction package. The top bar contains the three areas left, center and middle. You can add to each area (or cell) content elements. The top bar is visible only, if at least one area contains content. See details at "Top bar" on page 10 below. .. _Language-Management: Language Management ^^^^^^^^^^^^^^^^^^^ |img-5| |img-5| |img-5| Introduction Plus provides both language menus – with icons or text labels – as content elements. .. _Menu-with-unlimited-levels: Menu with unlimited levels ^^^^^^^^^^^^^^^^^^^^^^^^^^ |img-5| |img-5| The default bootstrap submenu can't manage different levels. Introduction Plus extends the bootstrap submenu: it can manage unlimited levels – upto five levels are configured ready to use. .. _CSS-multicolumn-menu: CSS multicolumn menu ^^^^^^^^^^^^^^^^^^^^ |img-5| .. _Introduction: Introduction ------------ .. _What-does-it-do: What does it do? ^^^^^^^^^^^^^^^^ This extension extends the official TYPO3 Introduction Package with some features: - 15 Bootstrap default themes. You select a theme with a mouse click. - A top bar devided in three areas (cells). You can use it for example for a language menu and bootstrap pills. - Unlimited menu levels. The default bootstrap submenu can't manage levels, Introduction Plus enables the submenu to manage unlimited levels. - "Big" menus will wrapped in columns – controled by CSS only. - The language manager enables you to manage upto seven languages by both content elements – the icon menu and the text menu – and by the constant editor, the TypoScript interface. - Bootstrap pills: Introduction Plus adds a new content element bootstrap pills. It enables you to place a simple one level menu – a list of links – everywhere on your website. .. _What-do-you-need: What do you need? ^^^^^^^^^^^^^^^^^ - The official TYPO3 introduction package. - TYPO3 6.2 - Small know how about TypoScript is recommended. .. _Quick-Install: Quick Install ------------- Install this extension. If you like to use all features of Introduction Plus please enable the include static templates: - Introduction Plus: bootstrap themes - Introduction Plus: +bootstrap themes unlimited menu levels - Introduction Plus: language menu (1) en, de, ... - Introduction Plus: language menu (1+) de, en, ... - Introduction Plus: top bar Select your theme. Manage your languages. Add three folders for the top bar and add your content. .. _Install: Install ------- See "Features" on page 8 below. .. _Features: Features -------- .. _Theme: Theme ^^^^^ You can change the theme of the official TYPO3 introduction package with a mouse click supported by the constant editor, the TypoScript interface. .. _Include-Static-Template: Include Static Template """"""""""""""""""""""" You have to include the static template like in the illustration below: Introduction Plus: bootstrap themes |img-5| .. _Select-your-Theme: Select your Theme """"""""""""""""" Please select your theme supported by the TypoScript interface – the constant editor - Modul: Web > Templates - Page Tree: Congratulations [1] (root page) - Edit area: [Constant Editor] Edit area: Category [INTRODUCTION PLUS – BOOTSTRAP THEMES] Theme: one of sixteen themes (see thumbnails on the next page). Please remove the link wrap (it is needed for the design of the introduction package only). |img-5| See details at "Constant Editor > Bootstrap themes" on page 20 below. .. _15-Bootstrap-default-themes: 15 Bootstrap default themes """"""""""""""""""""""""""" .. ### BEGIN~OF~TABLE ### .. _img-6: |img-6| ~~~~~~~ .. container:: table-row a |img-6| b |img-7| c |img-8| d |img-9| .. _img-10: |img-10| ~~~~~~~~ .. container:: table-row a |img-10| b |img-11| c |img-12| d |img-13| .. _img-14: |img-14| ~~~~~~~~ .. container:: table-row a |img-14| b |img-15| c |img-16| d |img-17| .. _img-18: |img-18| ~~~~~~~~ .. container:: table-row a |img-18| b |img-19| c |img-20| d .. ###### END~OF~TABLE ###### See `http://bootswatch.com/ `_ .. _Top-bar: Top bar ^^^^^^^ You can add a top bar with the three areas left, center and right. .. _Include-Static-Template: Include Static Template """"""""""""""""""""""" You have to include the static template Introduction Plus: top bar like in the illustration below. |img-5| .. _Add-three-folders: Add three folders """"""""""""""""" Please add these folders to the page tree like in the illustration below (1): Top bar - Left (here: id 38 `:sup:`0` <#sdfootnote1sym>`_ ) - Center (here: id 39) - Right (here: id 40) Please configure the folder ids for the top bar supported by the TypoScript interface – the constant editor - Modul: Web > Templates - Page Tree: Congratulations [1] (root page) - Edit area: [Constant Editor] Edit area: Category [INTRODUCTION PLUS – TOP BAR] Page id for the left content. Page id for the center content. Page id for the reight content. |img-5| See details at "Constant Editor > Top bar" on page 21 below. .. _Add-content-to-the-folders: Add content to the folders """""""""""""""""""""""""" Add content to your folders. See examples - "Language management" on page 15 below - "Bootstrap pills" on page 18 below .. _The-top-bar-in-the-frontend: The top bar in the frontend """"""""""""""""""""""""""" See screen shot "Top bar" on page 3 above. .. _Unlimited-menu-levels: Unlimited menu levels ^^^^^^^^^^^^^^^^^^^^^ You can use unlimited levels in the sub menu of the introduction package. .. _Include-Static-Template: Include Static Template """"""""""""""""""""""" You have to include both static templates: - Introduction Plus: bootstrap themes - Introduction Plus: +bootstrap themes unlimited menu levels like in the illustration below. |img-5| That's all. You don't need to select any bootstrap theme. .. _Known-bugs: Known bugs """""""""" There is a known bug in context with unlimited levels. Please refer to "Known bugs" on page 22 below. .. _CSS-multicolumn-menu: CSS multicolumn menu ^^^^^^^^^^^^^^^^^^^^ |img-5| Introduction Plus renders "big" menus on the second level in columns automatically. .. _Workflow: Workflow """""""" The columns are controlled by CSS only – you don't need any JavaScript. Each submenu on the second level gets the additional class dropdown-menu-x where x is the number of the contained menu items. .. _Include-Static-Template: Include Static Template """"""""""""""""""""""" You have to include the static template Introduction Plus: bootstap +multi columns menu .. _Used-CSS-dpends-on-the-user-agent-browser: Used CSS dpends on the user agent (browser) """"""""""""""""""""""""""""""""""""""""""" .. _All-agents-but-mozilla: All agents but mozilla ~~~~~~~~~~~~~~~~~~~~~~ Each class has a corresponding CSS class like .nav > li > ul.dropdown-menu ul { min-width:100%; } .nav > li > ul.dropdown-menu ul li { width:100%; } .nav > li > ul.dropdown-menu-6, .nav > li > ul.dropdown-menu-7, .nav > li > ul.dropdown-menu-8, .nav > li > ul.dropdown-menu-9, .nav > li > ul.dropdown-menu-10 { float:left; min-width:400px; /\* fallback for browsers without support for calc() \*/ min-width:calc(200px\*2); } ... .. _Mozilla-firefox-only: Mozilla (firefox) only ~~~~~~~~~~~~~~~~~~~~~~ Each class has a corresponding CSS class like ul.dropdown-menu ul, ul.dropdown-menu-1, ul.dropdown-menu-2, ul.dropdown-menu-3, ul.dropdown-menu-4, ul.dropdown-menu-5 { -moz-column-count: 1; } ul.dropdown-menu-6, ul.dropdown-menu-7, ul.dropdown-menu-8, ul.dropdown-menu-9, ul.dropdown-menu-10 { -moz-column-count: 2; } ... .. _Configuration: Configuration """"""""""""" .. _By-TypoScript: By TypoScript ~~~~~~~~~~~~~ If you like to controll the behaviour by TypoScript, please replace {register:count\_menuItems} with a one like in the snippet below. lib.navigation { main.10.2.stdWrap { //dataWrap =
    \|
dataWrap =
    \|
} } .. _By-CSS: By CSS ~~~~~~ If you like to controll the behaviour by CSS, please edit multilevelmenu.css, upload the changed file to the fileadmin, and change the allocation in the includeCSS-array like in the snippet below. page.includeCSS { //introductionPlusMulticolumnsMenu = EXT:introductionplus/Resources/Public/Css/multicol...css introductionPlusMulticolumnsMenu] = fieladmin/myMultiColumnMenu.css } .. _Language-management: Language management ^^^^^^^^^^^^^^^^^^^ You can place both language menus – with text labels or icons – everywhere at your website ready to use. .. _Supposed-language-configuration: Supposed language configuration """"""""""""""""""""""""""""""" |img-5| This is the supposed language configuration for the tutorial below: - Default language is English - First foreign language is German (here: Deutsch) - German language has the id 1. .. _Include-Static-Template: Include Static Template """"""""""""""""""""""" You have to include the static template Introduction Plus: language menu (1) en, de, … And if you like to place the language menu in the top bar like in the tutorial below, please include Introduction Plus: top bar See illustration below. |img-5| .. _Place-the-language-menu: Place the language menu """"""""""""""""""""""" Place the language menu in the left area of the top bar. The top bar must prepaired like in the section "Top bar" on page 10 above. Folder Left (here: id 38) Content Element: Type [Special Menus] Menu and Sitemap: Menu Type [Introduction Plus: Language text menu] |img-5| .. _Result-in-the-frontend: Result in the frontend """""""""""""""""""""" |img-5| If you are use the menu type [Introduction Plus: Language icon menu], you will get this result. |img-5| .. _Configuration-in-detail: Configuration in detail """"""""""""""""""""""" Configuration in detail is possible with the TypoScript interface – the constant editor. It is needed - if you are using different languages than in the tutorial above, - if you like different text labels or - if you like different icons. Language management with the constant editor - Modul: Web > Templates - Page Tree: Congratulations [1] (root page) - Edit area: [Constant Editor] Edit area: - Category [INTRODUCTION PLUS – LANGUAGE] - Category [INTRODUCTION PLUS – LANGUAGE MENU] See details at - "Constant Editor > Language" on page 20 below - "Constant Editor > Language menu" on page 20 below .. _Bootstrap-pills: Bootstrap pills ^^^^^^^^^^^^^^^ Bootstrap pills are a link list – a small one level menu. .. _Include-Static-Template: Include Static Template """"""""""""""""""""""" You don't need to include any static template. But if want to place the bootstrap pills in the right corner of the top bar, you have to include Introduction Plus: top bar See illustration below. |img-5| .. _Place-the-bootstrap-pills: Place the bootstrap pills """"""""""""""""""""""""" Place the bootstrap pills in the right corner of the top bar. The top bar must prepaired like in the section "Top bar" on page 10 above. Folder Right (here: id 40) Content Element: Type [Special Menus] Menu and Sitemap: Menu Type [Introduction Plus: Bootstrap pills] Selected pages |img-5| .. _Result-in-the-frontend: Result in the frontend """""""""""""""""""""" |img-5| .. _Area-widths-of-the-top-bar: Area widths of the top bar """""""""""""""""""""""""" Probably you have to configure the width of the right corner. In this case please refer to "Constant Editor > Top bar" on page 21 below .. _Constant-Editor: Constant Editor --------------- All properties have the prefix introductionplus. Example: introductionplus.minLength is introductionplus.minLength. .. _Bootstrap-themes: Bootstrap themes ^^^^^^^^^^^^^^^^ .. ### BEGIN~OF~TABLE ### .. _bootstrap-themes-theme: bootstrap.themes.theme """""""""""""""""""""" .. container:: table-row Property bootstrap.themes.theme Type string Description Theme: Bootstrap theme.See `http://introduction.cms.demo.typo3.org/ `_ , `http://bootswatch.com/ `_ **Default** : IntroductionPackage **Possible values** : IntroductionPackage, Amelia, Cerulean, Cosmo, Cyborg, Darkly, Flatly, Journal, Lumen, Readable, Simplex, Slate, Spacelab, Superhero, United, Yeti Default See description .. _bootstrap-themes-path: bootstrap.themes.path """"""""""""""""""""" .. container:: table-row Property bootstrap.themes.path Type string Description Path: Path to the themes (with an ending slash!) **Default** : EXT:introductionplus/Resources/Public/Bootstrap/Themes/ Default See description .. _bootstrap-themes-linkwrap: bootstrap.themes.linkwrap """"""""""""""""""""""""" .. container:: table-row Property bootstrap.themes.linkwrap Type string Description Linkwrap: Recommended for the TYPO3 Introduction Package only: \| **Default** : \| Default See description .. _bootstrap-themes-file: bootstrap.themes.file """"""""""""""""""""" .. container:: table-row Property bootstrap.themes.file Type string Description **CSS file** : The minified CSS file is recommended. **Default** : bootstrap.min.css Default See description .. _bootstrap-themes-typo3: bootstrap.themes.typo3 """""""""""""""""""""" .. container:: table-row Property bootstrap.themes.typo3 Type string Description **CSS for TYPO3** : Aditional CSS for TYPO3 content elements. Needed for every theme but the introduction package. **Default** : EXT:introductionplus/Resources/Public/Css/typo3bootstrap.css Default See description .. ###### END~OF~TABLE ###### .. _Language: Language ^^^^^^^^ .. ### BEGIN~OF~TABLE ### .. _config-language-0-iso: config.language.0.iso """"""""""""""""""""" .. container:: table-row Property config.language.0.iso Type string Description ISO code: ISO code of the default language. See `http://en.wikipedia.org/wiki/List\_of\_ISO\_639-1\_codes `_ Default En .. _config-language-0-locale: config.language.0.locale """""""""""""""""""""""" .. container:: table-row Property config.language.0.locale Type string Description Locale Information: The locale information of the default language. See `http://www.php.net/manual/de/function.setlocale.php `_ Default en\_US.UTF-8 .. _config-language-0-direction: config.language.0.direction """"""""""""""""""""""""""" .. container:: table-row Property config.language.0.direction Type string Description Direction: Left to right (ltr) or right to left (rtl). Default ltr .. _config-language-1-uid: config.language.1.uid """"""""""""""""""""" .. container:: table-row Property config.language.1.uid Type Id Description 1. ID: ID of the 1st foreign language. Has to correspond with the ID of your language record. Default 1 .. _config-language-1-iso: config.language.1.iso """"""""""""""""""""" .. container:: table-row Property config.language.1.iso Type string Description See property config.language.0.iso above. Default de .. _config-language-1-locale: config.language.1.locale """""""""""""""""""""""" .. container:: table-row Property config.language.1.locale Type string Description See property config.language.0.locale above. Default de\_DE.UTF-8 .. _config-language-1-direction: config.language.1.direction """"""""""""""""""""""""""" .. container:: table-row Property config.language.1.direction Type string Description See property config.language.0.direction above. Default ltr .. _config-language-2-6: config.language.[2...6] """"""""""""""""""""""" .. container:: table-row Property config.language.[2...6] Type array Description See config.language.0 Default .. ###### END~OF~TABLE ###### .. _Language-menu: Language menu ^^^^^^^^^^^^^ .. ### BEGIN~OF~TABLE ### .. _lib-nav-language-override-text: lib.nav.language.override.text """""""""""""""""""""""""""""" .. container:: table-row Property lib.nav.language.override.text Type string Description Text Menu: List of menu labels devided by a double pipe. Needed if you are using the language text menu. Not needed in case of the language icon menu. **Example** : English \|\| Deutsch \|\| Francoise **Default** : English \|\| Deutsch Default See description .. _lib-nav-language-override-icons: lib.nav.language.override.icons """"""""""""""""""""""""""""""" .. container:: table-row Property lib.nav.language.override.icons Type string Description Icon Menu: List of menu with icons devided by a double pipe. Needed if you are using the language icons menu. Not needed in case of the language text menu. **Default** : English \|\| German Default See description .. _lib-nav-language-special: lib.nav.language.special """""""""""""""""""""""" .. container:: table-row Property lib.nav.language.special Type String Description Enabled menus:List of menu ids devided by a comma. **Example** : 0,1,2 Default 0,1 .. _lib-nav-language-additionalParams: lib.nav.language.additionalParams """"""""""""""""""""""""""""""""" .. container:: table-row Property lib.nav.language.additionalParams Type string Description Parameter: List of language parameter devided by a double pipe. **Example** : &L=0 \|\| &L=1 \|\| &L=2 Default &L=0 \|\| &L=1 .. ###### END~OF~TABLE ###### .. _Top-bar: Top bar ^^^^^^^ .. ### BEGIN~OF~TABLE ### .. _topbar-columns-width-left: topbar.columns.width.left """"""""""""""""""""""""" .. container:: table-row Property topbar.columns.width.left Type integer Description Width of left column:Value from 1 to 10. BE AWARE: the sum of all three columns must be 12! Default 3 .. _topbar-columns-width-center: topbar.columns.width.center """"""""""""""""""""""""""" .. container:: table-row Property topbar.columns.width.center Type integer Description Width of center column:Value from 1 to 10. BE AWARE: the sum of all three columns must be 12! Default 6 .. _topbar-columns-width-right: topbar.columns.width.right """""""""""""""""""""""""" .. container:: table-row Property topbar.columns.width.right Type integer Description Width of right column:Value from 1 to 10. BE AWARE: the sum of all three columns must be 12! Default 3 .. _topbar-folders-left: topbar.folders.left """"""""""""""""""" .. container:: table-row Property topbar.folders.left Type integer Description Pid left content: The id of the folder with content for the left column. Default 9999 .. _topbar-folders-center: topbar.folders.center """"""""""""""""""""" .. container:: table-row Property topbar.folders.center Type integer Description Pid center content: The id of the folder with content for the center column. Default 9999 .. _topbar-folders-right: topbar.folders.right """""""""""""""""""" .. container:: table-row Property topbar.folders.right Type integer Description Pid right content: The id of the folder with content for the right column. Default 9999 .. ###### END~OF~TABLE ###### .. _Known-bugs: Known bugs ---------- .. _Bugs: Bugs ^^^^ Latest bugs are published at `https://forge.typo3.org/projects/extension-introductionplus/issues `_ .. _Sub-menus: Sub menus ^^^^^^^^^ You can open sub menus on every level but you can't close it. There is missing a JavaScript code snippet. If you have a solution, please send it to the developer – he will include it. See "Helpful suggestions" on page 23 below. .. _Helpful-suggestions: Helpful suggestions ------------------- If you have helpful suggestions please send a mail to `http://wildt.at .die-netzmacher.de `_ .. _Credits: Credits ------- Credits to .. _imsotec-AG: imsotec AG ^^^^^^^^^^ The imsotec AG (Germany) contracted the initial part of Introduction Plus. See http://www.imsotec.com/ .. _The-team-of-the-introduction-package: The team of the introduction package ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Especially to Benjamin Mack (Leader) and Benjamin Kott (Co-Leader) see at `https://forge.typo3.org/projects/extension-introduction `_ .. _Further-Information: Further Information ------------------- .. _Other-extensions-published-by-Die-Netzmacher: Other extensions published by Die Netzmacher ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - |img-21| +AOE Linkhandler Configurator: Configure the AOE linkhandler supported by userinterfaces. Out-of-the-box templates for cal, org, tt\_news and tt\_products. Don't edit page TSconfig any longer. `http://typo3.org/extensions/repository/view/linkhandlerconf/ `_ - |img-22| autositemap: A smart site-map optimised for the footer. It groups menus in columns. Great menus will get two columns. Configuration is based on TypoScript HMENU. `http://typo3.org/extensions/repository/view/autositemap/ `_ - |img-23| Browser – TYPO3 without PHP. Develop your TYPO3 extension 8 times faster! You need one line TypoScript for a result list with a search form, a record browser and an index browser. Images are wrapped self-acting. SEO, Search Engine Optimization, is integrated. `http://typo3.org/extensions/repository/view/browser/ `_ - |img-24| Caddy – the TYPO3 shopping cart. You can use it for your own needs. You need a database with products or any other items only. You can install Caddy out of the box with one mouse click – see Quick Shop below. `http://typo3.org/extensions/repository/view/caddy/ `_ - |img-25| Flip it! offers lovely and smooth page flip transitions. It enables you to run over pages in PDF documents like in a real magazine. It is based on flash. Flipt it! can convert PDF documents to swf files automatically. `http://typo3.org/extensions/repository/view/flipit/ `_ - |img-26| Green Cars (Grüne Autos) - Database optimized for ecological cars. It is a case study and demonstrates, how to get a complex database with the browser (see above) in three hours only. `http://typo3.org/extensions/repository/view/green\_cars/ `_ - |img-27| Organiser – TYPO3 for the lobby and the organisers. Handle news, events, staff, headquarters, locations, workshops and a calendar with one extension. Sell online tickets! Install the Organiser with one mouse click! `http://typo3-organiser.de/ `_ - |img-28| Quick Shop – the fastest shop in the history of TYPO3. Install it with one mouse click! Quick Shop is based on the browser (see above) and powermail. `http://typo3-quick-shop.de/ `_ - |img-29| PDF Controller: Easy to install. Add to your HTML page the PDF-controller-button. Link from the button to the controller. Adjust the controller by mouseclicks. The PDF Controller supports CSS 3. `http://typo3-pdfcontroller.de/ `_ - |img-30| Radial Search (German: Umkreissuche) for your TYPO3 database. Your data must have a latitude and a longitude. The Browser – TYPO3 without PHP – has it integrated. `http://typo3.org/extensions/repository/view/radialsearch/ `_ - |img-31| Route – Publish your routes with GoogleMaps or OpenStreetMap. Routes have points of interest (POI). You can categorise and filter both: routes and POI. Address data can geocoded automatically. `http://typo3.org/extensions/repository/view/route/ `_ - |img-32| seo\_dynamic\_tag: Search Engine Optimization for the title tag, the canonical tag and the meta tags author, description and keywords. Configuration by a user interface. `http://typo3.org/extensions/repository/view/seo\_dynamic\_tag/ `_ - |img-33| TSconfig Pages and Users by extManager (extkey: tsconf): Configure the the eight most commonly used TSconfig porperties with the mouse - like page tree uids, activated extended view, activated clipboard, ... `http://typo3.org/extensions/repository/view/tsconf/ `_ - |img-34| tt\_news select configuration (extkey: ttnews\_selectconf) enables to select tt\_news by any SQL clause. The extension adds an andWhere clause to the SQL query of the tt\_news plugin. `http://typo3.org/extensions/repository/view/ttnews\_selectconf/ `_ - |img-35| Wine Catalogue provides a data base for wine with regions, wineries, styles, variety and ageing among others. It is localized. English, German and Spanish ist of the box. Wine based on the extension browser (see above). `http://typo3.org/extensions/repository/view/wine/ `_ .. _Illustration-Index: Illustration Index ------------------ Illustration 1: Introduction Package 3 Illustration 2: Amelia 3 Illustration 3: Slate 3 Illustration 4: Introduction Package without the top bar (default) 3 Illustration 5: Introduction Package with the top bar (Introduction Plus). Here: Language menu (left) and Bootstrap pills (right). 3 Illustration 6: With flags 4 Illustration 7: With text 4 Illustration 8: The Language menu is a content element 4 Illustration 9: Introduction package: submenu without second level 4 Illustration 10: Introduction Plus: submenu with second level 4 Illustration 11: CSS multicolumn menu 4 Illustration 12: Include static template: Bootstrap themes 8 Illustration 13: Interface for bootstrap themes: the TypoScript Constant Editor 8 Illustration 14: Include static template: top bar 10 Illustration 15: Interface for the top bar: the TypoScript Constant Editor 11 Illustration 16: Include static template: unlimited menu levels 12 Illustration 17: CSS multicolumn menu 13 Illustration 18: Website languages 15 Illustration 19: Include static template: language management 15 Illustration 20: Content element language menu (here: text labels) 16 Illustration 21: With text 16 Illustration 22: With flags 16 Illustration 23: Include static template: top bar 18 Illustration 24: Content element bootstrap pills 19 Illustration 25: Introduction Package with the top bar and Bootstrap pills (right). 19 .. _Change-log: Change log ---------- 1.2.0 **Feature** \* #60865: Detachable CSS multicolumn menu, Bugfixing Chrome and Iiternet Explorer 1.1.0 **Feature** \* #60810: CSS multicolumn menu 1.0.0 **Task** \* #60267: Manual 0.0.4 **Feature** \* #60599: Bootstrap Default Themes 0.0.3 **Feature** \* #60265: Language menu as a conten element Sitemap/Menu 0.0.2 **Feature** \* #60255: Additional top bar\* #60253: Multilevel menu 0.0.1 **Feature** \* #60166: Language Menu **Initial release** \* # 60266 Extension framework `0 <#sdfootnote1anc>`_ If you like the page tree ids and the page tree icons please install the extension tsconf. See `http://typo3.org/extensions/repository/view/tsconf `_ 27 .. ######CUTTER_MARK_IMAGES###### .. |img-1| image:: img-1.png .. :align: left .. |img-2| image:: img-2.jpeg .. :border: 0 .. :height: 20 .. :id: Grafik1 .. :name: Grafik1 .. :width: 69 .. |img-3| image:: img-3.png .. :align: middle .. :border: 0 .. :height: 16 .. :id: graphics1 .. :name: graphics1 .. :width: 16 .. |img-4| image:: img-4.png .. :align: bottom .. :border: 0 .. :height: 268 .. :id: graphics2 .. :name: graphics2 .. :width: 268 .. |img-5| image:: data: :alt: Frame1 .. :align: bottom .. :id: Frame1 .. :name: Frame1 .. |img-6| image:: img-6.png .. :border: 0 .. :height: 100 .. :id: graphics3 .. :name: graphics3 .. :width: 167 .. |img-7| image:: img-7.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics4 .. :name: graphics4 .. :width: 167 .. |img-8| image:: img-8.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics5 .. :name: graphics5 .. :width: 167 .. |img-9| image:: img-9.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics6 .. :name: graphics6 .. :width: 167 .. |img-10| image:: img-10.png .. :align: middle .. :border: 0 .. :height: 100 .. :id: graphics7 .. :name: graphics7 .. :width: 167 .. |img-11| image:: img-11.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics8 .. :name: graphics8 .. :width: 167 .. |img-12| image:: img-12.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics9 .. :name: graphics9 .. :width: 167 .. |img-13| image:: img-13.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics10 .. :name: graphics10 .. :width: 167 .. |img-14| image:: img-14.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics11 .. :name: graphics11 .. :width: 167 .. |img-15| image:: img-15.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics12 .. :name: graphics12 .. :width: 167 .. |img-16| image:: img-16.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics13 .. :name: graphics13 .. :width: 167 .. |img-17| image:: img-17.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics14 .. :name: graphics14 .. :width: 167 .. |img-18| image:: img-18.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics15 .. :name: graphics15 .. :width: 167 .. |img-19| image:: img-19.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics16 .. :name: graphics16 .. :width: 167 .. |img-20| image:: img-20.png .. :align: bottom .. :border: 0 .. :height: 100 .. :id: graphics17 .. :name: graphics17 .. :width: 167 .. |img-21| image:: img-21.png .. :border: 0 .. :height: 16 .. :id: graphics37 .. :name: graphics37 .. :width: 18 .. |img-22| image:: img-22.png .. :align: bottom .. :border: 0 .. :height: 16 .. :id: graphics42 .. :name: graphics42 .. :width: 18 .. |img-23| image:: img-23.png .. :align: bottom .. :border: 0 .. :height: 16 .. :id: graphics43 .. :name: graphics43 .. :width: 18 .. |img-24| image:: img-24.png .. :align: bottom .. :border: 0 .. :height: 18 .. :id: graphics44 .. :name: graphics44 .. :width: 18 .. |img-25| image:: img-25.png .. :align: bottom .. :border: 0 .. :height: 16 .. :id: graphics45 .. :name: graphics45 .. :width: 18 .. |img-26| image:: img-26.png .. :align: bottom .. :border: 0 .. :height: 16 .. :id: Grafik4 .. :name: Grafik4 .. :width: 18 .. |img-27| image:: img-27.png .. :align: bottom .. :border: 0 .. :height: 16 .. :id: graphics50 .. :name: graphics50 .. :width: 18 .. |img-28| image:: img-28.png .. :align: bottom .. :border: 0 .. :height: 16 .. :id: graphics55 .. :name: graphics55 .. :width: 18 .. |img-29| image:: img-29.png .. :align: bottom .. :border: 0 .. :height: 16 .. :id: graphics80 .. :name: graphics80 .. :width: 18 .. |img-30| image:: img-30.png .. :align: bottom .. :border: 0 .. :height: 18 .. :id: graphics93 .. :name: graphics93 .. :width: 18 .. |img-31| image:: img-31.png .. :align: bottom .. :border: 0 .. :height: 18 .. :id: graphics46 .. :name: graphics46 .. :width: 18 .. |img-32| image:: img-32.png .. :align: bottom .. :border: 0 .. :height: 16 .. :id: Grafik8 .. :name: Grafik8 .. :width: 18 .. |img-33| image:: img-33.png .. :border: 0 .. :height: 16 .. :id: graphics91 .. :name: graphics91 .. :width: 18 .. |img-34| image:: img-34.png .. :align: bottom .. :border: 0 .. :height: 16 .. :id: graphics92 .. :name: graphics92 .. :width: 18 .. |img-35| image:: img-35.png .. :align: bottom .. :border: 0 .. :height: 16 .. :id: graphics70 .. :name: graphics70 .. :width: 18