astrawhitelogo@2x_1

WordPress – Das Astra Theme

Alle in dieser Rubrik Hinweise und Tipps, gelten ausschließlich für das Astra Theme. Ob die jeweiligen Hinweise auch bei Ihnen funktionieren, kann auch davon abhängen, ob Sie mit der normalen Astra Version arbeiten oder schon mit der Astra Pro Version, also der bezahlten Vollversion.

Thema und der entsprechende Link, direkt zum Thema, oder einfach Scrollen.

Astra Theme – Menu Umbruch

Unter dem Umbruch des Menus versteht man die normale Lesbarkeit des Menus. Auf kleineren Geräten wie z.B. Laptop, Tablet oder Handy ist das schon deshalb wichtig, um dem Benutzer, die möglichst Optimale Lesbarkeit, zu Gewährleisten. In der Regel tritt dieser Umstand jedoch frühestens bei älteren Laptop Geräten auf, deren Auflösung zu gering ist.

Um die Richtigen Einstellungen zu finden, habe ich mich jeweils an der Größe des Menus Orientiert und das einfach mit JRuler  ausgemessen. Haben Sie kein großes Menu ( gesamte Länge der Links ), können Sie den Umbruch, vielleicht sogar noch bei 800 Pixeln einstellen. Diese Vorgehensweise muss nach jedem Menu Punkt der hinzu kommt ( nicht beim Untermenu ), jedoch auch wiederum erweitert/angepasst werden.

Um zu sehen wann das Menu aktuell Umbricht, klicken Sie ganz oben Rechts in das Fenster, welches zwei hintereinanderliegende Fenster anzeigt. Nun ziehen Sie mit der Maus, das Fenster in der Breite kleiner, bis das Menu fast am Rand links anstößt, bzw. durch Ihr Logo begrenzt wird. Jetzt ausmessen ob Sie noch Platz links haben oder nicht. Wenn Ja, so können Sie den Umbruch des Menus noch etwas kleiner machen, bzw. Sie müssen den Umbruch vergrößern. Meine Einstellungen liegen bei 1440 Pixeln, je nachdem wie Ihre Auflösung ist, passen Sie es an.

Achten Sie aber darauf, nicht über 1600 Pixel zu gehen, sonst könnte auch bei einem Laptop, der Umbruch schon Angezeigt werden, obwohl noch genug Platz für Ihr Menu wäre.

Den Umbruch können Sie im Customizer von Astra vornehmen. Unter dem Menu Punkt, Primäres Menu, Mobile Menu – Mobile Breakpoint.

Auflösung 1
Normale Ansicht auf Ihrem Monitor, von der Menu Größe her gesehen, wäre noch genug Platz, nach Links
Auflösung 2
Ausgemessen, hier wäre z.B. Links das Ende des Lesbaren Menus erreicht, die Messung der Breite zeigt die Grenze
Auflösung 3
Das ist die Größe, bei der das Menu Umbricht, es sind nur noch 3 Striche ( ICON ) zu sehen
Auflösung 4
so stellt sich jetzt das Menu dar, ausgeklappt, von Oben nach unten - auf kleineren Geräten oder Laptop mit geringer Auflösung

Astra Theme – Shortcodes

Nutzen Sie Shortcodes so oft es geht, das spart nicht nur Zeit und Mühe. Ob nun beim Schreiben oder einfügen Ihrer Logos und allgemeinen Hinweise, es veringert auch die Ladezeit Ihrer Seite.

Die Shortcodes konnen Sie entweder im Customizer eintragen, mit Angabe von Schriftgrößen und Farben, wie auch in den Texten. Auch bei Elementr funktioniert das sehr gut, indem Sie den Text Editor einsetzen. Dieser ist zwar etwas gewöhnungsbedürfitig für Unerfahrene, aber sehr wirkungsvoll in Ihrer Darstellung.

z.B. Customizer:
z.B. bei Elementor, im Text - teil

Astra Theme – Besucherzähler

Einen Besucherzähler, so wie auch auf meiner Seite im Footer, ist nicht nur für den Betreiber der Webseiten interessant. Auch die Besucher können daran erkennen wie viele andere Personen, auch an Ihren Webseiten interessiert sind.

Ich benutze hierzu das Plugin “ Count per Day „, es ist recht einfach einzustellen. Das Plugin zählt jeden Besucher, leider auch Browser Robots, aber selbst die kommen nicht jeden Tag 10-mal vorbei.

