DCE: FAL Bilder mit Link

Wenn man im DCE Eingabetyp Bild auswählt, dann wird automatisch ein FlexForm generiert. Bald fällt aber auf, dass bei der Eingabe des Bildes die Felder Link und alternativer Text fehlen. Das kann schnell korrigiert werden, wenn man folgenden Schnipsel in das generierte XML in der Konfiguration des entsprechenden DCE-Feldes eingibt:

<config>
	[...]
	<foreign_types type="array">
		<numIndex index="2" type="array">
			<showitem>--palette--;LLL:EXT:lang/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette</showitem>
		</numIndex>
	</foreign_types>
	[...]
</config>

Die Lösung und die Erklärung fand sich in den Mailinglisten. Entscheidend bei dem Schnipsel ist numIndex=“2″:

Index 2 = \TYPO3\CMS\Core\Resource\File::FILETYPE_IMAGE

Geschrieben in TYPO3 | Kommentare deaktiviert für DCE: FAL Bilder mit Link

Felder im Flexform mit TypoScript ausblenden

Es ist möglich, Felder in Backend-Formularen mit TypoScript im PageTSconfig zu konfigurieren. So können Felder umbenannt und ausgeblendet werden. Natürlich erwartet man dann ja auch, dass es genauso für Felder im FlexForm des Plugins gilt. Und TYPO3 enttäuscht mich nicht – es geht. Dieser Beitrag auf jweiland beschreibt wie. Nun wollte ich einige Felder im Flexform der Extension news ausblenden. Das folgende TypoScript ost eigentlich richtig, funktioniert aber nicht:

TCEFORM.tt_content.pi_flexform.news_pi1.additional {
	settings.tags.disabled = 1
	settings.topNewsFirst.disabled = 1
	settings.excludeAlreadyDisplayedNews.disabled = 1
	settings.disableOverrideDemand.disabled = 1
}

Wenn man etwas darüber nachdenkt, ist es ja auch logisch: In TypoScript gilt der Punkt als Trenner, somit bezieht sich das disabled nicht auf settings.tags sondern auf tags, das ein Unterobjekt von settings ist. Und das existiert natürlich nicht. Zum Glück ist es schon vor einiger Zeit ein paar Leuten aufgefallen und es gab einen Bug-Report dazu. Die Lösung: man kann Punkte, die Teil der Felddeklaration sind in TypoScript mit einem Backslash escapen. Somit sieht die funktionierende Konfiguration so aus:

TCEFORM.tt_content.pi_flexform.news_pi1.additional {
	settings\.tags.disabled = 1
	settings\.topNewsFirst.disabled = 1
	settings\.excludeAlreadyDisplayedNews.disabled = 1
	settings\.disableOverrideDemand.disabled = 1
}

Geschrieben in TYPO3 | Kommentare deaktiviert für Felder im Flexform mit TypoScript ausblenden

TYPO3 6.2. SQL Queries ausgeben

Es ist nicht die schönste Variante, aber die einzige, die bei mir bisher funktioniert. Um SQL Queries in TYPO 6.2. auszugeben, fügt man in der Datei typo3/sysext/extbase/Classes/Persistence/Generic/Storage/Tyo3DbBackend.php in der Funktion getRowsFromDatabase (ungefähr Zeile 340) folgenden Block ein:

echo $this->databaseHandle->SELECTquery(
	$queryCommandParameters['selectFields'],
	$queryCommandParameters['fromTable'],
	$queryCommandParameters['whereClause'],
	'',
	$queryCommandParameters['orderBy'],
	$queryCommandParameters['limit']
);
echo "\n\n";

Geschrieben in TYPO3 | Kommentare deaktiviert für TYPO3 6.2. SQL Queries ausgeben

TYPO3 Breite der Bilder in Gridelement setzen

Eigentlich ist es so einfach, aber ich habe die richtige Lösung erst nach so langer Zeit gefunden, dass ich es posten wollte. Die Entwickler von Gridelements haben daran gedacht und vorgesehen, dass man Bildgrößen pro Spalte festlegen kann. Es steht sogar in dem TypoScript-Setup der Extension. Und so einfach gehts: mit LOAD_REGISTER den Wert der Variablen maxImageWidth setzen und danach mit RESTORE_REGISTER wieder zurücksetzen.

