Start

Congratulations on successfully installing CMSimple_XH. If this text is displayed, you have done everything right. Now you should do some basic settings, then you can start building your own website immediately.

Login

To make changes to the system at all, you’ll have to log in. To do this, click Login at the bottom. (The login link is usually placed in the footer.) The standard password is set to test. By doing this you reach the admin mode, sometimes called “backend”.

Settings / Administration

The administration menu (Admin menu) is CMSimple_XH’s control center. After logging in a dark bar is displayed at the top of the screen.

At first you’ll have to change the default password:

Admin menu ⇒ Settings ⇒ Password

Always change the default password first!

This is the most important step to prevent unauthorized access to the CMS.
Detailed tips can be found here or here.

Now you can configure the CMS according to your needs (tips).
The most important place to do that is:

Admin menu ⇒ Settings ⇒ Configuration

Here you should activate the contact form. Enter your e-mail address (section mailform) and select your preferred language for the backend. You should also check all the other settings.

Admin menu ⇒ Settings ⇒ Language

Here, only the first three points are important at the beginning: Site title and the two meta-specifications for search engines. Those and all other settings can be modified at any time.

Your content

After you’ve done some basic settings for the site, you can now start editing the content.

Manage pages

You can create, delete, rename or move pages in the pagemanager.

Admin menu ⇒ Pages

Edit content

Admin menu ⇒ Edit / Preview

This menu item is a toggle switch. Depending on the state the CMS is currently in you can toggle between editing and preview mode. The page that is currently selected in the navigation menu is either shown in preview or in edit mode. In the edit mode, you can use an editor that allows you to change the text, insert pictures, and many other things.

 

Have fun with CMSimple_XH!

 


Help / Instructions / Links

Since CMSimple_XH is an OpenSource project where only enthusiastic developers work on without getting payed in their free time there is also no central place where all information is collected at one point. There is also no manager, no board or the like. Following you’ll find a summary of links, which could be important for questions about the CMS:

CMSimple_XH PROJECTS WEBSITE – general information

CMSimple_XH WIKI – general and professional topics

CMSimple_XH DOCUMENTATION – general and professional topics

CMSimple_XH DISCUSSION BOARD – the most up-to-date and comprehensive information source

CMSimple_XH at Github – Source code for developers

Start [deutsch]

Glückwunsch zur erfolgreichen Installation von CMSimple_XH. Wenn dieser Text angezeigt wird, hast du alles richtig gemacht. Du solltest jetzt noch einige Grundeinstellungen vornehmen, dann kannst du sofort mit deiner eigenen Homepage beginnen.

Anmelden/ Login

Um überhaupt Veränderungen am System vornehmen zu können, musst du dich anmelden (einloggen). Dazu klickst du unten auf Login. (Der Login-Link befindet sich meist im Footer.) Das Passwort lautet im Auslieferungszustand schlicht und einfach test. Du gelangst damit in den Admin-Modus, der manchmal auch Backend genannt wird.

Einstellungen/ Administration

Die Schaltzentrale von CMSimple_XH ist das Administrationsmenü (kurz: Admin-Menü). Nach dem Anmelden findest du es als dunklen Balken am oberen Bidschirmrand.

Die erste Anlaufstelle für dich:

Admin-Menü ⇒ Einstellungen ⇒ Passwort

Ändere unbedingt zuerst das Standard-Passwort!

Das ist der wichtigste Schritt, damit kein Unbefugter Zutritt zum CMS erhält.
Ausführliche Tipps dazu findest du hier oder auch hier.

Konfiguriere nun das CMS nach deinen Bedürfnissen (Tipps).
Die wichtigsten Stellen dazu sind :

Admin-Menü ⇒ Einstellungen ⇒ Konfiguration

Hier solltest du vor allem das Kontaktformular aktivieren, d.h. deine E-Mail-Adresse eintragen (unter Punkt E-Mail-Formular), deine bevorzugte Sprache für das Backend wählen und auch alle anderen Punkte beachten.

Admin-Menü ⇒ Einstellungen ⇒ Sprach-Datei

Hier sind zunächst nur die ersten drei Punkte wichtig. Site-Titel und die beiden Meta-Angaben für Suchmaschinen. Diese und alle anderen Punkte sind jederzeit auch später änderbar.

Deine Inhalte

Nachdem du die Grundeinstellungen für die Website vorgenommen hast, kannst du jetzt mit der Bearbeitung der Inhalte beginnen.

Seiten verwalten