Wichtiger Hinweis:

  • das original PlugIn vers. 3.61 funktioniert nur bis zur PHP Version 7.4
  • für alle höheren Versionen von PHP ( 8.0, 8.1 ) benötigen Sie eine von mir modifizierte Version, die Sie hier Downloaden können. Besuchen Sie für weitere Informationen und Download bitte die Seite “ Count per Day “ aufsuchen, dort wird nochmals alles Beschrieben.
  • das PlugIn stammt nicht von mir. Ich habe es nur so angepasst, dass es lauffähig ist, auch mit höheren PHP Versionen (8.0, 8.1)

Die Anzeige ist zunächst für Ihr Dashboard vorgesehen, aber kann erweitert werden wenn Sie das möchten, auch im Footer.  Durch die Eingabe von einfacher Beschreibung und den Shortcodes, kann das sehr anschaulich dargestellt werden.

Die Dokumentation hierzu finden Sie in der Installationsdatei unter der Bezeichnung “ readme.txt „, leider nur in Englisch. Damit Sie sich nicht allzu sehr quälen müssen, habe ich hier einige der wichtigsten ShortCodes, wie auch auf meiner Seite vorhanden, hier vermerkt.

Ich habe dabei alle ShortCodes, damit auch auf jeder Seite sichtbar, über den Customizer von Astra, im Footer Text eingegeben. Sie können natürlich die Shortcodes auch überall auf anderen Seiten oder Beiträgen einsetzen.

Anmerkung: Die Farben der Darstellung sind natürlich auf meine Seite abgestimmt, die müssten Sie gegebenenfalls noch ändern.

Alle ShortCodes die Sie verwenden können sind hier aufgeführt. Ich hätte Sie Ihnen gerne zum Kopieren eingefügt, dies ist jedoch leider nicht möglich, denn sobald die eckigen Klammern um den ShortCode sind, wird dieser sofort durch/mit Werten ersetzt.

Shortcode 3

Möchten Sie nur einen Shortcode davon nutzen, dann funktioniert natürlich alles andere auch. Das Plugin “ BerDin-Funktionen “ ist nicht zum Einstellen vorbereitet, sondern es muss mit der Hand mit einem Editor, wie z.B. Notepad++, ( auf keinen Fall Word, wegen der Formatierungen ) bei Bedarf, geändert werden

count Per Day
so kann es aussehen, wenn die Shortcodes eingesetzt werden
BerDin funktionen
Ich weiß, die meisten wissen das alles schon, aber es soll ja auch noch viele Anfänger geben, die das noch nicht kennen und können. Nicht jeder ist so Clever wie Sie.

Astra Theme – Seiten schneller und einfach erstellen

Die größte Arbeit ist es eigentlich die Startseite zu erstellen und eine Ihrer Nachfolgenden Seiten. Wenn Sie diese erst einmal haben ist das meiste schon geschafft.

Alles funktioniert, die Farben Stimmen und der Aufbau, die Schrift ist grundlegend schon festgelegt. Damit haben Sie eigentlich alles für eine gut strukturierte Webseite erledigt.

Sie müssen jetzt nicht mehr das Rad ( die Webseite ) neu erfinden und jede neu bauen und erstellen. Kopieren Sie einfach die letzte erstellte Seite, benennen Sie sie um und das war es schon für Sie. Jetzt nur noch Texte Austauschen, Bilder und die nächste Seite ist fast schon fertig. Sie müssen nicht jedes Mal die Seite neu entwerfen, wenn Sie nicht grundlegende Strukturen ändern wollen. Halten Sie an einem festgelegten Muster fest, das macht es auch einfacher für Ihre Besucher, sich zurecht zu finden.

Das mach auch Zeitungsredaktionen nicht, die Grundlegende Struktur wird beibehalten, ein paar Spalten verschoben und fertig ist die neueste Ausgabe von Zeitung oder Magazin.

Vergleich sie einmal meine Seiten, sehen alle unterschiedlich aus, aber der Grundstil und Seitenaufbau ist exakt gleich. Ich entwerfe auch nicht jede Seite neu, Kopieren, Texte Tauschen, Bilder, erledigt. Ich möchte ja auch fertig werden und mache es mir einfach. Viele außer mir, machen das übrigens auch.

