Bilder maskieren

https://www.mediaevent.de/css-mask-image-bilder-maskieren-freistellen/

Direkte Weiterleitung

Mit dem neuen PageParams-Plugins (ab CMSimple 1.5.6 und CMSimple 4.x) ist die direkte Weiterleitung einfacher geworden. Das unter der Trennlinie beschriebene Prozedere funktioniert jedoch weiterhin.

Wenn Sie eine Seite umleiten wollen (z.B. zu einer Archiv-Seite), dann rufen Sie im Editor den Reiter "Seite" auf und scrollen zum letzten Punkt "Seite umleiten?". Dort klicken Sie "ja" an. Die bisher grau unterlegte Zeile wird nun freigegeben und dadurch weiß. Nun können Sie die komplette Internet-Adresse eingeben, wobei (wie auch in der Hilfe hinter dem Fragezeichen steht) Sie bei externen Zielen unbedingt auch "http://" bzw. "https://" voranstellen müssen. Nach dem Klick auf den Button "Speichern" ist die Weiterleitung eingestellt. Sie funktioniert bereits in der Vorschau.

Was ich nach diesem Trennstrich beschreibe, musste bisher eingegeben werden:

Über den Menüpunkt "Seiten" wird eine neue Seite erstellt. Diese wird in der Navigation freigegeben und veröffentlicht (Reiter zur entsprechenden Seite).

Dann wird dieser Code im HTML-Modus eingefügt:

Bitte Aktualisieren und danach Speichern (Disketten-Symbol im Editor) auswählen. Anschließend wirde der HTML-Modus nochmals aufgerufen. Der Editor hat nun vor dem # <p> und hinter dem # </p> eingefügt. Dies ist durch <div> bzw. </div> zu ändern. Speichern nicht vergessen.

Weitere Erklärungen:

Dieser Aufruf gestattet es, vom entsprechenden Navigationsbutton aus zu einer anderen Stelle zu springen.

In diesem Fall gibt es eine Interne Seite für Mitglieder, die im Ordner "intern" realisiert wurde. In diesem Ordner ist eine komplette CMSimple-Installation mit allen Dateien, Content, Plugins und Templates. Hier müssen natürlich die Schreib- und Leserechte auch entsprechend vergeben werden.

In diesem besonderen Fall bleibt hinter location:http://domain.de/intern/?Zugang die angegebene Domain so ausgeschrieben und wird nicht gegen die sonst möglche Abkürzung "location:./" ersetzt.

Im Ordner "intern" gibt es dann die Seite Zugang, die (durch mich realisiert) darauf hinweist, dass der Besucher sich bitte einloggen möchte, um den Zugang zu den Mitgliederseiten  freigeschaltet zu bekommen.

Dies habe ich durch das Plugin "memberpages" realisiert.

Diese so beschriebene Art funktioniert bis zur CMSimple-Version 4.1.4 problemlos.

Deshalb musste aktuell eine so geschützte Seite eines Lehrerkollegiums wieder auf die (zuletzt funktionierende) Version 4.14 zurückgesetzt werden.

Als Kopiervorlage freigegeben: © 2014, Michael Zajusch

Disclaimer

Hierzu auch mal dies studieren:

Das Märchen vom Disclaimer

Muster-Disclaimer von eRecht24

Downloads

Ein praktischer Tipp: Kennzeichnen Sie doch einfach alle Download-Möglichkeiten via CSS mit einem Symbol und das dann sieht der Betrachter der Seiten klar und deutlich.

Alle Downloads, die entsprechend verknüpft sind, bekommen einentsprechendes Symbol vorgestellt:

Rufen Sie hierzu Einstellungen — Stylesheet auf. Kopieren Sie ziemlich weit oben (gleich nach Angaben zur Navigation) dieses Zeilen hinein.

a[href$=".pdf"]:before {
    content: url(/userfiles/images/flags/small_icon_pdf.gif);
}

a[href$=".doc"]:before, a[href$=".docx"]:before {
    content: url(/userfiles/images/flags/ext-word.gif);
}

