Le client désirait remonter d’un niveau les éléments qui se trouvent dans « actions sur la page ».

Pour visualiser le TSconfig qui gère l’affichage du menu contextuel. Il vous suffit de vous rendre dans le module « Administration des utilisateur » et de d’activer l’affichage du TSconfig.

Le TSconfig par défaut, se présente comme ci-dessous :

options.contextMenu.table.pages {
	disableItems =
	items {
		100 = ITEM
		100 {
			callbackAction = viewPage
			displayCondition = canBeViewed != 0
			label = LLL:EXT:lang/locallang_core.xml:cm.view
			name = view
			spriteIcon = actions-document-view
		}

		200 = DIVIDER

		300 = ITEM
		300 {
			callbackAction = disablePage
			displayCondition = getRecord|hidden = 0 && canBeDisabledAndEnabled != 0
			label = LLL:EXT:lang/locallang_common.xml:disable
			name = disable
			spriteIcon = actions-edit-hide
		}

		400 = ITEM
		400 {
			callbackAction = enablePage
			displayCondition = getRecord|hidden = 1 && canBeDisabledAndEnabled != 0
			label = LLL:EXT:lang/locallang_common.xml:enable
			name = enable
			spriteIcon = actions-edit-unhide
		}

		500 = ITEM
		500 {
			callbackAction = editPageProperties
			displayCondition = canBeEdited != 0
			label = LLL:EXT:lang/locallang_core.xml:cm.edit
			name = edit
			spriteIcon = actions-document-open
		}

		600 = ITEM
		600 {
			callbackAction = openInfoPopUp
			displayCondition = canShowInfo != 0
			label = LLL:EXT:lang/locallang_core.xml:cm.info
			name = info
			spriteIcon = actions-document-info
		}

		700 = ITEM
		700 {
			callbackAction = openHistoryPopUp
			displayCondition = canShowHistory != 0
			label = LLL:EXT:lang/locallang_misc.xml:CM_history
			name = history
			spriteIcon = actions-document-history-open
		}

		800 = DIVIDER

		900 = SUBMENU
		900 {
			100 = ITEM
			100 {
				callbackAction = newPageWizard
				displayCondition = canCreateNewPages != 0
				label = LLL:EXT:lang/locallang_core.xml:cm.new
				name = new
				spriteIcon = actions-page-new
			}

			200 = DIVIDER

			300 = ITEM
			300 {
				callbackAction = enableCutMode
				displayCondition = isInCutMode = 0 && canBeCut != 0 && isMountPoint != 1
				label = LLL:EXT:lang/locallang_core.xml:cm.cut
				name = cut
				spriteIcon = actions-edit-cut
			}

			400 = ITEM
			400 {
				callbackAction = disableCutMode
				displayCondition = isInCutMode = 1 && canBeCut != 0
				label = LLL:EXT:lang/locallang_core.xml:cm.cut
				name = cut
				spriteIcon = actions-edit-cut-release
			}

			500 = ITEM
			500 {
				callbackAction = enableCopyMode
				displayCondition = isInCopyMode = 0 && canBeCopied != 0
				label = LLL:EXT:lang/locallang_core.xml:cm.copy
				name = copy
				spriteIcon = actions-edit-copy
			}

			600 = ITEM
			600 {
				callbackAction = disableCopyMode
				displayCondition = isInCopyMode = 1 && canBeCopied != 0
				label = LLL:EXT:lang/locallang_core.xml:cm.copy
				name = copy
				spriteIcon = actions-edit-copy-release
			}

			700 = ITEM
			700 {
				callbackAction = pasteIntoNode
				displayCondition = getContextInfo|inCopyMode = 1 || getContextInfo|inCutMode = 1 && canBePastedInto != 0
				label = LLL:EXT:lang/locallang_core.xml:cm.pasteinto
				name = pasteInto
				spriteIcon = actions-document-paste-into
			}

			800 = ITEM
			800 {
				callbackAction = pasteAfterNode
				displayCondition = getContextInfo|inCopyMode = 1 || getContextInfo|inCutMode = 1 && canBePastedAfter != 0
				label = LLL:EXT:lang/locallang_core.xml:cm.pasteafter
				name = pasteAfter
				spriteIcon = actions-document-paste-after
			}

			900 = DIVIDER

			1000 = ITEM
			1000 {
				callbackAction = removeNode
				displayCondition = canBeRemoved != 0 && isMountPoint != 1
				label = LLL:EXT:lang/locallang_core.xml:cm.delete
				name = delete
				spriteIcon = actions-edit-delete
			}

			label = LLL:EXT:lang/locallang_core.xml:cm.copyPasteActions
		}
	}
}