Seiten anlegen, löschen, umbenennen oder verschieben kannst du im Pagemanager.

Admin-Menü ⇒ Seiten

Inhalte bearbeiten

Admin-Menü ⇒ Bearbeiten/Vorschau

Dieser Menüpunkt ist ein Wechsel-Schalter. Je nachdem, in welchem Zustand sich das CMS gerade befindet – das hängt von deinem letzten Bearbeitungsschritt ab – kannst du hier umschalten zwischen Bearbeitungs- und Vorschau-Modus. Es wird immer die Seite bearbeitet oder angezeigt, die im Navigations-Menü gerade gewählt ist. Im Bearbeitungs-Modus steht dir ein Editor zur Verfügung, mit dem du deine Texte bearbeiten kannst, Bilder einfügen und vieles mehr.

 

Viel Spaß mit CMSimple_XH!

 


Hilfe/ Anleitungen/ Links

Da CMSimple_XH ein OpenSource-Projekt ist – an dem nur begeisterte Entwickler ohne Bezahlung in ihrer Freizeit arbeiten – gibt es auch keine zentrale Stelle an der alle Informationen an einem Punkt zusammengefasst sind. Es gibt auch keinen Chef, keinen Vorstand oder Ähnliches. Hier eine Zusammenstellung von Links, die bei Fragen zum CMS wichtig sein könnten:

CMSimple_XH PROJEKTSEITE – allgemeine Infos

CMSimple_XH WIKI – allgemeine und fachliche Themen

CMSimple_XH DOKU – allgemeine und fachliche Themen

CMSimple_XH FORUM – die aktuellste und umfangreichste Informationsquelle

CMSimple_XH auf Github – Entwicklerseite

Content

This page demonstrates some standard content elements as shown in the current active template.

Standard text, paragraphs, heading <h2>

Lorem ipsum dolor sit amet, consectetuer bold adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu italic faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit. Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, bold-italic venenatis eu, erat.

Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

Heading <h3>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum.

Heading <h4>

Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.

Heading <h5>

Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis.

Heading <h6>

Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

Lists

Unordered list

  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum.
  • Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.
    • Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, venenatis eu, erat. Maecenas vulputate laoreet lectus.
    • Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor.
      • Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis.
      • Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.
  • Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

Ordered list

  1. Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor.
  2. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.
    1. Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, venenatis eu, erat. Maecenas vulputate laoreet lectus.
    2. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor.
      1. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis.
      2. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.
  3. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

Code & Blockquote

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, <code>inline text</code> nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.

The following text is a <blockquote>.

The only thing that interferes with my learning is my education.

Albert Einstein

Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

Inhalt [deutsch]

Diese Seite demonstriert einige Standard-Inhaltselemente, so, wie sie das momentan aktive Template darstellt.

Fließtext, Absätze, Überschriften <h2>

Lorem ipsum dolor sit amet, consectetuer bold adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu italic faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit. Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, bold-italic venenatis eu, erat.

Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

Überschrift <h3>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum.

Überschrift <h4>

Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.

Überschrift <h5>

Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis.

Überschrift <h6>

Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

Listen

Eine ungeordnete Liste

  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum.
  • Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.
    • Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, venenatis eu, erat. Maecenas vulputate laoreet lectus.
    • Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor.
      • Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis.
      • Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.
  • Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

Eine geordnete Liste

  1. Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor.
  2. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.
    1. Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, venenatis eu, erat. Maecenas vulputate laoreet lectus.
    2. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor.
      1. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis.
      2. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.
  3. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

Code & Blockquote

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, <code>code inline text</code> nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.

Der folgende Text ist ein <blockquote>.

Das Einzige, was mich beim Lernen stört, ist meine Bildung.

Albert Einstein

Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

Templates

Templates are a collection of files that essentially change the look of your site. The content of your pages is normally (there are exceptions) not affected by changing the template – only your website’s appearance. The default installation of CMSimple_XH contains some templates. Try them out.

Admin menu ⇒ Settings ⇒ Configuration: Site: Template:

More information about templates:

Tips and tricks regarding installation and usage of templates:
CMSimple_XH-Wiki

Collection of template providers:
CMSimple_XH-Wiki
CMSimple_XH-Dokumentation

Templates are often presented and discussed in our discussion board:
CMSimple_XH-Forum

On the following pages you can see some template samples.

Templates [deutsch]

