Registered (R) hochstellen: Unterschied zwischen den Versionen
Aus Contao Community Documentation
K (→Erstellung eines kleinen Contao-Moduls) |
K (Vereinheitlichung) |
||
(18 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
Zeile 1: | Zeile 1: | ||
− | |||
[[Category:Dev HOWTOS]] | [[Category:Dev HOWTOS]] | ||
[[Category:Dev Snippets]] | [[Category:Dev Snippets]] | ||
Zeile 10: | Zeile 9: | ||
=Aufgabenstellung= | =Aufgabenstellung= | ||
Da das ® relativ zur Schrift meist hochgestellt verwendet wird, muss es bei jeder Eingabe extra formatiert werden. In HTML wird es dazu in die <sup>®</sup>-Tags eingeschlossen. Bei der Eingabe von laufendem Text ist das sehr lästig. Wenn das Zeichen beispielsweise in Titelfeldern im Backend verwendet wird, ist es normalerweise gar nicht möglich, HTML-Tags einzugeben, da Contao diese beim Speichern automatisch entfernt. Das kann man zwar mit Einträgen in der dcaconfig.php anpassen, es soll aber eine einfachere Möglichhkeit geben. | Da das ® relativ zur Schrift meist hochgestellt verwendet wird, muss es bei jeder Eingabe extra formatiert werden. In HTML wird es dazu in die <sup>®</sup>-Tags eingeschlossen. Bei der Eingabe von laufendem Text ist das sehr lästig. Wenn das Zeichen beispielsweise in Titelfeldern im Backend verwendet wird, ist es normalerweise gar nicht möglich, HTML-Tags einzugeben, da Contao diese beim Speichern automatisch entfernt. Das kann man zwar mit Einträgen in der dcaconfig.php anpassen, es soll aber eine einfachere Möglichhkeit geben. | ||
− | |||
− | |||
=Lösungansätze= | =Lösungansätze= | ||
Hier mein Dank an die Kollegen aus dem [[Chat HowTo|IRC-Chat]] für die zahlreichen Ideen und Anregungen. | Hier mein Dank an die Kollegen aus dem [[Chat HowTo|IRC-Chat]] für die zahlreichen Ideen und Anregungen. | ||
− | === | + | ===Kleines JavaScript=== |
Ein JavaScript würde nach dem Aufbau der Webseite hingehen und nachträglich die ® mit dem <sup>-Tag umschließen. Voraussetzung ist dabei, dass beim Betrachter im Browser JavaScript aktiviert ist. | Ein JavaScript würde nach dem Aufbau der Webseite hingehen und nachträglich die ® mit dem <sup>-Tag umschließen. Voraussetzung ist dabei, dass beim Betrachter im Browser JavaScript aktiviert ist. | ||
− | === | + | ===Über den Ausgabe-Hook mit einer kleinen Erweiterung=== |
− | Diese Variante verspricht am meisten Erfolg, da hier die Webseite '''vor''' der Auslieferung entsprechend manipuliert werden kann. Es kostet natürlich etwas Überwindung, dafür eine Erweiterung zu schreiben, aber | + | Diese Variante verspricht am meisten Erfolg, da hier die Webseite '''vor''' der Auslieferung entsprechend manipuliert werden kann. Es kostet natürlich etwas Überwindung, dafür eine Erweiterung zu schreiben, aber man wird weiter unten sehen, dass es gar nicht so schlimm ist. |
− | === | + | ===Bei der Eingabe im Backend modifizieren=== |
Man könnte auch das Backend derart modifizieren, dass eine Speicher-Callback-Routine die Aufgabe ausführt. Dann muss man aber dafür sorgen, dass auch beim Laden über einen Load-Callback die Anpassung erstmal herausgenommen wird, da der Save-Callback sie ja dann wieder einbaut. Außerdem wären diese Callbacks für viele Felder in vielen Modulen notwendig. Diesen Ansatz kann man also auslassen. | Man könnte auch das Backend derart modifizieren, dass eine Speicher-Callback-Routine die Aufgabe ausführt. Dann muss man aber dafür sorgen, dass auch beim Laden über einen Load-Callback die Anpassung erstmal herausgenommen wird, da der Save-Callback sie ja dann wieder einbaut. Außerdem wären diese Callbacks für viele Felder in vielen Modulen notwendig. Diesen Ansatz kann man also auslassen. | ||
− | |||
− | |||
=Erstellung eines kleinen Contao-Moduls= | =Erstellung eines kleinen Contao-Moduls= | ||
Es hört sich erstmal schwierig an, doch diese einfache Erweiterung macht nicht so viel Aufwand. | Es hört sich erstmal schwierig an, doch diese einfache Erweiterung macht nicht so viel Aufwand. | ||
− | === | + | ===Man baut die Verzeichnispfade auf=== |
− | * Dazu | + | * Dazu legt man im Verzeichnis '''system/modules''' ein Verzeichnis '''registeredR''' an. |
− | * In diesem Verzeichnis | + | * In diesem Verzeichnis legt man das Verzeichnis '''config''' an, was dann die Modulkonfiguration definiert. |
− | * In das config-Verzeichnis | + | * In das config-Verzeichnis kopiert man aus einem Backend-Modul eine .htaccess-Datei, die für die Sicherheit des Moduls wichtig ist. Die .htaccess überwacht, dass nur das PHP-Script zugreifen darf, ein direkter Zugriff aus den Web bleibt ausgesperrt. |
Der Dateibaum des Moduls wird später so aussehen: | Der Dateibaum des Moduls wird später so aussehen: | ||
− | [[Datei:RegisteredR1.gif|Dateibaum RegisteredR-Erweiterung]] | + | [[Datei:RegisteredR1.gif|center|frame|Dateibaum RegisteredR-Erweiterung]] |
− | |||
===Konfigurationsdatei config.php erstellen=== | ===Konfigurationsdatei config.php erstellen=== | ||
− | In einem UTF-8-fähigen Editor | + | In einem UTF-8-fähigen Editor erstellt man die Datei '''config.php''' mit dem folgenden Inhalt und speichern sie im config-Verzeichnis ab. |
− | < | + | |
+ | <source lang="php"> | ||
<?php if (!defined('TL_ROOT')) die('You can not access this file directly!'); | <?php if (!defined('TL_ROOT')) die('You can not access this file directly!'); | ||
Zeile 99: | Zeile 94: | ||
?> | ?> | ||
− | </ | + | </source> |
Ganz wichtig ist, dass in der Datei vor dem <?php und nach dem ?> keine Zeichen oder Zeilenumbrüche stehen, da es sonst zu PHP-Fehlern in der Ausgabe kommt. | Ganz wichtig ist, dass in der Datei vor dem <?php und nach dem ?> keine Zeichen oder Zeilenumbrüche stehen, da es sonst zu PHP-Fehlern in der Ausgabe kommt. | ||
Das wichtige in dieser Datei ist die Zeile ganz unten: | Das wichtige in dieser Datei ist die Zeile ganz unten: | ||
− | + | ||
+ | <source lang="php"> | ||
+ | $GLOBALS['TL_HOOKS']['outputFrontendTemplate'][] = array('ModuleRegisteredR', 'registeredR'); | ||
+ | </source> | ||
Damit meldet man das Programm '''registeredR''' aus der PHP-Klasse '''ModuleRegisteredR''' beim outputFrontendTemplate-HOOK an. | Damit meldet man das Programm '''registeredR''' aus der PHP-Klasse '''ModuleRegisteredR''' beim outputFrontendTemplate-HOOK an. | ||
− | |||
===Moduldatei ModuleRegisteredR.php erstellen=== | ===Moduldatei ModuleRegisteredR.php erstellen=== | ||
Es ist ja klar, dass das registrierte Programm auch zur Verfügung stehen muss. Daher wird jetzt das Modulprogramm mit folgendem Inhalt erstellt: | Es ist ja klar, dass das registrierte Programm auch zur Verfügung stehen muss. Daher wird jetzt das Modulprogramm mit folgendem Inhalt erstellt: | ||
− | < | + | <source lang="php"> |
<?php if (!defined('TL_ROOT')) die('You can not access this file directly!'); | <?php if (!defined('TL_ROOT')) die('You can not access this file directly!'); | ||
/** | /** | ||
Zeile 145: | Zeile 142: | ||
* Class ModuleRegisteredR | * Class ModuleRegisteredR | ||
* | * | ||
− | * @copyright Softleister 2010 | + | * @copyright Softleister 2010-2011 |
* @author Hagen Klemp <http://www.softleister.de> | * @author Hagen Klemp <http://www.softleister.de> | ||
* @package Controller | * @package Controller | ||
Zeile 153: | Zeile 150: | ||
public function registeredR($strContent, $strTemplate) | public function registeredR($strContent, $strTemplate) | ||
{ | { | ||
− | return str_replace( '®', '<sup>®</sup>', $strContent ); | + | $pos = strpos( $strContent, '<body' ); |
+ | return substr($strContent, 0, $pos) . str_replace( '<sup><sup>®</sup></sup>', | ||
+ | '<sup>®</sup>', | ||
+ | str_replace('®', '<sup>®</sup>', substr($strContent, $pos)) ); | ||
} | } | ||
} | } | ||
?> | ?> | ||
− | </ | + | </source> |
Auch hier muss wieder darauf geachtet werden, dass die Datei in UTF-8 gespeichert wird. | Auch hier muss wieder darauf geachtet werden, dass die Datei in UTF-8 gespeichert wird. | ||
Der Kern der Datei ist eine kleine Programmdefinition passend zum HOOK: | Der Kern der Datei ist eine kleine Programmdefinition passend zum HOOK: | ||
− | < | + | <source lang="php"> |
class ModuleRegisteredR extends Backend | class ModuleRegisteredR extends Backend | ||
{ | { | ||
public function registeredR($strContent, $strTemplate) | public function registeredR($strContent, $strTemplate) | ||
{ | { | ||
− | return str_replace( '®', '<sup>®</sup>', $strContent ); | + | $pos = strpos( $strContent, '<body' ); |
+ | return substr($strContent, 0, $pos) . str_replace( '<sup><sup>®</sup></sup>', | ||
+ | '<sup>®</sup>', | ||
+ | str_replace('®', '<sup>®</sup>', substr($strContent, $pos)) ); | ||
} | } | ||
} | } | ||
− | </ | + | </source> |
− | Hier wird die Klasse '''ModuleRegisteredR''' definiert, die in der config-Datei dem HOOK angemeldet wurde. In dieser Klasse, die die vorhandene Klasse Backend erweitern soll, | + | Hier wird die Klasse '''ModuleRegisteredR''' definiert, die in der config-Datei dem HOOK angemeldet wurde. In dieser Klasse, die die vorhandene Klasse Backend erweitern soll, ergänzt man nur eine Funktion '''registeredR'''. Die Aufruf-Parameter der Funktion sind durch die Definition des [http://www.contao.org/hooks-verwenden.html HOOK in Contao] vorgegeben und beschrieben. |
− | + | Man bekommt in der Variablen ''$strContent'' die komplette Webseite und muss im ''return'' den veränderten Inhalt an Contao zurückgeben. Die Aufgabe ist nur das Umschließen des ® mit <sup>-Tags, also kann man mit der PHP-Funktion str_replace einfach das Zeichen ® auf der gesamten Webseite gegen einen String mit sup und Zeichen austauschen und den veränderten String zurückgeben. | |
+ | |||
+ | '''EDIT:''' Die Ersetzung muss im HTML-Header verhindert werden, da hier der <sup>-Tag nicht zulässig ist. | ||
===CSS für die bessere Darstellung=== | ===CSS für die bessere Darstellung=== | ||
− | Eigentlich kann HTML das ® jetzt allein formatieren, da es bei der Ausgabe durch den <sup>-Tag hochgestellt ist. Durch eine kleine zusätzliche CSS-Definition läßt sich aber noch mehr Einfluss auf die Darstellung erreichen. | + | Eigentlich kann HTML das ® jetzt allein formatieren, da es bei der Ausgabe durch den <sup>-Tag hochgestellt ist. Durch eine kleine zusätzliche CSS-Definition läßt sich aber noch mehr eigener Einfluss auf die Darstellung erreichen. |
− | < | + | <source lang="css"> |
sup | sup | ||
{ | { | ||
Zeile 187: | Zeile 192: | ||
line-height:1em; | line-height:1em; | ||
} | } | ||
− | </ | + | </source> |
+ | |||
+ | Hinweis von [[Benutzer:Datenkind|Datenkind]]: | ||
+ | Durch ein geschicktes CSS läßt sich sogar der Zeilenabstand im Fließtext konstant halten, der eigentlich durch das Hochstellen vergrößert wird. (Der Selektor _vertical-align soll den IE6 besänftigen) | ||
+ | |||
+ | |||
+ | <source lang="css"> | ||
+ | sup | ||
+ | { | ||
+ | height:0; | ||
+ | bottom:0.5em; | ||
+ | position:relative; | ||
+ | vertical-align:baseline; | ||
+ | _vertical-align:bottom; | ||
+ | font-size:.8em; | ||
+ | line-height:1; | ||
+ | } | ||
+ | </source> | ||
+ | |||
+ | [http://www.adobe.com/cfusion/communityengine/index.cfm?event=showdetails&postId=5341&productId=1 Quelle] | ||
+ | |||
− | . | + | <span style="font-size:1.3em; font-weight:bold;">Das war's - doch nicht so schwierig, wie gedacht</span> |
− | == | + | =Das registeredR gibt es jetzt als Erweiterung im Repository= |
+ | Da doch inzwischen einiges Interesse an dem Skript zusammen gekommen ist, habe ich ein kleine Erweiterung daraus gemacht. Die Installation ist so sehr einfach und geht schnell. Viel Spaß damit ... [http://www.contao.org/erweiterungsliste/view/registeredR.html Erweiterung registeredR] | ||
---- | ---- | ||
− | -- [[Benutzer:do_while|do_while]] - 2010-08-14 | + | -- [[Benutzer:do_while|do_while]] - 2010-08-14 / 2011-01-06 / 2011-02-13 |
Aktuelle Version vom 13. Februar 2011, 12:17 Uhr
betrifft | |
---|---|
TYPOlight Version | ab 2.6 |
Contao Version | ab 2.9 |
Beim Arbeiten mit Produkten, z.B. in Katalogen, kommt es häufiger vor, dass man das Registered(R)-Symbol verwenden muss. Für die Auftraggeber ist ein einfaches Weglassen des Zeichens keine Alternative, da diese Markenrechte viel Geld gekostet haben und es jeder sehen soll, dass das Produkt markenrechtlich geschützt ist.
Inhaltsverzeichnis
Aufgabenstellung
Da das ® relativ zur Schrift meist hochgestellt verwendet wird, muss es bei jeder Eingabe extra formatiert werden. In HTML wird es dazu in die <sup>®</sup>-Tags eingeschlossen. Bei der Eingabe von laufendem Text ist das sehr lästig. Wenn das Zeichen beispielsweise in Titelfeldern im Backend verwendet wird, ist es normalerweise gar nicht möglich, HTML-Tags einzugeben, da Contao diese beim Speichern automatisch entfernt. Das kann man zwar mit Einträgen in der dcaconfig.php anpassen, es soll aber eine einfachere Möglichhkeit geben.
Lösungansätze
Hier mein Dank an die Kollegen aus dem IRC-Chat für die zahlreichen Ideen und Anregungen.
Kleines JavaScript
Ein JavaScript würde nach dem Aufbau der Webseite hingehen und nachträglich die ® mit dem <sup>-Tag umschließen. Voraussetzung ist dabei, dass beim Betrachter im Browser JavaScript aktiviert ist.
Über den Ausgabe-Hook mit einer kleinen Erweiterung
Diese Variante verspricht am meisten Erfolg, da hier die Webseite vor der Auslieferung entsprechend manipuliert werden kann. Es kostet natürlich etwas Überwindung, dafür eine Erweiterung zu schreiben, aber man wird weiter unten sehen, dass es gar nicht so schlimm ist.
Bei der Eingabe im Backend modifizieren
Man könnte auch das Backend derart modifizieren, dass eine Speicher-Callback-Routine die Aufgabe ausführt. Dann muss man aber dafür sorgen, dass auch beim Laden über einen Load-Callback die Anpassung erstmal herausgenommen wird, da der Save-Callback sie ja dann wieder einbaut. Außerdem wären diese Callbacks für viele Felder in vielen Modulen notwendig. Diesen Ansatz kann man also auslassen.
Erstellung eines kleinen Contao-Moduls
Es hört sich erstmal schwierig an, doch diese einfache Erweiterung macht nicht so viel Aufwand.
Man baut die Verzeichnispfade auf
- Dazu legt man im Verzeichnis system/modules ein Verzeichnis registeredR an.
- In diesem Verzeichnis legt man das Verzeichnis config an, was dann die Modulkonfiguration definiert.
- In das config-Verzeichnis kopiert man aus einem Backend-Modul eine .htaccess-Datei, die für die Sicherheit des Moduls wichtig ist. Die .htaccess überwacht, dass nur das PHP-Script zugreifen darf, ein direkter Zugriff aus den Web bleibt ausgesperrt.
Der Dateibaum des Moduls wird später so aussehen:
Konfigurationsdatei config.php erstellen
In einem UTF-8-fähigen Editor erstellt man die Datei config.php mit dem folgenden Inhalt und speichern sie im config-Verzeichnis ab.
<?php if (!defined('TL_ROOT')) die('You can not access this file directly!'); /** * Contao Open Source CMS * Copyright (C) 2005-2010 Leo Feyer * * Formerly known as TYPOlight Open Source CMS. * * This program is free software: you can redistribute it and/or * modify it under the terms of the GNU Lesser General Public * License as published by the Free Software Foundation, either * version 3 of the License, or (at your option) any later version. * * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU * Lesser General Public License for more details. * * You should have received a copy of the GNU Lesser General Public * License along with this program. If not, please visit the Free * Software Foundation website at <http://www.gnu.org/licenses/>. * * PHP version 5 * @copyright Leo Feyer 2005-2010 * @author Leo Feyer <http://www.contao.org> * @package Backend * @license LGPL * @filesource */ /** * ------------------------------------------------------------------------- * HOOKS * ------------------------------------------------------------------------- * * Hooking allows you to register one or more callback functions that are * called on a particular event in a specific order. Thus, third party * extensions can add functionality to the core system without having to * modify the source code. * * $GLOBALS['TL_HOOKS'] = array * ( * 'hook_1' => array * ( * array('Class', 'Method'), * array('Class', 'Method') * ) * ); * * Use function array_insert() to modify an existing hooks array. */ $GLOBALS['TL_HOOKS']['outputFrontendTemplate'][] = array('ModuleRegisteredR', 'registeredR'); ?>
Ganz wichtig ist, dass in der Datei vor dem <?php und nach dem ?> keine Zeichen oder Zeilenumbrüche stehen, da es sonst zu PHP-Fehlern in der Ausgabe kommt.
Das wichtige in dieser Datei ist die Zeile ganz unten:
$GLOBALS['TL_HOOKS']['outputFrontendTemplate'][] = array('ModuleRegisteredR', 'registeredR');
Damit meldet man das Programm registeredR aus der PHP-Klasse ModuleRegisteredR beim outputFrontendTemplate-HOOK an.
Moduldatei ModuleRegisteredR.php erstellen
Es ist ja klar, dass das registrierte Programm auch zur Verfügung stehen muss. Daher wird jetzt das Modulprogramm mit folgendem Inhalt erstellt:
<?php if (!defined('TL_ROOT')) die('You can not access this file directly!'); /** * Contao Open Source CMS * Copyright (C) 2005-2010 Leo Feyer * * Formerly known as TYPOlight Open Source CMS. * * This program is free software: you can redistribute it and/or * modify it under the terms of the GNU Lesser General Public * License as published by the Free Software Foundation, either * version 3 of the License, or (at your option) any later version. * * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU * Lesser General Public License for more details. * * You should have received a copy of the GNU Lesser General Public * License along with this program. If not, please visit the Free * Software Foundation website at <http://www.gnu.org/licenses/>. * * PHP version 5 * @copyright Leo Feyer 2005-2010 * @author Leo Feyer <http://www.contao.org> * @package Backend * @license LGPL * @filesource */ /** * Class ModuleRegisteredR * * @copyright Softleister 2010-2011 * @author Hagen Klemp <http://www.softleister.de> * @package Controller */ class ModuleRegisteredR extends Backend { public function registeredR($strContent, $strTemplate) { $pos = strpos( $strContent, '<body' ); return substr($strContent, 0, $pos) . str_replace( '<sup><sup>®</sup></sup>', '<sup>®</sup>', str_replace('®', '<sup>®</sup>', substr($strContent, $pos)) ); } } ?>
Auch hier muss wieder darauf geachtet werden, dass die Datei in UTF-8 gespeichert wird.
Der Kern der Datei ist eine kleine Programmdefinition passend zum HOOK:
class ModuleRegisteredR extends Backend { public function registeredR($strContent, $strTemplate) { $pos = strpos( $strContent, '<body' ); return substr($strContent, 0, $pos) . str_replace( '<sup><sup>®</sup></sup>', '<sup>®</sup>', str_replace('®', '<sup>®</sup>', substr($strContent, $pos)) ); } }
Hier wird die Klasse ModuleRegisteredR definiert, die in der config-Datei dem HOOK angemeldet wurde. In dieser Klasse, die die vorhandene Klasse Backend erweitern soll, ergänzt man nur eine Funktion registeredR. Die Aufruf-Parameter der Funktion sind durch die Definition des HOOK in Contao vorgegeben und beschrieben.
Man bekommt in der Variablen $strContent die komplette Webseite und muss im return den veränderten Inhalt an Contao zurückgeben. Die Aufgabe ist nur das Umschließen des ® mit <sup>-Tags, also kann man mit der PHP-Funktion str_replace einfach das Zeichen ® auf der gesamten Webseite gegen einen String mit sup und Zeichen austauschen und den veränderten String zurückgeben.
EDIT: Die Ersetzung muss im HTML-Header verhindert werden, da hier der -Tag nicht zulässig ist.
CSS für die bessere Darstellung
Eigentlich kann HTML das ® jetzt allein formatieren, da es bei der Ausgabe durch den <sup>-Tag hochgestellt ist. Durch eine kleine zusätzliche CSS-Definition läßt sich aber noch mehr eigener Einfluss auf die Darstellung erreichen.
sup { font-size:.8em; line-height:1em; }
Hinweis von Datenkind: Durch ein geschicktes CSS läßt sich sogar der Zeilenabstand im Fließtext konstant halten, der eigentlich durch das Hochstellen vergrößert wird. (Der Selektor _vertical-align soll den IE6 besänftigen)
sup { height:0; bottom:0.5em; position:relative; vertical-align:baseline; _vertical-align:bottom; font-size:.8em; line-height:1; }
Das war's - doch nicht so schwierig, wie gedacht
Das registeredR gibt es jetzt als Erweiterung im Repository
Da doch inzwischen einiges Interesse an dem Skript zusammen gekommen ist, habe ich ein kleine Erweiterung daraus gemacht. Die Installation ist so sehr einfach und geht schnell. Viel Spaß damit ... Erweiterung registeredR
-- do_while - 2010-08-14 / 2011-01-06 / 2011-02-13