tt_content.gridelements_pi1.20.10.setup {
	# Three Columns (ID 1)
	1 < lib.gridelements.defaultGridSetup
	1 {
		prepend < lib.stdheader
 
		columns {
			# colPos ID
			11 < .default
			11.wrap = <div class="col-md-4">|</div>
			11.renderObj.10 = LOAD_REGISTER
			11.renderObj.10.maxImageWidth = 288
			11.renderObj.30 = RESTORE_REGISTER
			[...]
		}
 
		wrap = <div class="columns-3 clearfix">|</div>
	}
}

Geschrieben in TYPO3 | Kommentare deaktiviert für TYPO3 Breite der Bilder in Gridelement setzen

TYPO3: RTE in Feld von Extension anpassen

In der eigenen Extension (oder auch einer fremden) kommt auch mal der RTE zum Einsatz. Damit haben Redakteure die Möglichkeit, Text zu formatieren. Meistens aber sollen sie nicht die gleichen Formatierungsmöglichkeiten haben wie im kompletten RTE. Meistens reicht ja Fett und Kursiv aus. Wie kann man den RTE in der eigenen Extension konfigurieren?

Als erstes sollte das betreffende Feld als RTE definiert sein. Der folgende Code-Schnipsel bezieht sich auf die Definition des Feldes im TCA:

'description' => array(
	'exclude' => 1,
	'l10n_mode' => 'prefixLangTitle',
	'label' => 'Textfeld mit RTE',
	'config' => array(
		'type' => 'text',
		'cols' => '30',
		'rows' => '5',
	),
	'defaultExtras' => 'richtext:rte_transform[flag=rte_enabled|mode=ts]',
),

Leider gibt es keine Möglichkeit, den RTE schon dort zu konfigurieren. Wenn man nicht weiter macht, wird ein RTE mit der Standardkonfiguration ausgegeben.

Per PageTSconfig kann man aber den RTE für jedes Feld speziell konfigurieren. Und zwar so:

RTE.config.[my_table].[my_field] {
}

Anstatt my_table setzt man der Namen der Tabelle ein – dieser sieht etwas so aus tx_myext_domain_model_xxx. Anstatt my_field der Name des Feldes, für den der RTE konfiguriert werden soll, in dem Beispiel description.

Diese Konfiguration kann man auch in die PageTSconfig-Datei schreiben, die man bei den Templates in fileadmin ablegt. Wenn man diese Konfiguration jedoch mit der Extension installieren möchte, schreibt man diese am besten in eine Datei. Diese Datei heißt im Beispiel page_tsconfig.txt und wird in der Extension unter Configuration/TypoScript/ gespiechert.

Dann wird diese Datei über ext_localconf.php direkt ins PageTSconfig eigebunden:

\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addPageTSConfig('<INCLUDE_TYPOSCRIPT: source="FILE:EXT:myext/Configuration/TypoScript/page_tsconfig.txt">');

Und das wars schon 🙂 Die RTE Konfiguration kann man natürlich auch direkt in PageTSconfig schreiben und damit RTE Konfiguration für fremde Extensions anwenden.

Geschrieben in TYPO3 | Kommentare deaktiviert für TYPO3: RTE in Feld von Extension anpassen

Gmap3: Google Map Kartenstyling mit Snazzymaps

Gmap3 ist ein jQuery Plugin mit dem sich einfach Google Maps erstellen lassen. Beispiele dafür gibt es auf der Seite genug. Es gibt auch ein Beispiel für eine gestylte Map, aber da wird der Kartenstil umgestellt und ich wollte nur eine Karte mit einem voreinstellten Stil. Für Google Maps gibt es so viele Einstellungen bzgl. Styling, Google stellt bereits einen Wizard zur Verfügung, mit dem man die Kartenstile ausprobieren kann. Noch einfach ist es mit Snazzy Maps. Es ist ein Repository für bereits erstellte Google Map Styles. Selbst wenn nichts genau den eigenen Geschmack trifft, dann kann man einen fertigen Stil nehmen und nur etwas anpassen.

Wie bringt man beides unter einen Hut? Was macht man mit dem Schnipsel, den man bei Snazzy Maps zu jeder Karte findet? Und so einfach ist es, wenn man es weiß:

$("#gmap").gmap3({
	marker: {
		values: locations,
	},
	map: {
		options: {
			// How you would like to style the map. 
			// This is where you would paste any style found on Snazzy Maps.
			styles: [{"featureType":"administrative","elementType":"all","stylers":[{"visibility":"on"},{"saturation":-100},{"lightness":20}]},{"featureType":"road","elementType":"all","stylers":[{"visibility":"on"},{"saturation":-100},{"lightness":40}]},{"featureType":"water","elementType":"all","stylers":[{"visibility":"on"},{"saturation":-10},{"lightness":30}]},{"featureType":"landscape.man_made","elementType":"all","stylers":[{"visibility":"simplified"},{"saturation":-60},{"lightness":10}]},{"featureType":"landscape.natural","elementType":"all","stylers":[{"visibility":"simplified"},{"saturation":-60},{"lightness":60}]},{"featureType":"poi","elementType":"all","stylers":[{"visibility":"off"},{"saturation":-100},{"lightness":60}]},{"featureType":"transit","elementType":"all","stylers":[{"visibility":"off"},{"saturation":-100},{"lightness":60}]}],
		},
	},
	maxZoom: 10,
	autofit: {}
});

Links:
Gmap3 – http://gmap3.net/
Snazzy Maps – http://snazzymaps.com/

Geschrieben in javascript | Kommentare deaktiviert für Gmap3: Google Map Kartenstyling mit Snazzymaps

Pfad zur Sprachdatei in Fluid abkürzen

In einem TYPO3 Modul geschrieben mit Extbase/Fluid können genauso wie im Frontend Sprachlabels verwendet werden, die mit angegeben werden. Man kann die BE-Labels natürlich auch in die gleiche Datei schreiben, wie die FE-Labels, schöner ist es aber eine eigene Datei für die Labels des TYPO3-Moduls zu verwenden.

Man kann auch f:translate verwenden, muss dann den Pfad zur Datei mit den Übersetzungen vor den Key-Wert schreiben:

<f:translate key="LLL:EXT:my_ext/Resources/Private/Language/locallang_mod.xml:labelkey />

Wenn ich nun viele Labels in meinem Modul habe, dann schreibe ich vor jeden den vollständigen Pfad zur Datei. Abgesehen davon, dass es unübersichtlich wird, muss man auch relativ viel Code anpassen, falls man sich entscheidet, die Datei unzuziehen oder umzubenennen. Der Trick: mit f:alias kann man den vollständigen Pfad zur Datei in eine Variable schreiben und diese dann immer wieder verwenden:

<f:alias map="{ll: 'LLL:EXT:my_ext/Resources/Private/Language/locallang_mod.xml'}">
<f:translate key="{ll}:labelkey" />
<f:alias>

Noch schöner wird es, wenn man die Dateiendung weglässt – dann kann man sich später entscheiden, die Labels statt in xml in xliff zu hinterlegen:

<f:alias map="{ll: 'LLL:EXT:my_ext/Resources/Private/Language/locallang_mod'}">

Geschrieben in TYPO3 | Kommentare deaktiviert für Pfad zur Sprachdatei in Fluid abkürzen

TYPO3: Bilder in Gridelements mit FAL

Ich hatte gerade vor kurzem über Flexform und das Rendern der Bilder aus FAL geschrieben: Bilder mit Flexform und FAL. Nun soll ein Bild in der Flexform Konfiguration von einem Grid-Element hinterlegt und per TypoScript ausgegeben werden. Die Flexform Konfiguration ist so wie bei dem anderen Beispiel und kann am besten aus der TYPO3 Dokumentation kopiert werden: Flexform für Bilder aus FAL.

<T3DataStructure>
	<ROOT>
		<type>array</type>
		<el>
			<background_image>
				<TCEforms>
					<label>Hintergrundbild</label>
					<config>
						[...]
							<foreign_match_fields type="array">
								<fieldname>section_grid_bgimage</fieldname>
							</foreign_match_fields>
						</config>
						[...]
				</TCEforms>
			</background_image>
		</el>
	</ROOT>
</T3DataStructure>

Die TypoScript-Konfiguration des Elements sieht dann so aus:

tt_content.gridelements_pi1.20.10.setup {
	# Section (ID 1)
	1 < lib.gridelements.defaultGridSetup
	1 {
		prepend = COA
		prepend {
			20 = FILES
			20 {
				references {
					table = tt_content
					uid.data = field:uid
					fieldName = section_grid_bgimage
				}
				renderObj = IMAGE
				renderObj {
					file {
						import.data = file:current:publicUrl
						# width = 150
					}
				}
			}
		}
	}
}

In diesem Beispiel wird das Bild vor dem Inhaltselement ausgegeben. Zu beachten ist, dass der unter fieldName eingetragene Name dem im der FlexForm Konfiguration entspricht.

Geschrieben in TYPO3 | Kommentare deaktiviert für TYPO3: Bilder in Gridelements mit FAL