Templates sind eine Sammlung von Dateien, die im Wesentlichen das Aussehen deiner Website beeinflussen. Der Inhalt deiner Seiten wird normalerweise (es gibt Ausnahmen) durch das Wechseln des Templates nicht beeinflusst – nur das Aussehen. Im Standard-Download von CMSimple_XH sind einige Templates enthalten. Probiere sie aus.

Admin-Menü ⇒ Einstellungen ⇒ Konfiguration: Site: Template

Mehr zu Templates:

Tipps und Hinweise zur Installation und Verwendung von Templates:
CMSimple_XH-Wiki

Übersichten von Template-Anbietern:
CMSimple_XH-Wiki
CMSimple_XH-Dokumentation

Templates werden auch oft im Forum vorgestellt und besprochen:
CMSimple_XH-Forum

Die folgenden Seiten (siehe Menü) demonstrieren einige Templates.

The template “fhs-simple”

A “simple” template for CMSimple_XH from version 1.7 – it should also work with previous versions.

Fonts

  • Default font: OpenSans
    • OpenSans semibold is used for headings and bold labels in the continuous text.
    • Combinations like bold italic can be used in the editor as well.
  • Icon font: FontAwesome

License

Free for all purposes.
The rights of third parties remain unaffected.


de Das Template „fhs-simple“

Ein „einfaches“ Template für CMSimple_XH ab Version 1.7 – das aber auch mit früheren Versionen laufen sollte.

Schriften

  • Standard-Schriftart: OpenSans
    • Für Überschriften und fett-Auszeichnungen im Fließtext wird OpenSans semibold verwendet.
    • Auch Kombinationen fett-kursiv sind einfach über den Editor möglich.
  • Icon-Font: FontAwesome

Lizenz

Für alle Zwecke frei verwendbar.
Die Rechte Dritter bleiben unberührt.

Template specific styles

This page demonstrates some styles that are specifically available in “fhs-simple”.

Responsive Tables

Using tables in respeonsive layouts is considered as a problem often. I found one of many possible solutions at maddesign. The corresponding code can be found at codepen. If the browser windows is resized to a viewport width of 480px significant changes occur.


de Template spezifische Styles

Diese Seite demonstriert einige Styles, die speziell in „fhs-simple“ verfügbar sind.

Responsive Tabellen

Dass Tabellen in responsive Layouts ein echtes Problem sind, dürfte bekannt sein. Eine der vielen möglichen Lösungen fand ich bei maddesign. Der zugehörige Code ist bei codepen zu finden. Es lohnt sich, das Browserfenster mal zusammenzuschieben – ab einer Viewport-Breite von 480px tritt eine wesentliche Veränderung ein.


Sample Table / de Beispiel-Tabelle

Name First name Street Postcode Location
Shannon Cheyenne Ap #239-2170 Phasellus Av. 94075 Berlin
Lindsey Tanner 511-635 Malesuada Rd. 77791 Beaconsfield
Luna Xanthus 771-4058 Et Rd. 61855 Pontypridd
Donaldson Anika 2821 Orci. Road 71078 Oosterhout
Langley Bruce Ap #376-2978 Diam. Avenue 05691 Ravenstein
Leon Petra 776-8330 Sem St. 72540 Cervinara
Everett Ulla P.O. Box 786, 1462 Id, St. 06815 Banff
Bishop Wayne Ap #619-6021 Aliquet, Road 47719 Saint-Mard
Mccullough Audra 4758 Vel, St. 22972 Leipzig
Nelson Jillian P.O. Box 548, 7968 Quis St. 30075 Vernole

To use a responsive table layout like the one above each table cell has to get a data-label. Unfortunately, most editors do not automatically support adding data attributes. That’s why you’ll have to paste them into the source code manually. The CSS-class responsive has to be assigned to the table.

de Voraussetzung für diese responsive Lösung ist allerdings, dass jede Tabellenzelle ein data-label erhält. Leider unterstützen die meisten Editoren das Hinzufügen von data-Attributen nicht automatisch. Man muss diese also händisch im Quellcode einfügen. Leider. Die Tabelle muss die CSS-Klasse responsive erhalten.

Images / de Bilder

demo-img-full.png

Image responsive full width

demo-img-small.png

DIV class "imgR"

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.

Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, venenatis eu, erat. Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam. Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, venenatis eu, erat. Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien.

Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. <span class="orange"> ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam. <span class="underline"> Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis.

demo-img-small.png

DIV class "imgL"

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit. Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, venenatis eu, erat. Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien.

Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis.

Code & Blockquote

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, <code>inline text</code> nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.

<p class="code">Hello World!</p>

Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor.
The following text is <blockquote>.