L’élément 900 est le sous-menu que nous voulons modifier.

Il suffit donc d’ajouter ce TSconfig aux utilisateurs ou groupes d’utilisateur.

## Modif de présentation du menu contextuel.
# Les élément se trouvant dans "action sur la page" sont remontés d'un niveau
options.contextMenu.table.pages.items {

	# del default submenu
	900 >

	# newPageWizard
	900 = ITEM
	900 {
		callbackAction = newPageWizard
		displayCondition = canCreateNewPages != 0
		label = LLL:EXT:lang/locallang_core.xml:cm.new
		name = new
		spriteIcon = actions-page-new
	}

	910 = DIVIDER

	# enableCutMode
	920 = ITEM
	920 {
		callbackAction = enableCutMode
		displayCondition = isInCutMode = 0 && canBeCut != 0 && isMountPoint != 1
		label = LLL:EXT:lang/locallang_core.xml:cm.cut
		name = cut
		spriteIcon = actions-edit-cut
	}

	# disableCutMode
	930 = ITEM
	930 {
		callbackAction = disableCutMode
		displayCondition = isInCutMode = 1 && canBeCut != 0
		label = LLL:EXT:lang/locallang_core.xml:cm.cut
		name = cut
		spriteIcon = actions-edit-cut-release
	}

	# enableCopyMode
	940 = ITEM
	940 {
		callbackAction = enableCopyMode
		displayCondition = isInCopyMode = 0 && canBeCopied != 0
		label = LLL:EXT:lang/locallang_core.xml:cm.copy
		name = copy
		spriteIcon = actions-edit-copy
	}

	# disableCopyMode
	950 = ITEM
	950 {
		callbackAction = disableCopyMode
		displayCondition = isInCopyMode = 1 && canBeCopied != 0
		label = LLL:EXT:lang/locallang_core.xml:cm.copy
		name = copy
		spriteIcon = actions-edit-copy-release
	}

	# pasteIntoNode
	960 = ITEM
	960 {
		callbackAction = pasteIntoNode
		displayCondition = getContextInfo|inCopyMode = 1 || getContextInfo|inCutMode = 1 && canBePastedInto != 0
		label = LLL:EXT:lang/locallang_core.xml:cm.pasteinto
		name = pasteInto
		spriteIcon = actions-document-paste-into
	}

	# pasteAfterNode
	970 = ITEM
	970 {
		callbackAction = pasteAfterNode
		displayCondition = getContextInfo|inCopyMode = 1 || getContextInfo|inCutMode = 1 && canBePastedAfter != 0
		label = LLL:EXT:lang/locallang_core.xml:cm.pasteafter
		name = pasteAfter
		spriteIcon = actions-document-paste-after
	}

	# divider
	980 = DIVIDER

	# removeNode
	990 = ITEM
	990 {
		callbackAction = removeNode
		displayCondition = canBeRemoved != 0 && isMountPoint != 1
		label = LLL:EXT:lang/locallang_core.xml:cm.delete
		name = delete
		spriteIcon = actions-edit-delete
	}
}

Dans cet exemple, j’ai vidé le SUBMENU. Puis, j’ai réécrit un par un tous les éléments du menu mais un niveau plus haut.

Une solution plus courte pourait être de reprendre les configurations déjà existantes puis vider le SUBMENU. Cela donnerait quelque chose dans ce genre :

## Modif de présentation du menu contextuel.
# Les élément se trouvant dans "action sur la page" sont remontés d'un niveau
options.contextMenu.table.pages.items {

	801 < .900.100
	802 = DIVIDER
	803 < .900.300
	804 < .900.400
	805 < .900.500
	806 < .900.600
	807 < .900.700
	809 < .900.800
	810 = DIVIDER
	811 < .900.1000

	# del default submenu
	900 >
}