TYPO3: Bilder mit Flexform und FAL

Für eine einfache Extension sollte in den Plugin-Einstellungen im BE ein Bild ausgewählt werden können, das dann im FE ausgegeben wird. Da es nicht ganz so einfach war, wie ich dachte, hier die Beschreibung wie es geht.

Wenn man ein FAL-Bildfeld über TCA konfiguriert, ist es recht einfach, da es eine Funktion dafür gibt:

'youtube_preview_image' => array(
	'exclude' => 0,
	'label' => 'Vorschaubild',
	'config' => \TYPO3\CMS\Core\Utility\ExtensionManagementUtility::getFileFieldTCAConfig('preview_image', array('maxitems' => 1), $GLOBALS['TYPO3_CONF_VARS']['GFX']['imagefile_ext'])
),

Um das Bild dann im Frontend auszugeben, reicht im Template folgendes:

<f:image src="{film.preview_image.url}" alt="{film.preview_image.alternative}" width="110" height="110" />

Fürs FlexForm gibt es so eine Funktion leider nicht, daher muss man das XML manuell schreiben oder hier rauskopieren: http://wiki.typo3.org/File_Abstraction_Layer#FlexForm. Folgende Zeilen sollten angepasst werden, damit das Beispiel funktioniert:

<settings.previewImage>
	<TCEforms>
		<label>Video Vorschaubild</label>
		<config>
				[...]
				<foreign_match_fields type="array">
					<fieldname>video_previewimage</fieldname>
				</foreign_match_fields>
				[...]
			</config>
	</TCEforms>
</settings.previewImage>

Da bei der Ausgabe der Mechanismus nicht greift, der normalerweise für eine Bildreferenz den entsprechenden Eintrag aus sys_file_reference zieht, muss man die Bildreferenz im Controller manuell auflösen:

public function showAction() {
	$cObj = $this->configurationManager->getContentObject();
	$uid = $cObj->data['uid'];
	$fileRepository = \TYPO3\CMS\Core\Utility\GeneralUtility::makeInstance('TYPO3\\CMS\\Core\\Resource\\FileRepository');
	$fileObjects = $fileRepository->findByRelation('tt_content', 'video_previewimage', $uid);
	$this->view->assign('images', $fileObjects);
}

Dann kann man das Bild im Fluid Template ausgeben (TYPO3 6.2):

<f:for each="{images}" as="image">
	<f:image image="{image}" alt="{image.alternative}" />
</f:for>

Und in TYPO3 6.1. funktioniert folgendes:

<f:for each="{images}" as="image">
	<f:image src="{image.uid}" alt="{image.alternative}" treatIdAsReference="1" />
</f:for>

Geschrieben in TYPO3 | Kommentare deaktiviert für TYPO3: Bilder mit Flexform und FAL

TYPO3 6.2. und OpenSSL Fehlermeldung

Nach der Installation von TYPO3 6.2. auf Windows mit XAMPP blieb die Fehlermeldung, das OpenSSL nicht aktiviert sei, sehr hartnäckig. Eine Google-Suche lieferte viele Ergebnisse,ich halte jedoch nicht viel davon, leere Ordner anzulegen und dort Dateien reinzukopieren, nur damit die Pfade nicht geändert werden müssen. Das hat bei mir funktioniert.

Das Modul OpenSSL muss über die PHP-Konfigurationsdatei php.ini aktiviert sein. Folgende Zeile in php.ini suchen und ggf. das Semikolon am Anfang entfernen:

extension=php_openssl.dll

In den Umgebungsvariablen von Windows muss der Pfad auf die OpenSSL Konfigurationsdatei gesetzt sein. Dazu unter Windows 7 die Systemsteuerung öffnen und nach „umgebungs“ suchen. Unter System auf „Umgebungsvariablen für diese Konto bearbeiten“ klicken. Dort eine neue Variable anlegen („Neu…“)

OPENSSL_CONF
E:\xampp\php\extras\openssl\openssl.cnf

Anschließend das Install-Tool für die TYPO3-Installation öffnen, unter „All configuration“ die Variable $TYPO3_CONF_VARS[‚SYS‘][‚binSetup‘] suchen und dort ins Feld folgendes eintragen:

openssl=E:/xampp/php/extras/openssl/openssl.exe

Danach musste ich den Rechner einmal neu starten (wg. der Umgebungsvariablen?) und die Fehlermeldung war weg.

Geschrieben in TYPO3 | Kommentare deaktiviert für TYPO3 6.2. und OpenSSL Fehlermeldung