Dumme Gedanken hat jeder, aber der Weise verschweigt sie.

Wilhelm Busch

Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

The template “lck_overlay_02”

Responsive Template for CMSimple_XH from Version 1.7 – it should also work with previous versions.

  • Overlay-Menu (menu level 1 – 9)
  • 2 Newsboxes (easily extensible in template.htm)
  • Link for imprint prepared in template.htm
  • jQuery included from template. Scripts tested with jQuery Core 3.1.1

Fonts

Standard font: Open Sans Condensed by Google-Fonts.
Font formats: font-style: normal (font-weight: 300 and 700) and font-style: italic (font-weight: 300).

Icons

Google Material Icons

Images

Background image: pixabay.com

License

For private and commercial sites available, suitable in compliance with GPLv3.
The rights of third parties remain unaffected.

 


 

de Das Template „lck_overlay_02“

Responsive Template für CMSimple_XH ab Version 1.7 – sollte auch mit früheren Versionen kompatibel sein.

  • Overlay-Menü (Menülevel1-9)
  • 2 Newsboxen (leicht erweiterbar, siehe template.htm "Newsboxes", keine css-Anpassung notwendig)
  • Links für Impressum und Datenschutz in der template.htm vorbereitet.
  • jQuery wird durch das Template eingebunden. Scripts getestet mit jQuery Core 3.1.1

Schriften

Standard-Schriftart: "Open Sans Condensed" von Google-Fonts.
Schriftformate: font-style: normal (font-weight: 300 und 700) und font-style: italic (font-weight: 300).

Icons

Google Material Icons

Bilder

Hintergrundbild: pixabay.com

Lizenz

Für private und kommerzielle Seiten nutzbar, unter Einhaltung von GPLv3 verwendbar.
Die Rechte Dritter bleiben unberührt.

Template specific styles

This page demonstrates some styles that are specifically available in “lck_overlay_02”.

Responsive Tables

Sample Table (a viewport width less than 600px changes the table’s layout).


de Template spezifische Styles

Diese Seite demonstriert einige Styles, die speziell in „lck_overlay_02“ verfügbar sind.

Responsive Tabelle

Beispiel-Tabelle (ab einer Viewport-Breite kleiner 600px verändert sich die Tabelle)

 

Name
Age
Profession
Location
Henriette Hummel
35
Schauspielerin
Hummelstadt
Werner Wespe
53
Feuerwehrmann
Feuerdorf
Beate Biene
27
Stewardess
Bienenbrunn
Ferdinand Fliege
45
Web-Designer
Fliegersheim

Images / de Bilder (responsive)

demo-img-full.png

Image responsive full width

… with text flow / de … mit umfließenden Text

demo-img-small.png

DIV class "right_30"

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.

Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, venenatis eu, erat. Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam. Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, venenatis eu, erat. Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien.

Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis.

demo-img-full.png

DIV class "left_50"

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit. Sed a leo. Suspendisse nisl tellus, volutpat vel, vehicula nec, venenatis eu, erat. Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien.

Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis.

… with middle centered text /
de … mit Text mittig zentriert

demo-img-small.png

DIV class "tpllck_tbl-middle"
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.

 

DIV class "tpllck_tbl-middle"
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.

demo-img-small.png

Responsive Video

DIV class "responsive-video-wrapper" + "responsive-video"

Code & Blockquote

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum, <code>inline text</code> nunc pede facilisis nisl, id mattis nunc nulla in ipsum. Donec ullamcorper, nulla eu faucibus sagittis, wisi risus ultrices metus, a ornare purus metus eget elit.

<p class="code">Hello World!</p>

Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor.
The following text is <blockquote>.

Dumme Gedanken hat jeder, aber der Weise verschweigt sie.

Wilhelm Busch   

Maecenas vulputate laoreet lectus. Fusce pulvinar ante non sapien. Aliquam iaculis, wisi ac tristique ornare, ante est lacinia urna, quis tempor neque dui id tortor. Vivamus posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec facilisis. Fusce imperdiet, augue at dignissim ultricies, tortor libero vehicula neque, ac malesuada lorem dolor et arcu. Quisque accumsan metus vel diam.

TEMPLATE „richu172“


English
Responsive template richu172 is optimized for CMSimple_XH 1.7 - and higher. Is also compatible with CMSimple_XH 1.6- to CMSimple_XH 1.6.9.
Template richu172 uses only pure CSS and HTML, JavaScript or other scripts are not used.
Navigation Hamburger Grünenbergpass (Menu level1-9)
Each of the four newsboxes is color-customizable. The CSS color, background color in the newsbox, the font color of the text in the newsbox and the link color can be customized in color.
Link for imprint page is created in template.htm.
Create an imprint page in your CMSimple_XH installation under Pages.