Cette solution nécessite beaucoup mois de code. A vous de voir laquelle vous désirez utiliser.
Ces configurations ont été faites sur la version 4.5.3 de Typo3

Admettons que vous avez des contributeurs qui publient des news. Ces news sont enregistrées dans un sysfolder spécifique.
Vous ne souhaitez pas que vos contributeurs enregistre les news dans n’importe quelle page de votre arborescence. Et bien, vous pouvez forcer l’enregistrement des nouveau enregistrement de news dans un PID spécifique.

Pour ce faire, il suffit d’ajouter ce code dans le TSconfig de vos page.

# New tt_news records will be save in this page
mod.web_txttnewsM1 {
    list {
        pidForNewArticles = 4
    }
}

Il vous suffit de remplacer le « 4″ par l’id de votre sysfolder.

J’espère que cela aura pu vous être utile.

J’ai eu un peu de peine à trouver sur le net une configuration de Realurl pour l’extension Calendar Base (ou cal). Je l’ai donc refaite.

La voici pour vous (et pour le même prix, vous avez droit à tt_news) :

<?php
	/**
	 * RealURL configuration
	 *
	 * @author		Cédric Aellen
	 * @version		1.0
	 */
	$TYPO3_CONF_VARS['EXTCONF']['realurl'] = array(

		// Default host
		'_DEFAULT' => array(

			// General configuration
			'init' => array(
				'doNotRawUrlEncodeParameterNames' => 0,
				'enableCHashCache'                => 1,
				'respectSimulateStaticURLs'       => 1,
				'adminJumpToBackend'              => 0,
				'enableUrlDecodeCache'            => 1,
				'enableUrlEncodeCache'            => 0,
				'appendMissingSlash'              => 'ifNotFile'
			),

			// Redirections
			'redirects' => array(),

			// Pre variables
			'preVars' => array(

				// Language
				array(
					'GETvar'       => 'L',
					'valueDefault' => 'fr',
					'valueMap'     => array(
						'fr' => '0',
						'de' => '2',
						'en' => '3'
					)
				),

				// No cache
				array(
					'noMatch'  => 'bypass',
					'GETvar'   => 'no_cache',
					'valueMap' => array(
						'no_cache' => 1,
					)
				),

			),

			// Transformation method
			'pagePath' => array(
				'type'           => 'user',
				'userFunc'       => 'EXT:realurl/class.tx_realurl_advanced.php:&tx_realurl_advanced->main',
				'spaceCharacter' => '-',
				'languageGetVar' => 'L',
				'expireDays'     => 3,
				'rootpage_id'    => 1,
			),

			// Fixed post variables
			'fixedPostVars' => array(),

			// Post variables
            'postVarSets' => array
            (
                '_DEFAULT' => array
                (
                    /***********************************************************
                     * tt_news
                     **********************************************************/
                    'archive' => array
                    (
                        array
                        (
                            'GETvar' => 'tx_ttnews[year]'
                        ),
                        array
                        (
                            'GETvar'   => 'tx_ttnews[month]',
                            'valueMap' => array
                            (
                                'january'   => '01',
                                'february'  => '02',
                                'march'     => '03',
                                'april'     => '04',
                                'may'       => '05',
                                'june'      => '06',
                                'july'      => '07',
                                'august'    => '08',
                                'september' => '09',
                                'october'   => '10',
                                'november'  => '11',
                                'december'  => '12'
                            )
                        )
                    ),
                    'browse' => array
                    (
                        array
                        (
                            'GETvar' => 'tx_ttnews[pointer]'
                        )
                    ),
                    'select_category' => array
                    (
                        array
                        (
                            'GETvar' => 'tx_ttnews[cat]'
                        )
                    ),
                    'article' => array
                    (
                        array
                        (
                            'GETvar' => 'tx_ttnews[tt_news]',
                            'lookUpTable' => array
                            (
                                'table'               => 'tt_news',
                                'id_field'            => 'uid',
                                'alias_field'         => 'title',
                                'addWhereClause'      => ' AND NOT deleted',
                                'useUniqueCache'      => 1,
                                'useUniqueCache_conf' => array
                                (
                                    'strtolower'     => 1,
                                    'spaceCharacter' => '-'
                                )
                            )
                        ),
                        array(
                            'GETvar' => 'tx_ttnews[swords]'
                        )
                    ), // tt_news [end]

                    /***********************************************************
                     * cal
                     **********************************************************/
                    'cal' => array(
                    	array(
                    		'GETvar' => 'tx_cal_controller[view]'
                    	),
                    	array(
                    		'GETvar' => 'tx_cal_controller[type]'
                    	),
                    	array(
                    		'GETvar' => 'tx_cal_controller[uid]',
                    		'lookUpTable' => array(
                    			'table' 				=> 'tx_cal_event',
                    			'id_field' 				=> 'uid',
                    			'alias_field'			=> 'title',
                    			'addWhereClause'		=> ' AND deleted !=1',
                    			'useUniqueCache'		=> 1,
                    			'useUniqueCache_conf'	=> array(
                    				'strtolower'			=> 1,
                    				'spaceCharacter'		=> '-',
                    			),
                    		),
                    	),
                    	array(
                    		'GETvar' => 'tx_cal_controller[lastview]'
                    	),
                    	array(
                    		'GETvar' => 'tx_cal_controller[year]'
                    	),
                    	array(
                    		'GETvar' => 'tx_cal_controller[month]'
                    	),
                    	array(
                    		'GETvar' => 'tx_cal_controller[day]'
                    	),
                    	array(
                    		'GETvar' => 'tx_cal_controller[category]',
                    		'lookUpTable' => array(
                    			'table' 				=> 'tx_cal_category',
                    			'id_field' 				=> 'uid',
                    			'alias_field'			=> 'title',
                    			'addWhereClause'		=> ' AND deleted !=1',
                    			'useUniqueCache'		=> 1,
                    			'useUniqueCache_conf'	=> array(
                    				'strtolower'			=> 1,
                    				'spaceCharacter'		=> '-',
                    			),
                    		),
                    	),
                    ) // cal [end]

                    // defin here more extension
                )
            ),

			// File names
			'fileName' => array(
				'index' => array(
					'_DEFAULT' => array(
						'keyValues' => array(),
					),
					'index.html' => array(
						'keyValues' => array(),
					),
				),
			),
		),
	);