Ein einfaches PlugIn hilft Ihnen dabei und ist auch oft schon vorhanden, Sie haben es bisher nur vielleicht noch nicht gesehen oder beachtet. Falls bei Ihnen noch keines da ist, Installieren Sie z.B. Yoast Duplicate Post oder ein anderes PlugIn und Ihre Seite/Beitrag wird komplett mit allen Texten, Bildern und Formatierungen als Entwurf kopiert.

Gehen Sie hierzu in das Dashboard, zum Menu punkt Seiten/alle Seiten und duplizieren Sie einfach die komplette Seite/den Beitrag. Damit Sie nicht Durcheinanderkommen, ist der nächste Schritt gleich Quickedit und Sie Benennen die Seite gleich um, in den neuen Titel. Denn falls Sie z.B. mit dem Pagebuilder Elementor Arbeiten, wird die Seite gleich beim Speichern veröffentlicht und nur am Titel könnte das schwer zu erkennen sein, da müssten Sie schon das Datum beachten. Auf diese Art vermeiden Sie es, die falsche Seite zu Bearbeiten.

Copyright

Astra Theme – Copyright Anzeige auf jeder Seite

Der Copyright vermerk ist eigentlich fast schon ein muss auf jeder Internet WebSeite. Dieser taucht dann automatisch auf jeder erstellten Seite, meistens auch bei jedem Theme, auf die selbe Art auf. Sie setzen einfach den Copyright Vermerk in den Footer  des Astra Themes.

Eines gleich zu Beginn, das Copyrightzeichen © erreichen Sie mit der Tastenkombination:

Alt-Taste und 0169 “ ( wichtig: auf dem Ziffernblock)

Tragen Sie hierzu einfach im Textteil des Footers ein:

<b>Copyright © 2016 – [current_year] by
<a href=“https://www.ihre-domain.de/“>[site_title]</a></b>

<br><br>

Das ganze heißt übersetzt:

  • <b> HTML Zeichen für Fettschrif (bold) beginnt
  • Copyright © 2016 – bezeichnet z.B. den beginn seit dem Ihre Seite Online ist
  • [current_year] Bezeichnung für das aktuelle Jahr (wechselt jedes Jahr automatisch)
  • by die Urheberechte liegen bei
  • <a href=“https://www.ihre-domain.de/“> der Link zu Ihrer Webseite
  • [site_title] Titel Ihrer Webseite
  • </a></b> ende des Links, ende der Fettschrift (bold)
  • <br> HTML für Zeilensprung

Das einzige Problem das sich für Sie als Anfänger noch ergeben könnte, wären die farben der Schrift.

Ich habe einen dunkleren Hintergrund, viele nutzen aber auch reines Weiß oder etwas dunkler, dann wäre die Schrift schlecht zu sehen.

Nutzen Sie dann diesen Zusatzteil für die Schrift Formatierung:

<span style=“color:#000;font-size: 20px; font-weight: bold;“>

<b>Copyright © 2016 – [current_year] by
<a href=“https://www.ihre-domain.de/“>[site_title]</a></b></span>

<br><br>

Sollte Ihnen die fette Schrift zu stark sein, einfach das <b> entfernen

letze Aktualisierung der Seite

Astra Theme – Letztes Update der Seite

Wenn Sie öfters Seiten bearbeiten oder mit Beiträgen erweitern, finde ich es auch selbst gut, wenn der letzte Stand der Bearbeitung auch ersichtlich ist. Das liegt vor allem daran, dass ich ja auch keine uralten Beträge zu aktuellen Themen lesen mochte.

Die Grundidee war damals, den letzten Stand der Bearbeitung zu erkennen und vor allem diesen Text nur einmal zu entwerfen. Dies ist mit diesem HTML Text und etwas ShortCode möglich. Der Text bleibt zwar immer gleich

letzte Aktualisierung der Seite

Jetzt kommt der Seitentitel der sich je nach der gewählten Seite verändert. Danach

war am:

der Wochentag ausgeschrieben, Datum der letzten Bearbeitung und die Uhrzeit.

Der HTML Befehl und Shortcode:

  • <span style=“color:#FFCF61; font-size: 18px; font-weight:bold;“>‘ .get_the_modified_date( ‚l, d.m.Y – H:i‘) . ‚ Uhr </span>‘;

