===== TYPO3 usage and configuration ===== ==== Where is the TYPO3 Documentation? ==== * The real english documentation is available as an Extension [[ http://typo3.org/extensions/repository/view/doc_core_tsref/current/ | here]]. The download link is [[http://typo3.org/extensions/repository/view/doc_core_tsref/current/| on the linked page]], at the bottom. * The official documentation, cluttered in Open Office .sxw Files is [[http://typo3.org/documentation/document-library/core-documentation/ | here]] * The more usable documentation in German language as one .pdf File is [[ http://www.mittwald.de/fileadmin/pdf/dokumentation.pdf|here ]] ==== How to enable Typo3 Admin Panel for frontend editing? ==== {{youtube>QBfwCWoHuro}} \\ Add the following code to TSconfig of the user or user-group, which should see the Administration Console after logging in. admPanel { enable.edit=1 module.edit.forceDisplayFieldIcons=1 hide=0 } or just add the following line into the // Template > Info/Modify > Edit the whole template record > Setup-form // config.admPanel = 1 ==== How to allow recursive deleting of a page Tree in the List module? ==== Add the following customization to the current user' TSConfig: \\ setup.override{ recursiveDelete=1 } ===== RTE - RichTextEditor ===== The RTE is configurated in the pages TS-Config. To decide which Buttons should be displayed and in which order write the following into the root-page TS-Config. # Buttons die gezeigt/versteckt werden RTE.default.showButtons = textstyle, textstylelabel, blockstyle, blockstylelabel, bold, italic, underline, left, center, right, orderedlist, unorderedlist, insertcharacter, line, link, image, removeformat, table, toggleborders, tableproperties, rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, columninsertbefore, columninsertafter, columndelete, columnsplit, cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge, findreplace, insertcharacter, undo, redo, showhelp, about, latex, latexcenteredbutton RTE.default.hideButtons = fontstyle, formatblock, fontsize, strikethrough,lefttoright, righttoleft, textcolor, bgcolor, textindicator, emoticon, user, spellcheck, chMode, inserttag, outdent, indent, justifyfull, subscript, superscript, acronym, copy, cut, paste # Buttons Reihenfolge RTE.default.toolbarOrder = textstyle, textstylelabel, latex, latexcenteredbutton, blockstyle, blockstylelabel, bold, italic, underline, left, center, right, orderedlist, unorderedlist, insertcharacter, line, link, image, removeformat, table, toggleborders, tableproperties, rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, columninsertbefore, columninsertafter, columndelete, columnsplit, cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge, findreplace, insertcharacter, undo, redo, showhelp, about You can see all buttons by entering showButtons = * The TSConfig can be entered as following: {{ http://i55.tinypic.com/9uvggx.png?500 }} {{ http://i55.tinypic.com/9ix0uf.png?500 }} ===== TypoScript ===== * TypoScript is case sensitive. * The names of object types must have all letters in upper case: mypage = PAGE * The names of properties must always start with a small letter and must not contain any special character: OBJECT.property NOT OBJECT.Propert&#y == Functions == TypoScript has some functions, predefined in the file class.tslib_content.php like PAGE, HMENU etc. \\ In the code they are written in capital letters and used to retrieve DOM objects, render html items like lists... //page object has all integers as properties. Integers are not line numbers - they determine the order in which the content will be displayed on the page in ONE LINE page.10 = TEXT == Objects == Typo uses objects with predefined properties. The syntax to get or set the properties is. page.10.value = TEXT //to set more than one property of object at once object{ property1 = value1 property2 = value2 } myObject = TEXT //reference object 10 =< myObject //copy object 10 < myObject //delete object 10 > Page has all integers as properties. Integers mean the output order, in which the assigned values will be displayed on the page **(order - not rows!** \\ E.g. # Default PAGE object: page = PAGE page.10 = TEXT page.10.value = HELLO WORLD10! page.20 = TEXT page.20.value = HELLO WORLD20! page.21 = TEXT page.21.value = HELLO WORLD21! page.30 = TEXT page.30.value = HELLO WORLD30! results in : "HELLO WORLD10!HELLO WORLD20!HELLO WORLD21!HELLO WORLD30!" == Branch== Typo uses objects with predefined properties. The syntax to get or set the properties is. [browser = msie] && [system = mac] //here is the true code [ELSE] //here is the else code [GLOBAL] //rest Own branches can be defined in //typo3conf/localconf.php.// by using php == Constants == Constants can be defined in the **Constants** field of the **Template** area.\\ {{ http://img228.imageshack.us/img228/6760/constants.png }} Constant can be retrieved as following 10.value = {$myCOnstant} ===== Design Templates ===== \\ HTML documents, where some some places can be marked by **subparts**. Typo3 will then dynamically replace those subparts by content. \\ ==markers== **CAN'T** be embedded into HTML comments. Therefore should only use subparts. Markers look like that ###MARKERNAME### ==subparts== * **CAN** be embedded into HTML comments, composed of two parts. * Subparts **can't be empty** * Subparts are not markers - markers (###MARKERNAME###) are like subparts, but they contain from one piece and cant be embedded in HTML comments. Markers look like that Default input ===== Templates ===== // Written in Typoscript in **Backend Template> Edit the whole template record > Setup ** // ==Including CSS or Javascript in typoscript == {{ http://huuah.com/including-javascript-or-css-in-your-typo3-template | Including CSS JS }} ==Include any Code into the header== Sometimes you may need to include a ) === Use MySQL from TypoScript === == Retrieving page properties from page table == E.g. to read the **title** field from the database, wether the name of the DB Table, not the Database has to be specified. The value of the title-DB-field for the current page can be retrieved as following: page.10.marks.OUTPUT= TEXT page.10.marks.OUTPUT{ field = title } or page.10.marks.RIGHT = TEXT page.10.marks.RIGHT.data = field:title which will result in the following SQL statement SELECT title FROM pages WHERE uid=23 ==Retrieving properties from other tables == To specify more complicated queries use the //CONTENT// object, e.g. 1 = CONTENT 1.table = tt_content 1.select { pidInList = this orderBy = sorting } ===Menu generation=== \\How to generate a menu dynamically, from the available backend pages? \\ ==HMENU== Is not a renderable Typo3 objects, but one which contains menuitems by levels 1,2,3 ... To each level a concrete menu like TMENU or GMENU can be attached. ==IFSUB== There are items, which === Change Menu entries, add custom tags === //To do this write a php function function($I,$conf) in a file and include from the template(backend, setup) // ==1. Creating the function is described below== ==2. Including of the created file with the function from the Backend works as following== # lib to sort out emty-pages menu-links. includeLibs.noemptymenuitems = fileadmin/templates/main/_alibraries/skipMenuLinksToEmptyPages.php ==3. The defined function will be used inside of the menu objects as folowing== FIRSTNAV = HMENU FIRSTNAV.TMENU.1.IProcFunc = user_function_skipMenuLinksToEmptyPages FIRSTNAV.TMENU.2.IProcFunc = user_function_skipMenuLinksToEmptyPages ==Example of the menu changing function:== checks whether there is any content on the site * if yes - menuentry is displayed with a link to thesite * if not - then * * if there is a class="dir" in ATagParams menuentry is displayed as text * * if there is no class="dir" menuentry is deleted at all I (in the parent object) * @param array TypoScript configuration for the function. Notice that the property "parentObj" is a reference to the parent (calling) object (the tslib_Xmenu class instantiated) * @return array The processed $I array returned (and stored in $this->I of the parent object again) * @see tslib_menu::userProcess(), tslib_tmenu::writeMenu(), tslib_gmenu::writeMenu() */ function user_function_skipMenuLinksToEmptyPages($I,$conf) { $muid = $I['uid']; $firstLinkTag = $I['parts']['ATag_begin']; $wraper = $I['val']['wrapItemAndSub']; //check whether the site with the current pid is not empty $query = "SELECT * FROM tt_content WHERE pid=$muid"; $res = $GLOBALS['TYPO3_DB']->sql(TYPO3_db, $query); $rowarr = mysql_fetch_array($res); //if the page, which current menuitem links is empty if($rowarr==false){ //the current page is empty - hide its links //check if the link has a class="dir" property - links have this property, if the current menuitem has subentries if( strpos($firstLinkTag, 'class="dir"') <> false ){ //exchange link by span, for this empty menuitem with subitems in the main menu $I['parts']['ATag_begin']=""; $I['parts']['ATag_end']=''; }else if(strpos($wraper, 'class="dir"') <> false){ //exchange link by span, for this empty menuitem with subitems in the second menu $I['parts']['ATag_begin']=""; $I['parts']['ATag_end']=''; } } return $I; } ?> ===== Extension development ===== * Placing custom modules - and customized material in general! - in the **typo3conf/** folder is clever because the typo3conf/ folders content is not touched and can thus be upgraded easily by simply overriding the files when a new version is released * Always prepend your user defined modules with a “u” like in “uPhotomarathon” ==Including something into the head of a plugin page, like CSS or JS == **$this->prefixId** can be replaced by any key, but it should be unique Typo3 wide. Its a good Idea to take $this->prefixId which gives the unique Typo3 key. $GLOBALS['TSFE']->additionalHeaderData[$this->prefixId] = ''; == API for extension development == ^Command used in class.tx_bibtexbrowser_pi1.php ^ what id does^ |t3lib_extMgm::extPath($MYEXTENSIONKEY)| Z:/home/or.temporary/www/typo3conf/ext/latex/| |t3lib_extMgm::extRelPath($MYEXTENSIONKEY)| ../typo3conf/ext/latex/| |t3lib_extMgm::siteRelPath($MYEXTENSIONKEY)| typo3conf/ext/latex/| |function isLoaded($key,$exitOnError=0)| checks if plugin is loaded | |$GLOBALS["TSFE"]->JSeventFuncCalls["onload"]["txfhdmediamap"]="alert('bla');";| calls the JS function alert("bla") when the document loads | |$GLOBALS['TSFE']->additionalJavaScript[$headkey.'31']='function xorx(){alert("xorx")};'| defines the JS function xorx in the doc src | |$GLOBALS['TSFE']->set_no_cache(); | disables cache for a website, where your extension is used | == Flexfields == Flexfields define the backend-GUI, on the page, where the plugin is inserted. Flexfields are html fields, defined in an xml file which is normally named //flexform_ds.xml// ===== Localization (l10n) ===== 1. First install new website language by choosing the page-root (earth or typo3 symbol) in the **Web > List** module and clicking the **add new record > Website Language**. Do not add the default language. {{ http://i51.tinypic.com/262l7yg.png?700 }} {{ http://i54.tinypic.com/f2vtk5.png?700 }} 2. Add the following to the localconf.php file to enforce utf-8 encoding in the backend. // For backend charset $TYPO3_CONF_VARS['BE']['forceCharset'] = 'utf-8'; 3. add something like that to the typoscript template: # language config.linkVars = L config.uniqueLinkVars = 1 config.sys_language_mode = content_fallback config.sys_language_overlay =1 config.sys_language_uid = 0 config.language = de config.locale_all = de_DE #config.sys_language_overlay = hideNonTranslated # deutsch [globalVar = GP:L = 0] config { #typo internal code language = de #country code, win:"german", linux:"de_DE" locale_all = de_DE #set xml:lang manually htmlTag_langKey = de #internal id of this language, 0 default sys_language_uid = 0 } [global] # english [globalVar = GP:L = 1] config { language = en locale_all = en_US htmlTag_langKey = en sys_language_uid = 1 treeLevel = 1 } [global] and the following to generate a language menu LANGUAGES= HMENU LANGUAGES{ # deutsch und englisch special = language special.value = 0,1 1 = TMENU 1 { NO = 1 NO.stdWrap.cObject = TEXT NO.stdWrap.cObject { value = Deutsch || Englisch lang.en = German || English } ACT < .NO ACT.doNotLinkIt=1 ACT.stdWrap.cObject { value = DEUTSCH || Englisch lang.en = German || ENGLISH } USERDEF1 < .NO USERDEF1.stdWrap.cObject { value = DEUTSCH || - lang.en = - || ENGLISH } USERDEF2 < .NO USERDEF2.stdWrap.cObject { value = (DEUTSCH) || Englisch lang.en = German || (ENGLISH) } } } 4. Add the following to the **User TSConfig** for default language to be named and displayed with a flag and a name (here "Deutsch" and "de.gif") #default language label in backend mod.SHARED.defaultLanguageLabel=Deutsch #default language flag file in gfx/flags/ mod.SHARED.defaultLanguageFlag=de.gif {{ http://i54.tinypic.com/nwhj5w.png?400 }} {{ http://i56.tinypic.com/2ch00m9.png?400 }} \\ \\ \\ ** If there are double content entries, after localization - add the following to the CONTENT TypoScript, to filter thecontent: ** select.languageField = sys_language_uid e.g CONTENTSECTION=CONTENT CONTENTSECTION{ table = tt_content select.orderBy = sorting select.where = colPos = 0 select.languageField = sys_language_uid } 5. To activate the browser-language detection install the extension [[http://typo3.org/extensions/repository/?tx_terfe_pi1%5Bview%5D=search&no_cache=1&tx_terfe_pi1%5Bsword%5D=rlmp_language_detection | rlmp_language_detection]] which requires the [[http://typo3.org/extensions/repository/view/static_info_tables/current/|static_info_tables]] extension. When both extensions **rlmp_language_detection** and **static_info_tables** are installed, configure the default language in the Teplate Setup (e.g. german): # language in rlmp_language_detection plugin plugin.tx_rlmplanguagedetection_pi1 { defaultLang = de useOneTreeMethod = 1 } **ATTENTION:** To work, the extension rlmp_language_detection requires all extra languages to be named as defined in [[http://en.wikipedia.org/wiki/List_of_ISO_639-1_codes |ISO_639 two letter code]], like the **en** on the picture: {{ http://i54.tinypic.com/igzv46.png?700 }} ===== Speaking URL ===== The URL can be configured to be more human and search engine friendly by using the **realurl** extension. The following configuration is for multiple languages: Language 0 is German, Language 1 is English. ==1. Extension == Install the **realurl** extension ==2. Typoscript template == Add the following typoscript to the template. ## REALURL ## config { simulateStaticDocuments = 0 tx_realurl_enable = 1 } config.baseURL = http://or.temporary/ [globalString = ENV:HTTP_HOST = or.nu] config.baseURL = http://or.nu/ [globalString = ENV:HTTP_HOST = orsite.co.cc] config.baseURL = http://orsite.co.cc/ [global] ==3. Edit ext_localconf.php== Configure the extension in the **\typo3conf\ext\realurl\ext_localconf.php** $TYPO3_CONF_VARS['EXTCONF']['realurl']['_DEFAULT'] = array( 'init' => array( 'enableCHashCache' => 1 ), 'preVars' => array( array( 'GETvar' => 'L', 'valueMap' => array( 'de' => '0', 'en' => '1', ), 'valueDefault' => 'de', # 'noMatch' => 'bypass', ), array( 'GETvar' => 'no_cache', 'valueMap' => array( 'no_cache' => 1, ), 'noMatch' => 'bypass', ), ), 'fileName' => array ( 'index' => array( 'backend.php' => array( 'keyValues' => array ( 'type' => 100, ) ), 'print' => array( 'keyValues' => array( 'type' => 98, ) ), ), ), 'postVarSets' => array( '_DEFAULT' => array ( 'article' => array( array( 'GETvar' => 'tx_ttnews[tt_news]', ), array( 'GETvar' => 'tx_ttnews[backPid]', ), ), 'category' => array( array( 'GETvar' => 'tx_ttnews[cat]', ), ), 'neste' => array( array( 'GETvar' => 'tx_ttnews[pointer]', ), ), ), ), 'pagePath' => array( 'type' => 'user', 'userFunc' => 'EXT:realurl/class.tx_realurl_advanced.php:&tx_realurl_advanced->main', 'spaceCharacter' => '-', 'languageGetVar' => 'L', 'expireDays' => 3 ), ); ==4. htaccess== Add the following configuration to the **.htaccess** in the root folder of typo3. RewriteEngine On RewriteRule ^typo3$ - [L] RewriteRule ^typo3/.*$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{REQUEST_FILENAME} !-l RewriteRule .* index.php ===== Backend customization by TYPOSCRIPT ===== Here the Backend customizations are done for a specific user inside of the TSConfig: {{ http://i54.tinypic.com/nwhj5w.png?600 }} {{ http://i56.tinypic.com/2ch00m9.png?600 }} == Hide columns == Left 1 Normal 0 Right 2 Border 3 #shows only columns Normal and Right mod.SHARED.colPos_list = 0,2 == Language == If multiple languages are used on the side - cusomize the default language #default language label in backend mod.SHARED.defaultLanguageLabel=Deutsch #default language flag file in gfx/flags/ mod.SHARED.defaultLanguageFlag=de.gif == Allow recursive deleting of pages== If multiple languages are used on the side - cusomize the default language setup.override.recursiveDelete=1 ===== Backend customization by BACKEND LAYOUT ===== Since Typo 4.5 it is possible to customize the column names and positions in the backend: 1. First create a new Backend column Layout: by choosing the root page **Web>List** module {{ http://i56.tinypic.com/29409d1.png?600 }} and adding a new **Backend Layout** {{ http://i54.tinypic.com/s28y94.png?600 }} by choosing a Title and clicking the Wizard button {{ http://i53.tinypic.com/155s20w.png?600 }} and creating a custom column layout, by using the following column numbers: ^Column^ Column Number^ |NORMAL|0| |LEFT|1| |RIGHT|2| |BORDER|3| {{ http://i51.tinypic.com/28a2ufm.png?600 }} finally add th layout to the chosen page in the **web>page** module by clicking **edit page properties > Appearence** and choosing the predefined Layout {{ http://i55.tinypic.com/olf00.png?600 }} {{ http://i53.tinypic.com/2z54ruq.png?600 }} so that the backend will look as following, if you defined a top column and a bottom column {{ http://i53.tinypic.com/2ih8kfd.png?600 }} ===== localconf.php ===== In the file localconf.php, which is found the the Typo3 root directory, some global configurations are done in Typo3. Here the changes of system arrays like // $TYPO3_CONF_VARS...// are done. ==Set the encoding== // For backend charset $TYPO3_CONF_VARS['BE']['forceCharset'] = 'utf-8'; ===== Search ===== === Indexed Search (indexed_search) === Indexed search is an extension, which can check the site content and provide a searchbox. It needs severalt extensions to work fine: - //indexed_search// - //crawler// - //macina_searchbox// Install them all and configure them as given below. == 1. Search results site == Create a special page, where the search results will be displayed. Check it's pid. Assuming the pid is 133. You wil need this below. Hide the result page in the menu, so that it is not listed as a menu entry. == 2. Add the results plugin to the results site == Add the **general plugin** named **Indexed search** to the results site. {{http://i53.tinypic.com/2dubm6o.png?600}} {{http://i56.tinypic.com/1ruaue.png?600}} == 3. new search results template == Create a new search results template. Examples can be found in // \typo3\sysext\indexed_search\pi\ // Assuming that a new template is named \\ fileadmin/templates/search/search.html \\ You wil need this below. == 3. Entry into the main template== Use the pid and the path to the template. # search - enable indexed search config.index_enable = 1 # search - set the search-result page id plugin.tx_macinasearchbox_pi1.pidSearchpage = 133 # set a new template for search results plugin.tx_indexedsearch.templateFile = fileadmin/templates/search/search.html == 3. Retrieve the information from your site by using crawler== === Site crawler (crawler) === == 1. Create an index configuration == Use the **List** module on the root page. Click "Add new record" to add a new **Crawler Configuration**. {{http://i51.tinypic.com/2rf5xrd.png?600}} {{http://i51.tinypic.com/5folmt.png?600}} == 2. Crawl the site == Use the **Info** module on the page you want to crawl (root?). Choose the **Site crawler** in the upper dropdown. Choose the crawler configuration, created in the step 2. Click crawl site to start crawling. {{http://i53.tinypic.com/r037z6.png}} == 3. Add a backend user == The crawler needs a backend user named "_cli_crawler" to work fine. Add the user by using the **User Admin** module. The password is not important. == 3. Add searchbox == The searchbox can be added by using the **macina_searchbox** extension. === Searchbox (macina_searchbox) === To add the searchbox somewhere into the design template. == 1. Add a new section somewhere into the template == Searchbox will be here == 2. Edit the the template to replace teh section by the searchbox == SEARCHSECTION > SEARCHSECTION < plugin.tx_macinasearchbox_pi1