?>

Les versions utilisées :

• Typo3 4.5
• cal 1.3.3
• tt_news 3.0.1

Je mets actuellement un site sur pied. Par soucis de découverte et d’apprentissage, j’ai opté pour le HTML5. Voici quelques trucs (et autre) que j’ai dû mettre en place pour ce faire :

1. Lire HTML5 for Webdesigners
2. Faire un template en respectant la norme et utilisant les nouvelles balises (<nav>, <header>, etc.)
3. Modifier le doctype dans le setup du gabarit de base.

   config.doctype = html_5
   config.xmlprologue = none
   

4. Utiliser le JavaScript HTML5 IE enabling script pour toutes les versions de IE inferieur à la 9 (merci IE).
   Il suffit d’ajouter le code suivant dans le setup du gabarit de base

   #if MS Internet Explorer
   [browser = msie] AND [version < 9]
   page.headerData = CARRAY
       page.headerData {
           10 = TEXT
           10.value (
               <!--[if lt IE 9]>
               <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
               <![endif]-->
           )
       }
   [end]
   

5. etc…

Si vous avez d’autre trucs ou configuration, n’hésitez pas à les partager

Avec la fin de l’année qui approche, voici une petit exemple pour créer un index sur une page.

Sur une page, l’index liste les différents éléments de contenu qui la compose et renvoie vers ceux-ci.

Il faudra bien entendu mapper ce code à l’endroit où vous voulez qu’il figure sur votre page.

#####################################################################
# [summary]

