Beim Hochladen von Bildern gehen nicht gespeicherte Änderungen an Artikeln verloren. Bitte vorher speichern.

Zuerst das Bild hochladen. Zum Einbinden den Button im Editor klicken und "img/[bildname.png]" eintragen.

neu

Anleitung PR-Kalender

So könnt ihr neue Termine im PR-Kalender eintragen

 

Bevor ihr mit der Bearbeitung des PR-Kalenders anfangt, sind hier kurz einige Infos:

Alle Termine für 2020 befinden sich in diesem Dokument: https://docs.google.com/document/d/1hRwK8ykjGDb_hHrfczHICH9Ea_gIpsxeE2zLlRs9M04/edit

Die HTML-dec-Codes, die ihr vor den einzelnen Terminen einfügt, könnt ihr auf dieser Seite recherchieren: https://emojiterra.com/de/ Ihr könnt aber auch einfach die Emojis aus dem Dokument kopieren und im Code einfügen.

Ich empfehle die Verwendung eines Editors (z.B. Atom), um den Code zu bearbeiten. Ihr könnt ihn aber auch direkt in Joomla bearbeiten. Die Vorteile eines Editor sind, dass ihr eure Schritte rückgängig machen könnt, die Ansicht viel übersichtlicher ist und ihr auf eurem PC zwischendurch Sicherheitskopien abspeichern könnt. Sicherheitskopien solltet ihr auf jeden Fall zwischendurch anlegen!

 

Beispiel: Hinzufügen des Neujahrstags am 01.01.2020 (mit Editor)

1. Als erstes öffnet ihr den Beitrag in Joomla, kopiert den ganzen Code, fügt ihn in einer neuen Datei in eurem Editor ein und speichert diese zweimal als html-Datei: Einmal als Sicherheitskopie (z.B. pr-kalender-shk-2019-11-06.html), die ihr anschließend schließt, und einmal als aktuelle Arbeitsdatei (z.B. pr-kalender-2019-11-06.html), in der ihr gleich eure Änderungen einfügt.

2. In der html-Datei springt ihr zu dem Monat, den ihr bearbeiten möchtet. Entweder ihr scrollt dahin oder ihr sucht ihn mit STRG+F. In unserem Beispiel gehen wir also zum Januar 2020 (1). Hier sehen wir die Überschriften für die einzelnen Wochentage (2) und die Kästchen für die erste Januarwoche (3). Da der 1. Januar ein Mittwoch ist, sind die ersten beiden Kästchen leer.

(1) Mit dem h2-Tag werden Überschriften 2. Ebene definiert. Die Klasse "text-center" definiert, dass der Text zentriert ist.

(2) Mit der Klasse "row" und der Klassen "col" des div-Tags werden Spalten innerhalb einer Reihe definiert. Mit dem h3-Tag werden Überschriften 3. Ebene definiert.

(3) Mit der Klasse "calendar-day" des div-Tags wird das Aussehen der Boxen für die einzelnen Kalendertage definiert (Hintergrundfarbe, Schattierung etc.).

3. Um den Code ein bisschen übersichtlicher zu halten, fügt ihr vor und hinter dem p-Tag mit dem Datum (<p>1</p>) am besten einen Zeilenumbruch ein. Anschließend fügt ihr darunter einen neuen p-Tag ein. In diesen fügt ihr den HTML-dec-Code für das Emoji ein, ein Leerzeichen und den Namen des Termins innerhalb eines span-Tags (<p>&#129395; <span>Neujahr</span></p>) (4). Anmerkung: Der Name des Termins ist in einem span-Tag, damit wir ihn auf kleinen Devices ausblenden können.

(4) Mit dem p-Tag werden Paragraphen und mit dem span-Tag werden Inline-Elemente definiert.

4. Danach speichert ihr die Datei, kopiert den Code, fügt ihn im Joomla-Beitrag ein und speichert diesen. Anschließend überprüft ihr, ob eure Änderungen korrekt übernommen wurden.