Download des PDF-Symbols mit der rechten Maustaste und „Ziel speichern unter”
Download eines MS-Word-Symbols mit der rechten Maustaste und „Ziel speichern unter”

Als Kopiervorlage freigegeben: © 2015, Michael Zajusch

FTP Dateien

Achten Sie bitte beim Hochlagen von eigenen Dateien (z.B. Bildern) darauf, dass die Dateinamen und die Extensions (z.B. dateiname.jpg) immer klein geschrieben sind. Das war in früheren Zeiten jedenfalls so.

Das ist auch beim Hochladen automatisiert möglich.

Wenn Sie den Total-Commander nutzen, ziehen Sie die Dateien nach dem Auswählen in das Fenster zum Hochladen. Nun kommt ein Auswahlfenster, in dem 2 Möglichkeiten auszuwählen sind:

oben: im Hintergrund senden,

darunter: in Kleinbuchstaben umwandeln.

Setzen Sie dort ("in Kleinbuchstaben") wenigstens den Haken!

Das gilt aber nur für Dateien, die in ./userfiles/ hochgeladen werden!

Als Kopiervorlage freigegeben: © 2013, Michael Zajusch

Fußnoten

https://www.data2type.de/xml-xslt-xslfo/epub-ueberblick/ops/verweise-und-fussnoten/anmerkungen-und-fussnoten/

https://www.stichpunkt.de/css/marginalien.html

https://www.heise.de/select/ix/2016/12/1480600401569148

https://wiki.selfhtml.org/wiki/HTML/Tutorials/Listen/Fu%C3%9Fnoten_mit_CSS

Inhalte nicht markier- und kopierbar

Der zweite Satz ist wieder normal.

Das ist aber kein Problem der Technologie, sondern entspricht den Intentionen des Seitenbetreibers. Diese Anweisung sollte ganz sparsam eingesetzt werden und nur dort, wo es notwendig ist, man möchte den Benuter der Website ja nicht verärgern!

Im Bereich von Home-Schooling (2020, wegen der Corona-Pandemie) kann dies aber schon als sinnvoll erachtet werden. Und somit sind solche Lösungen auch für uns Lehrkräfte sinnvoll.

Weiterführende Infos

Wie wird das nun realisiert?

1) Füge in der stylesheet.css des (Standard-) Templates (damit es nicht zu unübersichtlich wird am besten bei den den Anweisungen für Styles) diese Zeilen ein. Den Kommentar zwischen /* Kommentar */ kann man auch weglassen.

/* Start: Besondere Styles: Inhalte lassen sich nicht markieren */

div#nichtmarkieren {
-ms-user-select: None;
-moz-user-select: None;
-webkit-user-select: None;
user-select: None;
}

/* Ende: Besondere Styles: Inhalte lassen sich nicht markieren */

2) Abspeichern und auf den Server hochladen.

3) Auf der Webseite fügt man vor dem zu markierenen Inhalt den Funktionsaufruf im HTML-Modus <div id="nichtmarkieren"> ein. Nach dem Inhalt (Text, Bilder ...) kommt dann das abschließende </div>.

Abspeichern nicht vergessen. Das war es eigentlich schon.

Innerhalb einer Tabelle steht Text, der nicht markierbar sein soll? So sieht dieser Quellcode entsprechend aus:

<table style="border-collapse: collapse; width: 30%;" border="1">
<tbody>
<tr>
<td style="width: 100%; background-color: #11b6f2;">
<div id="nichtmarkieren">
<p style="text-align: center;"><span style="font-size: 12pt;">auf die Toilette <br>am Fahrradstand <br>möglichst bald<br></span><span style="font-size: 12pt;">ganz schnell <br>mit ernster Stimme <br>in den Pausen <br>gestern<br>zu uns in die Klasse <br></span><span style="font-size: 12pt;">zwischen den Rädern </span></p>
</div>
</td>
</tr>
</tbody>
</table>

Das kann man natürlich auch inline deklarieren, wenn man es nur an einer einzigen Stelle benötigt:
<div style="-ms-user-select: None; -moz-user-select: None; -webkit-user-select: None; user-select: None;">Hier den Text einfügen</div>