Das ganze heißt übersetzt:

  • <span style= einleitender HTML Tag
  • „color:#FFCF61; Farbe in die Schrift erscheinen soll der
  • font-size: 18px; Schriftgröße in Pixeln
  • font-weight:bold;“>  Schriftstil Fett
  • ‚ .get_the_modified_date ShortCode – aktuelles Datum der letzten Bearbeitung
  • ( ‚l, d.m.Y – H:i‘) . ‚  Kleines L = Wochentag ausgeschrieben, Komma, Leerzeichen, Tag. Monat Jahr, Bindestrich, Stunde: Min
  • Uhr  normaler Text
  • </span>‘; abschießender HTML Tag

Die Darstellung könnte auch noch verändert werden in dem man z.B. mit dem Texteditor folgenden Teil abändert:

  • ( ‚D, d.m.Y – H:i‘) . ‚  Wochentag gekürzte  Schreibweise
  • ( d.m.Y – H:i‘) . ‚ Wochentag komplett weglassen
  • ( d.m.Y – H:i:s‘) . ‚   Stunde, Minute Sekunde anzeigen lassen
  • ( d.m.y – H:i:s‘) . ‚ das Jahr zweistellig ausgeben lassen

Wie Sie sehen werden nur Buchstaben geändert, diese haben aber entscheidende Auswirkungen in der Darstellung des Schriftzugs.

Die Angaben zu Wochentag und Zeit können Sie willkürlich mischen je nachdem wie es Ihnen gefällt.

Wenn Sie das Wort Uhr nicht angezeigt haben möchten löschen Sie es einfach, nicht jedoch das Hochkomma vor dem Wort Uhr.

Den Text und Shortcode tragen Sie folgendermaßen im Customizer/Footer und danach im Textteil ein:Letzte Aktualisierungletzte Aktualisierung der Seite WordPress – Das Astra Theme – Tipps war am: Sonntag, 01.01.2023 – 19:27 Uhr
Damit alles, nur der Teil: Letzte Aktualisierung auch richtig funktioniert, müssten Sie noch ein PlugIn ( die Größe: 3kB, also lächerlich ) von mir herunter laden. Dieses enthält den Shortcode, für die Monate und deren Schreibweiset, herunterladen. ( aktualisiert sich auch automatisch ) Sie können diesen Teil natürlich auch nutzen, um Ihre eigenen ShortCode hinzuzufügen.

In dem Plugin zu Herunterladen, ist auch der Shortcode: Copyright enthalten. den Sie für die Anzeige:

  • Copyright ©

brauchen, falls Sie diese nutzen wollen.

Möchten Sie nur einen Shortcode davon nutzen, dann funktioniert natürlich alles andere auch. Das Plugin “ BerDin-Funktionen “ ist nicht zum Einstellen vorbereitet, sondern es muss mit der Hand mit einem Editor, wie z.B. Notepad++, ( auf keinen Fall Word, wegen der Formatierungen ) bei Bedarf, geändert werden.

Bildschirmausschnitt3

Astra Theme – die Unter-Menu Richtung

Wenn Sie ein normales Menu erstellen werden Sie diesen Hinweis nicht benötigen. Erst wenn Sie ein Untermenu einplanen, könnte es zu Problemen mit der Lesbarkeit und der Darstellung des Menus kommen.

Standardgemäß werden Untermenus immer rechts neben dem Hauptmenu angzeigt. Dieser Umstand kann jedoch dann stören, wenn etwa der Titel des Menupunktes zu lange ist und/oder Sie bereits, zu nahe am Bildschirmrand sind.

Durch einen einfachen CSS Befehl kann dieser Umstand behoben werden, indem Sie einfach die Richtung, in die sich das Menu öffnen soll, abändern.

Bildschirmausschnitt 4

Achtung: Der Standard ist rechts, Sie müssen den Befehl nur eingeben, wenn Sie vom Standard abweichen möchten.

  • Unter-Menu nach rechts öffnen: ast-right-align-sub-menu
  • Unter-Menu nach links öffnen: ast-left-align-sub-menu

Gehen Sie zum WordPress Dashboard wählen den Menupunkt Design und dann den Punkt Menu.

Bildschirmausschnitt 5

Nicht Vergessen, dieser Eintrag muss nur einmal gemacht werden, dann gilt der Eintrag für alle Punkte in diesem Menupunkt.

Wenn Sie einen weiteren Menupunkt erstellen wollen, muß dieser Vorgang wiederholt werden, sonst geht das Menu wieder in die andere Richtung auf.

Nach oben scrollen