lib.summary = COA
lib.summary {
    30 = TEXT
    30 < styles.content.get
    30 {
        stdWrap.wrap = <ul>|</ul>
        select.andWhere = sectionIndex!=0
        select.pidInList.override.field = pages
        renderObj = TEXT
        renderObj {
            noBlur = 1
            fieldRequired = header
            trim=1
            field = header
            htmlSpecialChars = 1
            wrap = <li>|</li>
            typolink.parameter.field = pid
            typolink.section.field = uid
            typolink.ATagParams = style="color: #000000; text-decoration: none;"
        }
        stdWrap.if.isTrue.numRows {
            table = tt_content
            select {
                where = sectionIndex!=0
                andWhere = colPos =0
                andWhere = hidden =0
                pidInList = this
                pidInList.override.field = pages
            }
        }
    }
}

voilà voilà

Les pages accessibles par deux URLs différents commencent à poser certains problèmes de référencement. En effet, une page qui est accessible par deux URLs (ou plus) sera indexée deux fois (ou plus) par les moteurs de recherche.

Pour palier à ce problème, les principaux moteurs de recherche ont proposé d’introduire la balise ci-dessous :

<link rel="canonical" href="URL" />

Le principe est de permettre au webmaster d’indiquer pour chaque page de son site quelle est l’URL canonique, c’est-à-dire l’URL officielle de la page.
Le site WebRankInfo propose un article à ce sujet.

Et dans Typo3 ?

L’extension realurl sur Typo3 permet de transformer  des URLs techniques de type www.monsite.com/index.php?id=100 en URL accessibles (« human readable ») de type www.monsite.com/macategorie/mapage.

Une fois realurl installé, toute la navigation doit se faire avec des URLs accessibles. Mais voilà, il peut arriver qu’un URL technique traine par ci par là. De ce fait, si une page peut être visitée via un URL accessible et un URL technique, elle sera indexée deux fois.

Pour palier à ce problème, voici comment créer la balise  en Typoscript :

# Canonical Link
page.headerData.50 = COA
page.headerData.50 {
    10 = TEXT
    10 {
        typolink {
            parameter.data = TSFE:id
            returnLast = url
        }
        wrap = <link rel="canonical" href="{$lib.constants.baseUrl}|" / >
    }
}

A noté que ce code doit être adapté. Il ne prend pas en compte les variables des extensions qui seraient dans l’URL.

(Bien entendu, cet article est destiné à évoluer )

ImageMagik

La gestion et traitement des images est un grand atout de Typo3. Celui-ci utilise par défaut ImageMagik. Malheureusement non disponible, il faudra se tourner vers la libraire GD 2.
Pour ce faire, il vous suffit d’installer l’extension JD_GB_Resize.

Je n’ai pas encore testé les images transparentes. A ce qu’il parait, il y a quelques problèmes à ce niveau. Dès que j’ai effectuer quelques essais, je vous en parle.

Curl

Afin de pouvoir télécharger les extension directement depuis le gestionnaire Typo3, il faut activer le mode Curl dans « Installation« . Afin que Typo3 puisse communiquer avec des sites tierce, dans « All Configuration« , il faut modifier la variable « curlUse » comme suit :

[SYS][curlUse] = 1

Lorsque vous passez votre site dans YSlow, celui-ci vous dit de placer vos JavaScript à la fin de vos page.

Par défaut, Typo3 les insère dans les balises . C’est à dire en haut de page.

Voici un exemple comment procéder avec le JavaScript de GoogleAnalytics :

######################
# [Google Analytics]

lib.all.googleAnalytics = TEXT
lib.all.googleAnalytics {
	wrap (
		<!-- Google Analytics -->
		<script type="text/javascript">
		var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
		document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
		</script>
		<script type="text/javascript">
		try{
		var pageTracker = _gat._getTracker("|");
		pageTracker._trackPageview();
		} catch(err) {}
		</script>
		<!-- Google Analytics end -->
	)

	value = {$lib.constants.divers.googleAnalyticsUA}
}

page.20 < lib.all.googleAnalytics

# Google Analytics n'est pas activé en valid en intégration
[globalString = ENV:HTTP_HOST=valid.monsite.ch, ENV:HTTP_HOST=integration.monsite.ch]
	lib.vd09.all.googleAnalytics >
	page.20 >
[GLOBAL]