gefunden auf: https://lembach-kr.de/?Website-bauen/CMSimple_XH/Codeschnipsel

IP-Info

 Dieser (alte) Funktionsaufruf muss als Bild hier eingefügt sein, sonst stört er massiv diese Website; ein Funktionsaufruf, wenn es diese Funktion gar nicht gibt, liefert zwar prinzipiell auch keine Rückgabe, aber dann eben doch Fehler!

Hier sehen Sie das Dilemma, warum ich die Erstellung dieser Seiten betreibe.

Wenn Sie auf den Link in diesem Plugin klicken, erscheint jetzt eine Seite "403 Forbidden".
Früher war das nicht so. Die Seite wird vom Netz genommen und alle Infos sind verloren.

Lautschrift über dem Text

Wie spricht man dies aus?

Guten Tag (guutn taak)

Diese Funktion in Simple plugins dient zur Ausgabe von Lautschrift über einem Text. Nach dem Entpacken den Ordner simpleplugins_xh in den Ordner plugins kopieren.

Der erste Parameter ist der String (in diesem Beispiel ('Guten Tag') der als normaler Fließtext ausgegeben wird. Der zweite Parameter ist der Lautschrift-String (z.B. 'guutn taak') der als kleine Lautschrift über dem ersten Text ausgegeben wird.
In der Simple plugins Liste ist unter 10. der entsprechende Plugin-Aufruf zu finden.
Oben ist der entsprechende Pluginaufruf mit dem Beispiel, an dem du dich orientieren kannst.

Links

Verlinkungen (Links) sind eine feine Sache. Ein Klick mit der Maus auf ein entsprechendes Wort oder Bild und man wird sofort zur anvisierten Adresse weitergeleitet.

Eines sollte aus Gründen der Stabilität jedoch nicht gemacht werden:

Die Seitenüberschrift nie als Link nutzen!!!

Das mag oft gut gehen, aber wenn es schief läuft, dann steht man evtl. vor einem White-Screen und weiß nicht warum.

Als Kopiervorlage freigegeben: © 2013, Michael Zajusch

LyX

LyX ist ein grafisches Frontend für LaTeX und so leicht zu bedienen wie eine Textverarbeitung.

https://www.chip.de/downloads/LyX_12997627.html?utm_source=nl_chipd-dy&utm_medium=chip-newsletter&utm_campaign=05-01-2023%2B17%253A00%253A19&utm_content=nl_chipmob&utm_term=

Math-Jax

Beispiele von der Seite. Die Richtigkeit ist nicht geprüft.

Wenn a ≠ 0, dann gibt es 2 Lösungen zu

\(ax^2 + bx + c = 0\)

so  $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$

oder auch so: $$x = {2+3 \over 25}.$$

Website zu MathJax. Hier gibt es eine Demo-Seite und dort können dann die Eingaben gemacht werden und sofort das Ergebnis angeschaut werden. Befehle für LaTex bzw. GoLaTex befinden sich z.B. hier , oder einfach mal googlen. Eine Besonderheit noch: Es müssen auf diesem Wege immer 2 $$ eingegeben werden.

Oder eine andere Beispielaufgabe:
Berechne die Kante a eines Würfels mit dem Volumen von 1000 cm³.

$$geg.: V = 1000cm^3$$

$$ges.: a$$

$$Benötigte~Formel: V = a^3$$

Damit ich nur a berechnen kann, muss ich die dritte Wurzel aus der Zahl 1000 ziehen. Ich darf aber auch nicht die cm³ vergessen. Auch hier muss ich die 3. Wurzel ziehen.

Mache ruhig den Zwischenschritt in deinem Rechenweg, damit du Fehler vermeidest.
$$\sqrt[3]{a^3} = \sqrt[3]{1000cm^3} $$

Also ziehe ich links die dritte Wurzel aus a³ und das Ergebnis ist a und auf der rechten Seite des = müssen aus der Zahl 1000 die dritte Wurzel und auch bei cm³ die dritte Wurzel gezogen werden.

$$a = 10cm$$

Um diese Darstellung zu erreichen, muss das Template angepasst werden. Kopieren Sie das Script an diese Stelle (siehe Bild).

Auf der Seite, auf der diese Darstellungen erfolgen sollen, ändern Sie beim Reiter "Seite" das Seitentemplate von "Standard-Template" zum Namen des vorher geänderten.

MathJax.org

Eine weiterführende Auflistung von Latex Symbolen finden Sie hier.

MathML

https://www.mediaevent.de/mathml-formeln-in-webseiten-mit-html5/

Meta-Angaben

In Meta-Angaben können Sie verschiedene nützliche Anweisungen für Web-Server, Web-Browser und automatische Suchprogramme im Internet ("Robots") notieren. Meta-Angaben können Angaben zum Autor und zum Inhalt der Datei enthalten. Sie können aber auch HTTP-Befehle absetzen, zum Beispiel zum automatischen Weiterleiten des Web-Browsers zu einer anderen Adresse.

Wenn es jedoch um die direkte Weiterleitung innerhalb der CMSimple-Installation von einem Button aus geht, so ist diese Vorgehensweise anzuwenden.

Als Kopiervorlage freigegeben: © 2013, Michael Zajusch

Neue Inhalte anzeigen

Jetzt habe ich eine ähnliche Lösung von cmb gefunden.
http://cmsimpleforum.com/viewtopic.php?f=12&t=10543
Das Template habe ich so abgeändert, dass ich eine neue Box erstellte mit der Überschrift "Geänderte Seiten:". Dann kopierte ich den Template-Aufruf hinein und nun klappt es. Nicht als erscheinendes Fenster, aber genauso gut.
Mit Memberpages geschützte Seiten werden nicht angezeigt.

Privacy

Privacy_XH ist dabei behilflich, eine Website bezüglich der Privatsphäre von Besuchern zu den geltenden EU Cookie-Vorschriften und anderen Vorschriften konform zu machen. Dazu wird auf jeder Website ein Formular mit entsprechenden Informationen angezeigt, welches dem Besucher die Möglichkeit bietet, der Verwendung von Cookies ausdrücklich einzuwilligen, oder zu widersprechen. Darüber hinaus ermöglicht es Privacy_XH, die Ausführung von anderem Code, der Cookies setzt, die die Privatsphäre von Nutzern verletzen könnte, zu überwachen.

Ich setze auf meiner Website das Plugin privaxy_XH ein. Beim Aufruf erscheint es unten auf der Seite und erst nach der Entscheidung verschwindet dieses Feld.
Bei lembach-kr.de fand ich auf dieser Seite eine interessante Alternative. Hier erscheint das Feld innerhalb der Contentseite und blockiert nicht alles.
Dazu wurde der unten stehende Code an die ensprechende Stelle in der Datei template.htm

<!-- privacy -->
<form id="privacy" name="privacy" method="post">
    <p>Einige Bereiche dieser Website benötigen zu ihrer Funktion sogenannte SESSION-Cookies, die jedoch keine Daten enthalten, die sich auf Sie, Ihren Webclient oder Ihr Gerät (PC oder Mobil-Gerät) beziehen (also keine personenbezogenen Daten). <br>Es werden lediglich seiteninterne Werte gespeichert.</p><p>Wir hätten gerne Ihre Erlaubnis evtl. weitere Cookies auf Ihrem Rechner zu platzieren (z.B. für die Anmeldung zum geschlossenen Benutzerbereich). - Erfahren sie mehr über diese Cookies in unserer <a href="./Cookie-Policy">Cookie Policy</a>.</p>    <p class="privacy_buttons">
        <button type="submit" class="submit" name="privacy_agree" value="no">Ablehnen</button>
        <button type="submit" class="submit" name="privacy_agree" value="yes">Cookies erlauben</button>
    </p>
</form>

Rechtschreibüberprüfung

Das kostenfreie AddOn für die Rechtschreibüberprüfung während der Eingabe in Firefox heißt Language Tool. Ich nutze es auch und bin bisher begeistert.

robots.txt

Erstellen Sie mit einem Editor (z.B. notepad++) eine Textdatei mit diesem Titel.

Eine entsprechende robots.txt verhindert, dass Bots, die sich daran halten (dürften alle namhaften Suchmaschinenbetreiber so handhaben), die Dateien indexiert.

Schreiben Sie dies hinein:

User-agent: *
Disallow: /*.pdf$
Disallow: /*.doc$
Disallow: /*.xls$

Sie können für jede beliebigen Datei-Extension diesen Text entsprechend dem Muster erweitern.

Anschließend laden Sie die Datei "robots.txt" per FTP-Upload in das Hauptverzeichnis auf ihrem Server.

StarWars

Früher: https://polarnotion.github.io/starwarsintro/

What is this?

Star Wars Intro is a small CSS Library to build your own Star Wars-esk intro. Use it for a movie marathon you're hosting, a browser game intro, a fan site, or pretty much anything else. If you're not interested in Star Wars and/or think it's lame, we've included something you might find interesting.

Requirements

Installation

The installation process is simple. Download the css file and add the html sample. You can put anything you want inside of the 'content-body'. The CSS will do the rest.

<!-- Place in document head -->
<link rel="stylesheet" href="/path/to/starwarsintro.css">

<!-- Place in Body where you'd like intro to appear -->
<div class="star-wars-intro">

  <!-- Blue Intro Text -->
  <p class="intro-text">
    A few days ago, during...
  </p>

  <!-- Logo Image or Text goes in here -->
  <h2 class="main-logo">
    <img src="img/star-wars-intro.png">
  </h2>

  <!-- All Scrolling Content Goes in here -->
  <div class="main-content">

    <div class="title-content">
      <p class="content-header">EPISODES IV-VI<br/>A Movie Marathon</p>

      <br>

      <p class="content-body">
        After years of galactic silence, civilization is on the brink of a new Star Wars release. Now, with the Force preparing to awaken, the people of Earth seek solace in films of old. With nowhere to turn, they gather in great numbers and watch the original trilogy without rest. Three films. 6 hours. 24 minutes. Popcorn. Slushies. Total elation.
      </p>

      <!-- button or link or whatever -->
      <a href="./StarScroll.zip" class="space-button">Download The Code Now!</a>
        
    </div>
  </div>
</div>

Text hervorheben

Das ist ein reiner Beispieltext für das Beispiel (startet in 5,5 Sekunden): Diesen Text hervorheben.

(Erst nach einem Browserrefresh startet diese wieder.)

Diese CSS Angaben füge in die stylesheet.css hinzu.

Wie geht das? 

Auf dieser Seite fand ich die entsprechenden CSS-Codes. Mir gefiel das oben gezeigte Markierungsverfahren (dort Nr. 6).

Aus dem gezeigten CSS-Code benötigte ich nur diesen Teil:

Mit dem TinyMCE ist es standardmäßig nicht möglich, ein <mark>-Tag zu setzen (außer manuell im Quelltext). Deshalb empfehle ich, eine neue CSS-Klasse (z.B. animark) ins Standard-Template ganz hinten hineinzuschreiben. Dann sollte diese im TinyMCE-Editor unter "Format" erscheinen. Diese sind nicht alphabetisch sortiert!

span.animark {
	-webkit-animation: 1.5s highlight 1.5s 1 normal forwards;
	animation: 1.5s highlight 1.5s 1 normal forwards;
	background-color: none;
	background: linear-gradient(90deg, #7efff5 50%, rgba(255, 255, 255, 0) 50%);
	background-size: 200% 100%;
	background-position: 100% 0;
}
 @-webkit-keyframes highlight {
 to {
 background-position: 0 0;
}

Weil ich die Markierung nicht so schnell (1.5 Sekunden) haben wollte, habe ich die 1.5 in 5.5 geändert.

Wenn du z.B. verschiedenfarbige Markierungen brauchst, dann ginge auch sowas:
span.animarkBlau, span.animarkRot, span.animarkGelb oder ähnlich.
Du musst dann halt nur jeweils eine neue Regel erstellen (neue CSS-Klasse (z.B. span.animarkRot) ins Standard-Template) und die Farbangaben für linear-gradient ändern.

Text-Highlight

Wie geht das? 

Auf dieser Seite fand ich die entsprechenden CSS-Codes. Mir gefiel das oben gezeigte Markierungsverfahren (dort Nr. 13).

Aus dem gezeigten CSS-Code benötigte ich nur diesen Teil:

highlight {
background-image: linear-gradient(to right, #F27121cc, #E94057cc, #8A2387cc);
border-radius: 6px;
padding: 3px 6px;
}

Mit dem TinyMCE ist es standardmäßig nicht möglich, ein <mark>-Tag zu setzen (außer manuell im Quelltext). Deshalb empfehle ich, eine neue CSS-Klasse (z.B. animark) ins Standard-Template ganz hinten hineinzuschreiben. Dann sollte diese im TinyMCE-Editor unter "Format" erscheinen. Diese sind nicht alphabetisch sortiert!

span.highlight {
background-image: linear-gradient(to right, #F27121cc, #E94057cc, #8A2387cc);
border-radius: 6px;
padding: 3px 6px;
}

Wenn du z.B. verschiedenfarbige Markierungen brauchst, dann ginge auch sowas:
span.animarkBlau, span.animarkRot, span.animarkGelb oder ähnlich.
Du musst dann halt nur jeweils eine neue Regel erstellen (neue CSS-Klasse (z.B. span.animarkRot) ins Standard-Template) und die Farbangaben für linear-gradient ändern.

Text mit Pfeil

Das ist ein reiner Beispieltext für das Beispiel.

Wie geht das? 

Auf dieser Seite fand ich die entsprechenden CSS-Codes. Mir gefiel das oben gezeigte Markierungsverfahren (dort Nr. 17).

Aus dem gezeigten CSS-Code benötigte ich nur diesen Teil:

.border-highlight {
border 4px dashed;
padding 0.03em 0.25em;
}

Deshalb empfehle ich, eine neue CSS-Klasse (z.B. animark) ins Standard-Template hineinzuschreiben. Dann sollte diese im TinyMCE-Editor unter "Format" erscheinen. Diese sind nicht alphabetisch sortiert!
span.reddotted umkreist nur die markierten Zeichen.
p.reddotted umkreist die markierte Zeile. 

span.reddotted {
border: 4px dashed red;
padding:0.03em 0.25em;
}

Wenn du z.B. verschiedenfarbige Markierungen brauchst, dann ginge auch sowas:
span.animarkBlau, span.animarkRot, span.animarkGelb oder ähnlich.
Du musst dann halt nur jeweils eine neue Regel erstellen (neue CSS-Klasse (z.B. span.animarkRot) ins Standard-Template) und die Farbangaben für linear-gradient ändern.

Text umkehren

https://www.css-wiki.com/css-eigenschaft/unicode-bidi

https://www.mediaevent.de/css/transform.html

Text umranden

Das ist ein reiner Beispieltext für das Beispiel.

Wie geht das? 

Auf dieser Seite fand ich die entsprechenden CSS-Codes. Mir gefiel das oben gezeigte Markierungsverfahren (dort Nr. 17).

Aus dem gezeigten CSS-Code benötigte ich nur diesen Teil:

.border-highlight {
border 4px dashed;
padding 0.03em 0.25em;
}

Deshalb empfehle ich, eine neue CSS-Klasse (z.B. animark) ins Standard-Template hineinzuschreiben. Dann sollte diese im TinyMCE-Editor unter "Format" erscheinen. Diese sind nicht alphabetisch sortiert!
span.reddotted umkreist nur die markierten Zeichen.
p.reddotted umkreist die markierte Zeile. 

span.reddotted {
border: 4px dashed red;
padding:0.03em 0.25em;
}

Wenn du z.B. verschiedenfarbige Markierungen brauchst, dann ginge auch sowas:
span.animarkBlau, span.animarkRot, span.animarkGelb oder ähnlich.
Du musst dann halt nur jeweils eine neue Regel erstellen (neue CSS-Klasse (z.B. span.animarkRot) ins Standard-Template) und die Farbangaben für linear-gradient ändern.

UTF-8

Seit Version 1.2 ist CMSimple_XH UTF-8 kodiert (seit CMSimple_XH 1.5 darf diese Einstellung nicht mehr geändert werden).

CMSimple 4 ist es sowieso.

Warum UTF-8?

UTF-8 hat sich quasi zum Standard für das Internet entwickelt. Daher wurde beschlossen die Kodierung von CMSimple_XH auf UTF-8 zu ändern, um bestmögliche Interoperabilität mit dem WWW zu gewährleisten.

Weiterhin sollte dieser Schritt bzgl. der Kodierung der Systemkern- und Plugin-Dateien besonders in mehrsprachigen Installationen helfen. Natürlich ist es möglich alle sprachspezifischen Dateien in der Standard-Kodierung dieser Sprache zu kodieren. Aber leider gibt es keine allgemeinen Standards in dieser Hinsicht. Z.B. werden die so genannten westliche Sprachen oft als ISO-8859-1 kodiert. Aber dieser Zeichensatz enthält nicht das „€“-Zeichen, so dass "International Organization for Standardization" (ISO-8859-15) eingeführt wurde. Aber unter Windows ist CP-1252 die übliche Kodierung. Diese drei Kodierungen sind sehr ähnlich, aber sie sind nicht identisch. Bei kyrillischen Sprachen ist die Situation noch schlimmer: ISO-8859-5, KOI-R, KOI-U und CP-1251 „stehen in Konkurrenz“.

Und bedenken Sie die Probleme bzgl. Dateien die gemeinsam für unterschiedliche Sprachen verwendet werden: diese dürften überhaupt keine nicht "American Standard Code for Information Interchange" (ASCII-Zeichen enthalten. Das ist kein großes Problem für eigentlich Programmdateien ("Hypertext Preprocessor" (PHP) und "JavaScript" (JS), aber sehr wohl für Daten von Plugins, die für alle Sprachen gemeinsam genutzt werden.

Daher erscheint es als langfristig beste Lösung für jeden, auf UTF-8 umzustellen.

Was ist ein BOM?

Der folgende Abschnitt ist recht technisch. Als CMSimple_XH Anwender muss man nicht alle Details verstehen. Die einzige Regel die Sie beachten sollten:

 BOM ist die Abkürzung von byte order mark (engl. Byte-Reihenfolge-Kennzeichnung). Das ist ein wichtiges Konzept für die Plattform-Interoperabilität von vielen multibyte encodings, z.B. UTF-16 und UTF-32. Es ist nötig, weil verschiedene Betriebssystem diese Kodierungen in unterschiedlichers Byte-Reihenfolge erwarten (big-endian/little-endian).

Aber für UTF-8 ist die Reihenfolge der Bytes für alle Plattformen gleich, so dass das BOM hier seine ursprüngliche Bedeutung verloren hat. Es wird allerdings von vielen Editoren verwendet, um eine Datei als UTF-8 zu kennzeichnen. Das ist vermutlich nicht die beste Idee, und der Unicode-Standard empfiehlt nicht, ein BOM in UTF-8 kodierten Dateien zu verwenden. Oftmals stört das BOM allerdings nicht, aber in PHP-Dateien und Dateien die von PHP inkludiert werden, verursacht das BOM ein Problem: das BOM wird sofort zum Browser geschickt, wenn die Datei verarbeitet wird. Da so die HTTP Antwort bereits begonnen wurde, wird das spätere Setzen von HTTP Headern unterdrückt, was unterschiedliche Fehlfunktionen des Skripts nach sich ziehen kann.
Dateien offline bearbeiten

Wenn Sie irgendeine PHP-Datei offline bearbeiten wollen, ist es erforderlich diese als UTF-8 ohne BOM zu speichern. Manche Editoren fügen das BOM automatisch ein, wenn die Zeichenkodierung UTF-8 ist (z.B. der Windows Editor); verwenden Sie daher einen Editor, der fähig ist Dateien als UTF-8 ohne BOM zu speichern (z.B. Notepad++) und stellen Sie sicher, das das auch geschieht. Andernfalls können Fehlfunktionen von CMSimple_XH auftreten; seit CMSimple_XH 1.5.4 wird dann die folgende Fehlermeldung angezeigt:

Cannot modify header information - headers already sent (output started at path/to/file.php:1)

Upgrade von ANSI kodierten Versionen

Seit CMSimple_XH 1.2 sind alle Versionen UTF-8 kodiert. Wenn Sie also von einer älteren Version upgraden wollen, müssen Sie alle Dateien die nicht ASCII-Zeichen enthalten, nach UTF-8 ohne BOM konvertieren. Sie können dies von Hand machen, ein Tool verwenden, dass es ermöglicht ein komplettes Projekt zu konvertieren, oder Sie können das Utf8migrator_XH Plugin verwenden (bitte beachten Sie, das es sich noch im BETA Stadium befindet).

Wenn Sonderzeichen in den Seitenüberschriften vorkommen, dann werden sich die URLs nach der Umstellung vermutlich geändert haben. Um diese weiterhin funktionieren zu lassen und um Robots über die Änderung zu informieren, können Sie die folgende index.php verwenden (im Installationsverzeichnis von CMSimple_XH und in allen Ordnern für Zweitsprachen):

http://www.cmsimple-xh.org/wiki/doku.php/de:utf8

Verlinkungen anzeigen

Ein praktischer Tipp: Kennzeichnen Sie doch einfach alle externen Links via CSS mit einem Symbol und dann sieht der Betrachter der Seiten klar und deutlich, dass er eine neue Seite betritt. Damit hilfen Sie dem Besucher mehr, als mit einer Disclaimer Seite, die er so oder so nicht liest oder richtig versteht.

Alle Links, die mit http:// beginnen, bekommen einen Pfeil hinten angesetzt:

Rufen Sie hierzu Einstellungen — Stylesheet auf. Kopieren Sie ziemlich weit oben (gleich nach Angaben zur Navigation) dieses Zeilen hinein.

a[href^="http://"]:after, a[href^="https://"]:after {
content: url(/userfiles/images/flags/extern-10.gif);
}

a[href^="http://home.michael-zajusch.de"]:after {
content: "" ! important;
}

Kleine Erklärungen:

a[href^="http://"]:after {
content: url(/userfiles/images/flags/extern-10.gif);
}
Die Links, die auf eine Subdomain zeigen, bekommen den wieder überschrieben:

a[href^="http://intern.michael-zajusch.de"]:after {
content: "" ! important;
}

Sie müssen die Angabe, die hier : http://intern.michael-zajusch.de heißt, entsprechen Ihrer Domain eintragen.
Das � Zeichen soll hierbei ein geschütztes LEERZEICHEN sein. Damit bleibt der Abstand erhalten und der Pfeil rutscht nicht in die nächste Zeile.
So der Plan – bitte mal testen. Sonst einfach mal auf deiner Tastatur selber ein geschütztes LEERZEICHEN erstellen.
Siehe auch http://leavesofcode.net/2012/08/21/indicate-special-links-with-css/

Da ich das mit dem � Zeichen bzw. geschützten Zeichen nicht hinbekomme , habe ich das GIF-Icon nach vorne entsprechend verlängert und anschließend die Hintergrundfarbe transparent geschaltet. Außerdem kopierte ich es in den Unterordner von userfiles – images – flags hinein, damit ich es nicht aus Versehen mal lösche.

Download des blauen Link-Pfeils (Bitte entpacken und in den Ordner ".images/flags/" hochladen.

Als Kopiervorlage freigegeben: © 2015, Michael Zajusch

Template von Ennio

2019: Unvollkommen und noch nicht in Richtung CMSimple_XH umgesetzt ... damals von frase †

Creative Portfolio Template by Ennio