Icons
Edited Google Material Icons: https://design.google.com/icons/

Image
Background image: Richard Kircher, photo taken in Fuerteventura.© http://richukunst.ch/

License ©
These templates can be used privately as well as commercially. Licensed under Creative Commons Attribution 3.0 Unported. http://creativecommons.org/licenses/by-sa/3.0/deed.en
However, the respective link to richukunst.ch must be maintained.
 



Deutsch
Responsive Template richu172 ist für CMSimple_XH 1.7 - und höher optimiert. Ist aber auch für CMSimple_XH 1.6- bis CMSimple_XH 1.6.9 kompatibel.
Template richu172 verwendet nur reines CSS und HTML, JavaScript oder sonstige Scripts werden nicht eingesetzt.
Navigation Hamburger Grünenbergpass (Menülevel1-9)
Jede der vier Newsboxen ist farblich individuell anpassbar.Farblich anpassbar sind in der CSS-Datei, Background Farbe in der Newsbox, die Schrift Farbe des Texts in der Newsbox und die Link Farbe.
Link für Impressum-Seit ist in der template.htm erstellt.
Erstellen Sie in Ihrer CMSimple_XH Installation unter Seiten eine Impressum Seite.

Icons
Bearbeitete Google Material Icons: https://design.google.com/icons/

Bild
Hintergrundbild: Richard Kircher, Foto in Fuerteventura aufgenommen. © http://richukunst.ch/

Lizenz ©
Dieses Templates darf privat sowie kommerziell verwendet werden. Lizensiert unter der Creative Commons Attribution 3.0 Unported. http://creativecommons.org/licenses/by-sa/3.0/deed.de
Jedoch muss der jeweilige Link auf richukunst.ch zwingend beibehalten werden.

Plugins

For special functionalities there are extensions for CMSimple_XH – so-called “plugins”. Whether you need a calendar, an image gallery, a blog, a comment option … or whatever you need, CMSimple_XH offers solutions for most cases.

Admin-Menu ⇒ Settings ⇒ Plugins ⇒ …

More information about plugins:

Tips and tricks regarding installation and usage of plugins:
CMSimple_XH-Wiki

Collection of plugin providers:
CMSimple_XH-Wiki
CMSimple_XH-Dokumentation

A pretty current and detailed list of available plugins:
CMSimple_XH-Dokumentation

Plugins in the discussion board:
CMSimple_XH-Forum

 

Plugins [deutsch]

Für spezielle Anwendungsfälle gibt es Erweiterungen für CMSimple_XH – sogenannte Plugins. Ob du nun für deine Website einen Kalender, eine Bildergalerie, einen Blog, eine Kommentarmöglichkeit … oder was auch immer benötigst – CMSimple_XH bietet für die meisten Fälle Lösungen an.

Admin-Menü ⇒ Einstellungen ⇒ Plugins ⇒ …

Mehr zu Plugins:

Tipps und Hinweise zur Installation und Verwendung von Plugins:
CMSimple_XH-Wiki

Übersichten von Plugin-Anbietern:
CMSimple_XH-Wiki
CMSimple_XH-Dokumentation

Eine ziemlich aktuelle und ausführliche Liste verfügbarer Plugins:
CMSimple_XH-Dokumentation

Plugins im Forum:
CMSimple_XH-Forum

Languages

The standard download of CMSimple_XH comes with English and German language files only (for the backend).

German language files are included because the German language user’s community is by far the largest and practically all of the developer’s team is German speaking.

Information and links to language files for other languages can be found here.

How you show the content of your website in other languages?
Have a look here.

Sprachen [deutsch]

Der Standard-Download von CMSimple_XH enthält als Systemsprachen für das Backend nur Englisch und Deutsch. Obwohl die Haupt-Sprache eigentlich Englisch ist, sind doch die meisten Benutzer, die meisten Forums-Mitglieder und praktisch alle Mitglieder des Entwicklerteams deutschsprachig.

Falls du für andere Sprachen Unterstützung benötigst, findest du Informationen und Sprachpakete zum Download auf der CMSimple_XH-Projektseite.

Wie du auch die Inhalte deiner Website mehrsprachig für deine Besucher darstellen kannst, wird hier beschrieben.

Nach oben