Comme vous le voyez dans les dernière ligne, je n’active pas le script dans mes environnements de validation et d’intégration

A noter avec Typo3 4.3, il est possible d’utiliser la focntion suivante :

page.includeJSFooter.file1 = file.js

Un petit truc pour mes amis « typoteurs ». Typo3 permet de créer du texte sous forme d’image. Mais voilà, l’objet Gifbuilder qui permet cela ne gère pas le multi ligne automatiquement.
Voici comment y parvenir …

Disons qu’on veut créer une en-tête de page sous forme d’image. Dans cette image, il nous faut trois lignes à disposition pour y écrire du texte.

Pour ce faire, nous allons utiliser le champ « résumé » (abstract) des propriétés de la page. Si rien n’est définie dans ce champ, les pages parentes vont être remontées jusqu’à trouver une valeur à utiliser (slide).

Pour pouvoir utiliser le champ « résumé », il faut ajouter « abstract » à  la variable $TYPO3_CONF_VARS['FE']['addRootLineFields'] dans l’install tool (typo3conf/localconf.php)

Bien entendu pour que cela fonctionne, il faut mapper notre en-tête dans le gabarit TamplaVoilà. Celui-ci doit être de type « TypoScript Object Path » ou un objet TypoScript si vous préférez. Nous allons l’appeler lib.header.title.

Une fois que c’est fait, voici la configuration TypoScript que doit se trouver dans le gabarit du site.

#####################################################################
# [Header Title Image]
#
# Le texte affiché correspond à  ce qui se trouve dans le champ
# abstract de la page
#
# Les lignes sont séparées par des tubes (|)
# ex : ligne1 | ligne2 | ligne3
#
# La troisième ligne est ajustée en-bas du GIF. La deuxième est au-dessus et
# la première encore au-dessus

lib.header.title = IMAGE
lib.header.title.file = GIFBUILDER
lib.header.title.file {

#dim de l'image
XY = 329,150
#couleur de fond de l'image
backColor = #ffffff

#Première ligne
10 = TEXT
10 {
  #Les titres sont éditables jusqu'au niveau -10 du site
  text.data = fullRootLine:10, abstract, slide
  #char de retour à la ligne
  text.listNum.splitChar=|
  #première partie du contenu du champ "résumé" (jusqu'au premier tube)
  text.listNum = 0
  # couleur de la police
  fontColor = #333333
  # le texte est aligné à droite du gif
  align = right
  #espacement entre les mots
  wordSpacing = 2
  #taille de la police
  fontSize = 28
  #police (il faut un format TTF)
  fontFile = fileadmin/templates/library/fonts/maPolice.ttf
  #positionnement du texte par rapport au bord droite (vu que aligné à droite et au haut)
  offset = -10,75
  #nicetext activé
  nicetext = 1
}

#Pour les deux ligne suivantes, on écrase que les configs qu'on veut modifier

#Deuxième ligne
20 > .10
#deuxième partie du contenu du champ "résumé" (entre le premier tube et le deuxième)
20.text.listNum = 1
#positionnement
20.offset = -10,105

#Troisième ligne
30 > .10
#deuxième partie du contenu du champ "résumé" (après le deuxième tube)
30.text.listNum = 2
#positionnement
30.offset = -10,135 }

# Sur la homepage je veux une image par défaut
# 1 est l'id de ma rootpage
[treeLevel=0] && [PIDinRootline = 1] lib.header.title >
  lib.header.title = IMAGE
  lib.header.title {
    file = fileadmin/templates/library/image/header.title.png
    altText = Image d'en-tête du site
  }
[GLOBAL]

Bien entendu, on peux utiliser plus de trois lignes. Il suffit d’adapter ce script.

Il s’agit d’une astuce toute simple. De temps à autre on désire paramétrer le contenu des balises de titre de la page.

Il suffit d’entrer le Typoscript suivant dans le Setup de votre gabarit de base.

config.noPageTitle = 2
page.headerData {
		5 = TEXT
		# on wrap (|) le contenu de filed
		5.wrap = <title>Mon site : blabla : |</title>
		# field contient le sous-titre ou si vide le titre
		5.field = subtitle // title
}