Wie bei einer Standard WordPress Installation eine Anpassung der Formularfelder vorgenommen werden kann, habe ich in dem Bericht Kommentarfelder in WordPress anpassen beschrieben.

Nachdem ich inzwischen auf das leistungsstarke und schnelle Theme Astra umgestiegen bin musste ich jedoch feststellen, das die Kommentarfelder dort anders gecodet sind. Willst Du beim Astra Theme nun das Feld Webseite entfernen gibt es grundsätzlich zwei Möglichkeiten

Ausblenden des Feldes per CSS im Customizer oder entfernen des Feldes per Codeschnipsel in der function.php. Meine Empfehlung ist das entfernen per functions.php in einem Child Theme, da Du um ein Child  Theme  früher oder später sowieso nicht herumkommst. Es gibt immer Wünsche, welche eine Anpassung des Themes notwendig machen. Ein Beispiel ist die Anpassung der Tag-Cloud wie im Bericht Astra Theme -Widget Tag Cloud anpassen beschrieben. Zusätzlich habe ich noch einige Ergänzungen bzw. Änderungen realisiert, welche ich auch in Zukunft unter dem Schlagwort Astra dokumentiere.

Kommentarfeld Webseite per Codeschnipsel entfernen

Mit den folgenden Zeilen entfernst Du das Kommentarfeld Website aus Deiner Installation. Füge den Code einfach in die functions.php Deines Child Theme ein:

// Remove URL from comment form
function remove_comment_fields( $fields ) {
unset( $fields['url'] );
return $fields;
}
add_filter( 'comment_form_default_fields', 'remove_comment_fields', 60 );

Kommentarbereich in meiner Installation

In den von mir betriebenen Webseiten sieht der Kommentarbereich anders aus. Es gibt eine zusätzliche Auswahlmöglichkeit zum Abonnieren eines Newsletters. Dazu verwende ich MailChimp zusammen mit dem Plugin MC4WP zur Integration in WordPress. Falls dazu fragen bestehen könnt Ihr mich per Kommentar gerne kontaktieren. Hier findest Du die entsprechende Darstellung mit und ohne Webseite Feld.

Viel Erfolg wünscht Klaus

The post Astra Theme -Kommentarfeld Webseite entfernen appeared first on MSR-SUPPORT.

Vergleich der WP- zur Astra Widget Tag Cloud

Zusätzliche Optionen der Astra Cloud

• Anzeige der Cloud auf einzelnen Seiten und Kategorien verbergen
• Anzeige der Cloud auf Mobile, Tablett oder Desktop verbergen
• Ausrichtung links, rechts oder zentriert
• Anzeige je nach Nutzerstatus
• Widget Titel verbergen
• CSS-Class bzw. ID festlegen

Anpassung des Widgets per Codeschnipsel.

Trotz der vielen Optionen von Astra steht leider keine Option zur Anpassung der Schriftgröße und Begrenzung der Tag-Anzahl zur Verfügung! Ob diese Option in Zukunft noch nachgearbeitet wird, ist nicht garantiert.
Wer mit den festen Größen nicht zufrieden ist, kommt um eine Anpassung per Codeschnipsel in der function.php des Child Theme nicht herum.
Der von mir bereits beschriebene Code für die WordPress Tag Cloud kann dazu jedoch nicht verwendet werden.

Codeschnipsel zur Anpassung der Astra Cloud

// Astra Theme: Anpassung Widget-Tag-Cloud 
if ( ! function_exists( 'astra_widget_tag_cloud_args' ) ) :
function astra_widget_tag_cloud_args( $args = array() ) {
$sidebar_link_font_size = astra_get_option( 'font-size-body' );
$sidebar_link_font_size['desktop'] = ( '' != $sidebar_link_font_size['desktop'] ) ? $sidebar_link_font_size['desktop'] : 15;
$args['smallest'] = intval( $sidebar_link_font_size['desktop'] ) - 6; //kleinste Schrift
$args['largest'] = intval( $sidebar_link_font_size['desktop'] ) + 10; //groesste Schrift
$args['unit'] = 'px'; //Einheit px,em,pt
$args['number'] = '45'; //maximale Anzahl der Tags
$args['orderby'] = 'name'; //Sortierung nach Name 
$args['order'] = 'ASC'; //Sortierung aufsteigend
return apply_filters( 'astra_widget_tag_cloud_args', $args );
}
add_filter( 'widget_tag_cloud_args', 'astra_widget_tag_cloud_args', 90 );
endif;

Viel Erfolg wünscht KK!

The post Astra Theme -Widget Tag Cloud anpassen appeared first on MSR-SUPPORT.

Die Übersetzung von „Tag Cloud“ lautet Schlagwörter-Wwolke. Generell kannst Du in WordPress Deine Beiträge und Seiten verschlagworten. Diese Tags kannst Du nutzen, um in Ihrem Backend eine Übersicht aller mit einem bestimmten Schlagwort versehene Beiträge zu erstellen. Tags bzw.  Schlagwörter sind ein Filter um dazu passende Beiträge zu finden

Die Schlagwörter werden, meist über oder unter dem jeweiligen Beitrag angezeigt. Ich verwende sie über den Berichten nach dem Bild. Somit hat der Leser die Möglichkeit, eine Liste der verknüpften Artikel abzurufen. Eine Übersicht der verwendeten Schlagwörter bietet die WordPress Tag Cloud, sie sammelt alle Schlagwörter in einer „Wolke“ – arrangiert sie also auf einer kleinen Fläche. Um zu visualisieren, wie oft bestimmte Schlagwörter verwendet werden, stellt die WordPress Tag Cloud Schlagwörter in unterschiedlichen Schriftgrößen dar. Damit lässt sich auf einem Blick ablesen, zu welchen Themen Du schreibst und wie oft.

Tag Cloud -gestern und heute

Tag-Wolken (Schlagwort-Wolke) wurde in der Vergangenheit sehr häufig eingesetzt, verliert aber immer mehr an Bedeutung. In dem Artikel „WordPress: klickt jemand auf die Tag-Wolke“ hat Vladimir Simovic bereits vor längerer Zeit über die nachlassende Bedeutung berichtet. Ich verwende sie weiterhin gerne da damit ein schneller Überblick über die Kernthemen der Webseite möglich ist.

Schlagwort oder Stichwort

Der Begriff Tag wird oft fälschlicherweise mit Stichwort interpretiert, richtig ist jedoch der Begriff Schlagwort. Es existiert ein kleiner, aber feiner Unterschied zwischen diesen beiden Wortarten, den Du für Deine Recherche ausnutzen kannst.

• Stichworte sind Begriffe, die aus einem gegebenen Text extrahiert werden, z. B. aus Buchtitel oder Autoren-Namen. Mit Stichworten können Sie in vielen Suchkategorien arbeiten. Dazu gehört vor allem die Freie Suche, die den Titel, die Person und die Schlagwörter mit in die Suche einbezieht. Wenn man noch keine konkreten Vorstellungen oder Angaben hat, ist die Freie Suche ein guter erster Einstieg.
• Schlagworte hingegen müssen nicht aus einem vorgegebenen Text, z.B. der Titelangabe stammen. Sie werden der Publikation zum Zwecke der inhaltlichen Beschreibung zugeordnet.

Das Widget Schlagwörter-Wolke anzeigen und anpassen

Mit nur wenigen Klicks kannst Du für Deinen Webauftritt eine WordPress Tag Cloud einrichten:

1. Melde Dich im Backend an.
2. Klicke auf Design und wähle Widgets
3. Unter Widgets findest Du das Widget „Schlagwörter-Wolke“. Ziehe das Widget jetzt in die Sidebar oder in den Footer, in dem Du die Cloud anzeigen willst.
4. Gebe dem Widget einen passenden Namen und lege fest, ob die Anzahl der Tags dargestellt werden soll.
5. Speichern Sie die Einstellungen ab und schon bist Du fertig?

Leider sind die Einstellmöglichkeiten nur sehr beschränkt. Wer die Gestaltung anpassen möchte, kann aber auf eines der vielen Plugins zurückgreifen. Bei der Suche am besten als Suchbegriff Tag Cloud eingeben, das Angebot ist reichlich.

Anpassung der Tag Cloud per Codeschnipsel.

Da die Anpassung per Codeschnipsel in der function.php des Child Theme einfach möglich ist bevorzuge ich diese Lösung. Hier der dafür notwendige Code

add_filter( 'widget_tag_cloud_args', 'all_tag_cloud_widget_parameters' );
function all_tag_cloud_widget_parameters() {
    $args = array(
        'smallest' => 12, 
        'largest' => 18, 
        'unit' => 'pt', 
        'number' => 10,
        'format' => 'flat', 
        'separator' => "\n", 
        'orderby' => 'name', 
        'order' => 'ASC',
        'exclude' => '', 
        'include' => '', 
        'link' => 'view', 
        'taxonomy' => $current_taxonomy, 
        'post_type' ==> '', 
        'echo' => false
    );
    return $args;
}

Da meist nur einzelne Parameter zu ändern sind, ist am besten die Argumente, die Du nicht ändern möchtest, aus dem Array zu entfernen.
Soll z.B. nur die Schriftgröße geändert werden reduziert sich der Code wie im Folgenden dargestellt

add_filter( 'widget_tag_cloud_args', 'all_tag_cloud_widget_parameters' );
function all_tag_cloud_widget_parameters() {
    $args = array(
        'smallest' => 8, 
        'largest' => 24, 
        'unit' => 'px' 
    );
    return $args;
}

Viel Erfolg!

The post Widget Tag Cloud / Schlagwörter-Wolke anpassen appeared first on MSR-SUPPORT.

AIM, Yahoo, Jabber und Andere waren für mich Felder welche für meine Benutzer nur störend sind. Das Löschen dieser Kontaktinfo ist durch Aufnahme des folgenden Codeschnipsel in der function.php leicht zu realisieren.

// Benutzerprofile von unnoetigen Kontaktinfos entfernen
function hide_profile_fields( $contactmethods ) {
    unset($contactmethods['aim']);
    unset($contactmethods['jabber']);
    unset($contactmethods['yim']);
    unset($contactmethods[linkedin]);
    unset($contactmethods[myspace]);
    unset($contactmethods[soundcloud]);
    unset($contactmethods[tumblr]);
    return $contactmethods;
}
add_filter('user_contactmethods','hide_profile_fields',10,1);

Ich hoffe, der kleine Codeschnipsel hilft!

Hinzufügen von Kontaktinfo

Auch das Hinzufügen weiterer Kontaktinfos ist kein Problem, hier ein Beispiel für das Feld Web-Seite

// Hinzufügen der User Kontaktinfos TWITTER und FACEBOOK
function wisch_add_contactmethods($user_contactmethods) {
    $user_contactmethods['user_website'] = 'Web-Seite';
    return $user_contactmethods;
}
add_filter('user_contactmethods','wisch_add_contactmethods');

Diese Eingriffe in die User-Kontaktinfos sind natürlich auch kombinierbar. Abschließend nun noch die Frage, wie diese Felder gelesen werden können.
Zum Auslesen kann der Template-Tag the_author_meta genutzt werden. Dabei wird in diesem Beispiel die Info via wp_get_current_user zur aktuellen Benutzer-ID ausgelesen.

// User Kontaktinfo Web Seite anzeigen, falls vorhanden
$current_user = wp_get_current_user(); 
if( get_the_author_meta('user_website', $current_user->ID) ) { 
  echo the_author_meta('user_website', $current_user->ID);
  }

Dabei wird die ID des aktuellen Users übergeben.

Viel Erfolg wünscht Klaus

The post Kontaktinfo im WordPress Profil anpassen appeared first on MSR-SUPPORT.

Will man seine Kommentarfelder unter WordPress anpassen so steht als eine der ersten Aufgaben sicherlich die Anpassung der Eingabefelder zur Debatte.

Standardmäßig werden 4 Eingabefelder verwendet:

• Name
• E-Mail
• URL
• Eingabetext

In diesem Beitrag möchte ich mich mit den Eingabefeldern 1 bis 3 beschäftigen. Nur diese drei Felder werden über einen Filter behandelt.

Kommentarfelder per Codeschnipsel anpassen

Will man die Felder anpassen so ist in der function.php des Theme oder besser des Child-Theme folgende Ergänzung notwendig.

// Anpassung der einzelnen Formularfelder
function my_fields($fields) {
$req = get_option( 'require_name_email' );
// Text des Namensfeldes aendern
$fields['author'] = '<p class="comment-form-author">' . '<label for="author">' . 'Name' . '</label> ' . ( $req ? '<span class="required">*</span>' : '' ) .
		            '<br/><input id="author" name="author" type="text" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30"' . $aria_req . ' /></p>';
// Text des E-Mail-Feldes aendern
$fields['email'] = '<p class="comment-form-email"><label for="email">' . 'Email (wird nicht veröffentlicht)' . '</label> ' . ( $req ? '<span class="required">*</span>' : '' ) .
		            '<br/><input id="email" name="email" type="text" value="' . esc_attr(  $commenter['comment_author_email'] ) . '" size="30"' . $aria_req . ' /></p>';
// Text des Webseitenfeldes ändern
$fields['url'] = '';
//$fields['url'] = '<p class="comment-form-url"><label for="url">' . 'Website' . '</label>' .
//		            '<br/><input id="url" name="url" type="text" value="' . esc_attr( $commenter['comment_author_url'] ) . '" size="30" /></p>';
return $fields;
}
add_filter('comment_form_default_fields','my_fields');

Betrachte ihr diesen Code so fällt sicher auf, dass ich das Feld für die URL (Webseite) auskommentiert habe und das Feld stattdessen mit leerem Inhalt versehen habe. Hintergrund ist das Vermeiden von Spam.

Wenn man nicht will, dass Spammer und Suchmaschinenoptimierer Ihre Kommentare mit Links zu Ihrer Webseite hinterlassen, sollte man entweder

• die Freischaltung der Kommentare von Hand übernehmen.
• einen Spam Filter wie Akismet benutzen, der allerdings nur für private Zwecke (ohne Werbung) kostenlos ist
• oder die Eingabe von Webseiten in das entsprechende Input-Feld der Kommentare verhindern

Da ich den Nutzen der Webseitenangabe gering einschätze, verzichte ich gerne auf diese Spamquelle

The post Kommentarfelder in WordPress anpassen appeared first on MSR-SUPPORT.

Meine Standardeinstellungen WordPress Medien

Warum ich diese Standardwerte verwende, ist in dem Bericht Bildgrößen der Mediathek -Grundeinstellungen von WordPress beschrieben

1. Vorschaubild: 150 x 150 px
2. Mittel: 420 x 280 px
3. Groß: 840 x 560 px
4. Vollständige Größe (Full), diese Größe entspricht der Originalgröße des hochgeladenen Bildes. Ich verwende dazu 1600 x 900 px. (Die Originalgröße ist später nur auswählbar, wenn das Bild größer als das „Groß“ Format ist)

Je nach Theme kann es sein, dass zusätzliche Formate gespeichert werden.

Testbild-Bildgrößen im Format 3:2 und die gespeicherten Varianten

An dem Beispiel ist gut zu erkennen, dass zusätzlich zu dem Bild vollständige Größe (Full) weitere 5 Bildgrößen gespeichert wurden, zwei mehr wie durch WP vorgegeben. Das Format 300×200 ist ein von mir hinzugefügtes Format und das Format 135×135 wird von einem Plugin verwendet. Je nach Themes und Plugins können so schnell 10 und mehr Varianten eines Bildes entstehen.

Zusätzliche Bildgrößen hinzufügen

Will man ein zusätzliches Format als Ergänzung zu den Standardeinstellungen nutzen, ist dies kein großes Problem. Grundsätzlich gibt es zwei Möglichkeiten:

1. Mit einem Plugin oder per
2. Codeschnipsel in der function.php des Themes

Beide Varianten werde ich im Folgenden beschrieben

Zusätzliche Bildgrößen per Plugin Simple Image Sizes hinzufügen

Die Lösung Bildgrößen per Codeschnipsel zuzufügen wurde von mir bei der Erstausgabe dieses Berichtes als alleinige Lösung beschrieben. Inzwischen hat sich jedoch einiges getan und wie bei vielen Erweiterungen zu WP gibt es ein Plugin, welches die Aufgabe hervorragend erfüllt. Ich habe deshalb den Bericht komplett überarbeitet und die ursprüngliche Lösung per Codeschnipsel an zweite Stelle gesetzt.

Das Plugin Simple Image Sizes erfüllt alle Anforderungen in einfach zu handhabenden Form und bietet zusätzlich auch noch die Lösung bereits bestehende Bilder um das neue Format zu ergänzen.

Nach der Installation des Plugins werden unter Einstellungen / Medien alle zur Verfügung stehenden Bildgrößen, auch die versteckten, aufgelistet. Hier kann man die Bildgrößen ändern oder neue Bildgrößen hinzufügen. Das Plugin stellt sogar den PHP Code für neue Bildgrößen zur Verfügung, falls man diese direkt im Theme verankern möchte.
Insbesondere bei komplexen Themes, die viele unterschiedliche Bildgrößen haben, hilft das Plugin, einen Überblick über die zur Verfügung stehenden Bildgrößen zu erhalten und hier ohne viel Aufwand, Änderungen vornehmen zu können.

Nach Änderung einer Bildgröße können dann alle oder auch nur einzelne Bilder neu generiert werden. Anschließend steht das Bild oder die Bilder in der neuen Bildgröße in der Mediathek zur Verfügung. Ich denke, die Darstellung ist selbsterklärend.

Fazit
Mit dem Plugin „Simple Image Sizes“ kannst du sehr einfach neue Bildgrößen und Bildformate für deine WordPress Installation anlegen.  Außerdem wird das Plugin vom Entwickler regelmäßig gepflegt und ist damit auch in Zukunft noch nutzbar.

Zusätzliche Bildgrößen per Code hinzufügen

Die dazu benötige Funktion ist im WordPress-Codex beschrieben
Damit diese Bildgröße später ansprechbar ist, ist es erforderlich, ihr einen eindeutigen Namen zuzuordnen. Nicht verwenden darf  die Bezeichnungen „thumb“, „thumbnail“, „medium“, „large“ und „post-thumbnail“, da diese von WordPress bereits reserviert sind.

In meinem Beispiel verwende ich  das zusätzliche Format 300 x 200 px. Der dafür notwendige Codeschnipsel muss in der function.php des Themes aufgenommen werden.

add_image_size('medium-300x200', 300, 200, false); //Bildformat 300x200

WordPress bietet dazu vier Parameter, um das Bild zu konfigurieren (Name, Breite, Höhe und Zuschnitt).
Für den Zuschnitt verwende ich den Parameter false, um das Bild im gleichen Seitenverhältnis zu erhalten. Bei Verwendung des Parameters „true“ wird, falls das Format nicht vorhanden ist, ein Ausschnitt des Miniaturbildes mit dem exakten Format erstellt.
Hinweis: Die zusätzlichen Bilder, bzw. Bildgrößen werden immer dann erzeugt, wenn ein neues Bild hochladen wird. Alte Bilder bleiben von den Veränderungen unberührt.
Mit dem Plugin Regenerate Thumbnails kannst du aber alle bestehenden Bildgrößen, die in deiner Medienbibliothek hochgeladen wurden neu generieren.

Nun ist es zwar schön und gut, dass man die Bilder in der passenden Größe hat, doch man sollte sie auch in der Medienbibliothek, bzw. in den Dialogen beim Artikelschreiben verwenden können. Dazu muss zusätzlich in der functions.php ein Filter hinzufügt werden.

Codeschnipsel des kompletten Beispiels

// Eine neue Bildgroesse hinzufuegen
add_image_size('medium-300x200', 300, 200, false); //Bildformat 300x200
add_filter( 'image_size_names_choose', 'my_custom_sizes' );
function my_custom_sizes( $sizes ) {
return array_merge( $sizes, array(
'medium-300x200' => __('Medium 300x200'),
) );
} 

The post Zusätzliche Bildgrößen der WP Mediathek per Code oder Plugin hinzufügen appeared first on MSR-SUPPORT.

WordPress Standard Bildgrößen (Default Einstellung)

WordPress ermöglicht 4 Bildformate, Vorschaubild (Thumbnail), Mittel (Medium), Groß (Large) und Vollständig (Full). Nach der Neuinstallation von WordPress findest du folgende Defaulteinstellung:

1. Vorschaubild: 150 x 150 px
2. Mittel: 300 x 300 px
3. Groß: 1024 x 1024 px
4. Vollständige Größe: Originalgröße ist nur auswählbar, wenn das Bild größer als das „Groß“ Format ist.

In der Wirkung bedeutet dies, dass zu jedem Original (Web-Bild) zusätzliche Vorschaubilder abgespeichert werden. Diese Bilder sind dann per Link mit dem Original-Bild verknüpft.
Den Unterschied zwischen Origil-Bildern und Web-Bildern habe ich bereits im Bericht „Bilder fürs Web optimieren -Empfehlungen und Tipps“ beschrieben.

Meine Empfehlung zur Einstellung der Bildgrößen der Mediathek

Grundlage meiner Empfehlung ist die Breite des Content des verwendeten Themes, in meiner Seite ist dieser maximal 840 px. Da ich die meisten Bilder im Format 3:2 verwende, ist die Höhe in diesem Verhältnis angepasst.

1. Miniaturbilder 150 x 150 mit der Option „Miniaturbild auf exakte Größe zuschneiden.“
   Die Miniaturbilder werden als Artikelbilder verwendet und sollten möglichst gleich groß sein. Ein Ausschnitt ist bei einem so kleinen Bild zulässig.
   Ich verwende diese Größe auch bei großen Galerien, d.h. bei 4 bis 5 Bildern pro Zeile
2. Mittlere Bildgröße 420 x 280. Diese Größe stellt das Bild schon in guter Qualität dar und kann gut in den Textfluss eingepasst werden. Es empfiehlt sich nicht mehr als die Hälfte des Content-Bereiches zu nutzen.
3. Maximale Bildgröße 840 x 560. Mit dieser Größe wird der Content voll ausfüllt, solche Bilder werden bei Einzelberichten als Kopfbild dargestellt
4. Original Web-Bild 1600 x 900 px. Diese Bild wird mit externen Mitteln, d.h. per Fotosoftware oder mit dem Kompression-Plugin erstellt und wird als Lightbox Bild angezeigt

Zusätzlich zu diesen Standards verwende ich noch das Formate 300 x 200 und für Galeriefunktionen mit 3 bzw. 4 Bildern in einer Zeile. Um dies zu nutzen, muss jedoch etwas Code ein der function.php eingesetzt werden: Siehe WordPress -Neue Bildgrößen hinzufügen.

Galeriedarstellung von zwei Bildern im Querformat (Mittel 420 x 280 px)

Zusätzlich zu diesen Standards verwende ich noch das Formate 300 x 200 und für Galeriefunktionen mit 3 bzw. 4 Bildern in einer Zeile. Um dies zu nutzen, muss jedoch etwas Code ein der function.php eingesetzt werden: Siehe Zusätzliche Bildgrößen der WP Mediathek per Code oder Plugin hinzufügen

Neue Bildformate auf bereits bestehende Bilder anwenden

Alle vor der Umstellung an der Mediathek gespeicherten Bilder bleiben von den Änderungen unberührt, sie sind in den alten Formaten gespeichert und soweit verwendet in den Beiträgen entsprechend gespeichert.
Wird nach der Umstellung in der Mediathek ein älteres Bild zum Beispiel im Format „Medium“ eingefügt, wird es zwar in den neuen Abmessungen eingefügt, der Link verweist aber auf das alte Format. Zur Anpassung wird das Bild skaliert, d.h. Höhe und Breite werden entsprechend definiert.

Wie fast immer gibt es für die alten Formate eine Lösung, das Plugin „Regenerate Thumbnails“ übernimmt die Anpassungen aller Bilder die über die WordPress Mediathek hochgeladen wurden. Für jedes neue Format wird zusätzlich zu dem bestehenden Bild ein weiteres erstellt. Die alten Bilder bleiben aber erhalten, um keine Veränderung in den alten Berichten zu kreieren. Nur die Artikelbilder werden, falls das Miniaturformat geändert wurde angepasst, aus meiner Sicht eine sehr gute Lösung.

The post Bildgrößen der Mediathek -Grundeinstellungen von WordPress appeared first on MSR-SUPPORT.

Original-Bilder sind Bilder direkt aus der „Kamera“
und
Web-Bilder sind Bilder welche für das Web optimiert sind

Bilder sind ein wesentlicher Bestandteil der Webseiten. Da die Ladezeit ein wesentlicher Rankingfaktor für die Suchmaschinen ist, gilt es auf optimierte Bilder zu achten. Auch auf Webseiten gilt häufig der alte Spruch: Ein Bild sagt mehr als tausend Worte, deshalb werden sie gerade auf Webseiten reichlich eingesetzt, verursachen aber die größten Datenmengen. Neben einer guten Motivauswahl, kommt es daher darauf an das richtige Bildformat zu wählen und die Bilder zu komprimieren. Je kleiner die Bilddateien sind, desto kleiner ist die Datenmenge, umso schneller lädt die Seite. Das Nutzungserlebnis deiner Besucher wird gesteigert und das Google Ranking belohnt die Mühe.

Original-Bilder

Original-Bilder werden je nach Kameratyp und Einstellung in unterschiedlichen Formaten erstellt. Bei hochwertigen Kameras geht der Trend zum Format 3:2, dies entspricht den Sensorformaten und dem alten Negativ Filmformat 24 x 36. Kleinere Kompaktkameras mit kleinem Sensor tendieren mehr zum Format 4:3. Mobile (Handys, Smartphone) verwenden meist das Format 16:9. Für alle gilt aber, dass eine hohe Auflösung heutzutage selbstverständlich ist. 6000 x 4000 px (bei 3:2) ist heute eine normale Größe.

Es wäre nun leichtes das Original-Bild der Kamera im Web zu verwenden.  Die damit verbundene Dateigröße von über 10 MB würde jedoch zu langen Ladezeiten beim Aufruf der Webseite führen. Von Google werden solche großen Bilddateien abgestraft, also ein Grund sich Gedanken zu machen. Für das Web werden Bilder mit kleiner Datenmenge benötigt damit die Ladezeit, d.h. die Zeit bis deine Webseite auf dem Bildschirm angezeigt wird so klein wie möglich ist

Empfehlung: Bildgröße für Web-Bilder max 1600 x 900 px

Meine Empfehlung basiert darauf, dass ich meine Bilder überwiegend im Format 16:9 oder 3:2 erstelle. Zusätzlich gilt es eine Größe zu verwenden welche auf allen Geräten Handy, Tablet und Desktop gut dargestellt werden kann. Die Größe 1600 x 900 px ist dazu meine Empfehlung. Dies basiert auf dem Format des Displays. Die Standard-Auflösung für HD-Ready beträgt 1280 x 720 Pixel, bei Full HD beträgt die Auflösung 1920 x 1080 Pixel, dies entspricht dem Format 16:9.
Da auch Smartphones und Tablets heute mindestens 1280 x 720 px beherrschen und hochwertige Smartphones meist Full HD 1.920 x 1.080 px unterstützen müssen wir uns an Full HD orientieren.

Meine Empfehlung 1600 x 900 entspricht zwar nicht dem Wert von Full HD, stellt aber einen guten Kompromiss dar. Den Unterschied zu dem vollen Wert 1920×1080  wird keiner erkennen, wir erhalten aber eine kleinere Datenmenge. Tante Google wird es danken.

Vorteile der Web-Bilder

• Die Ladegeschwindigkeit deiner Seite wird verbessern.
• Kombiniert mit einem guten SEO Plugin, ich empfehle dazu Yoast SEO, verbessert dies die SEO. Die Webseite wird in den Suchmaschinenergebnissen einen höheren Rang einnehmen.
• Google wird die Bilder wahrscheinlich schneller für die Google-Bildsuche durchsuchen und indizieren.
• Die Erstellung von Backups wird schneller ablaufen.
  Kleinere Bilddateigrößen verbrauchen weniger Bandbreite. Netzwerke und Browser werden dies zu schätzen wissen.
  Benötigt weniger Speicherplatz auf deinem Server (abhängig davon, wie viele Miniaturansichten Du optimierst).
• Die Speicherkapazität des Servers wird nicht unnötig belastet
• Beim Upload, speziell von mehreren Bildern gleichzeitig entstehen keine zu große Datenmengen, welche den Upload blockieren können
•  

Ich reduziere deshalb bereits vor dem Upload die Bildgröße und die JPD Kompression des Web-Bildes auf maximal 1600 x 900 px mit einem Kompressionsfaktor von 70 %. Selbst einfachste Fotosoftware stellt dazu Funktionen zur Verfügung. Ich verwende dazu die Fotosoftware von ACDSee, es geht aber auch mit Freeware.

Beispiel-Bild mit und ohne JPG Kompression

Das Original-Bild hatte 5,5 MB
Bitte teste selber wie das Bild auf dem Bildschirm wirkt!

Bildkompression zur optimalen Erstellung eines Web-Bild

Die Bildkompression beruht darauf, die ursprünglichen Daten entweder in eine vollständig rekonstruierbare Form zu überführen, die weniger Speicherplatz benötigt oder Daten zu entfernen, deren Verlust kaum wahrnehmbar ist.

Um die Datenmenge der Bilder optimal zu reduzieren, setzte ich deshalb zusätzlich ein Plugin zur Bildkompression ein. Da solche Plugins meist auch eine Option zur Reduzierung der Bildgröße während des Upload-Vorgangs besitzen, erspart man sich den Arbeitsschritt der Größenreduktion am PC. Wer solche Plugins verwendet sollte bei seiner Plugin Auswahl auf dieses Feature achten. Hier zwei empfehlenswerte Plugins:

• Compress JPEG & PNG images -Optimiere deine JPEG- und PNG-Dateien automatisch mit TinyPNG.
• EWWW Image Optimizer -Reduziert Dateigrößen für Bilder innerhalb WordPress

Galeriedarstellung von zwei Bildern im Format 3:2

Bilder in diesem Format werden nach der Größenänderung in der Bildgröße 1350×900 px angezeigt. Die Höhe ist der Begrenzungswert.

Meine Beschreibung habe ich auf das am häufigsten, im Web, verwendete Dateiformat beschränkt. JPG manchmal auch JPEG geschrieben, wurde speziell zum Speichern von Fotografien entwickelt. Das JPG-Format eignet sich vor allem für Bilder mit fotorealistischen Motiven, die in guter Qualität, aber recht geringem Datenvolumen abgespeichert werden sollen.

Weitere Dateiformate für Web-Bilder sind PNG, GIF und SVG

• Das PNG-Format ist eine Alternative zum JPG. Die Komprimierung des PNGs ist jedoch nicht so verlustreich wie beim JPG, weshalb die Datenmenge größer ist.
• Das GIF-Format kann Bilder nur mit maximal 256 Farben darstellen. Es kommt daher vor allem bei Motiven wie z.B. Logos, Icons, Illustrationen oder Navigationsbilder zum Einsatz.
• Das SVG-Format ist ein Vektorformat und kommt zurzeit nur sehr selten zum Einsatz.

The post Bilder fürs Web optimieren -Empfehlungen und Tipps appeared first on MSR-SUPPORT.

Die gesamte Problematik muss dazu in zwei Aktionen aufgeteilt werden.

1. Upload von GPX KMZ und KML

Alle drei GPS Dateien werden von WordPress nicht unterstützt. Will man solche Dateien in die Mediathek hochladen kommt die Fehlermeldung:

„Dieser Dateityp ist aus Sicherheitsgründen leider nicht erlaubt.“

Standardmäßig kann man mit dem integrierten Uploader  nur bestimmte Dateitypen hochladen. Welche, das bestimmen die WordPress Mime-Types. Man könnte auch sagen, die Dateiendung muss stimmen, sonst verweigert WordPress den Upload. Das ist eigentlich aus Sicherheitsaspekten gut, denn so können potenziell schädliche Dateien, die beim normalen Betrieb einer Website nicht benötigt werden, gar nicht erst hochgeladen werden. Für Betreiber von Webseiten mit Routenempfehlung ist dies jedoch ärgerlich.

Erlaubte WordPress Mime-Types

Eine Übersicht der erlaubten Dateitypen bzw. Dateiendungen (WordPress Mime-Types gibt es hier. Das sind neben Bilddateien überwiegend  Mediadateien, wie gängige Audio- und Videoformate.

GPX, KMZ und KML Upload per Plugin oder Codeanpassung?

Bei der Suche nach einem entsprechenden Plugin wird man schnell fündig. Das Plugin WP Extra File Types leistet, was der Titel verspricht. Versierte Anwender finden jedoch auch schnell den Code um in der function.php eine Anpassung vorzunehmen.

Da ich bereits ein mächtiges Plugin „Media Library Assistant“ verwende, war dies meine erste Wahl.

Erlaubte Dateitypen für den Upload mit dem  Plugin Media Library Assistant ändern

In der deutschen Ausführung ist das Plugin unter dem Namen Medien-Assitent unter Einstellungen zu finden. Dort findet man unter Uploads alles, um die Mime Typs von WordPress zu erweitern.

Wichtig ist bei den Einstellungen ist, dass die Option Always Use MLA MIME Type aktiviert wird, um die Sicherheitsüberprüfungen vom Typ WordPress MIME zu überschreiben.

Das war’s, einfacher geht nicht. Ein Blick auf die anderen Features des Plugin kann nicht schaden. Ich verwende es zum Beispiel auch dafür IPTC bzw. EXIF Daten beim Hochladen in die Mediathek den WP Bilder zuzuordnen.

2. Download der GPX-Datei 

Nachdem der Upload reibungslos funktionierte musste ich allerdings feststellen, dass man auf die GPX-Datei nicht zugreifen konnte (KML und KMZ funktionierte).

Bei manchen Browsern werden die GPX-Dateien als .txt-Datei heruntergeladen oder als XML direkt im Browser geöffnet.

Die Lösung dafür ist eine Anpassung in der .htaccess Datei welche im  Root-Verzeichnis von WordPress zu finden ist.

Die .htaccess-Datei ergänzt man nun um folgende Code Zeile und speichert die Datei ab:

AddType application/gpx+xml .gpx

Ggf. muss man anschließend noch den Cache vom Browser löschen. Danach sollte es möglich sein, dass GPX-Dateien auch als solche heruntergeladen werden.

The post GPX Up- und Download unter WordPress appeared first on MSR-SUPPORT.

Die WordPress Bildkomprimierung ist ein gutes Tool welches beim Upload von Bildern eine gute Datenreduktion liefert.

Der  Gedanke Bilder  ohne Hilfsprogramme direkt in die Mediathek zuladen  ist sicherlich richtig. Gleichzeitig muss aber beachtet werden, dass Bilder häufig Lustbremsen der Webseite sind. Lange Ladezeiten werden oft maßgeblich durch zu große Bilddateien hervorgerufen.

Letztendlich ist selbst mit diesem Bordmittel die Bildkomprimierung noch nicht ausreichen und der Einsatz eines Plugin wird notwendig. In diesem Bericht möchte ich aber zuerst nur die WordPress Bildkomprimierung in der Standardausführung behandeln. Ein Plugin zur weitergehende Komprimierung habe ich in dem Bericht WordPress -Bilder optimieren für das Web (Optimus) bereits beschrieben, weitere werden folgen.

Bei meiner Recherche zur WordPress Mediathek  und Bildkomprimierung fand ich eine hilfreiche Information.

 Kaum jemand weiß, dass WordPress Bilder im JPEG-Format automatisch auf 82% ihrer ursprünglichen Größe verkleinert!

Dies erklärt, warum in den Optionen der Mediathek keine Einstellmöglichkeit für die Bildkomprimierung zu finden ist.

Standard Bildkomprimierung durch WordPress

Ich habe in Test mit eigenen Bildern die WP Datenreduktion geprüft und das Ergebnis mit externen Kompressionsprogrammen verglichen.  Von  Ergebnis war ich sehr erfreut, die WordPress Datenkompression kam meist, zu besseren Resultaten  wie mit meinen Fotoprogrammen. Teilweise konnte ich deutlich bessere Datenreduktion bei gleicher Bildqualität erreichen.

Für Anwender selbst von hochwertiger Kameras bedeutet dies, dass sie das Originalfoto direkt auf den Server hochgeladen können.  Bei einem Foto  mit 6000×4000 Pixel können dies  aber leicht bis zu 14 MB große Dateien sein. Das Hochladen der Bilder braucht dann je nach Übertragungsrate WLAN, LAN ewig! Da ich keinen Nutzen darin sehe, solche Datenmengen auf meinen Server hochzuladen ist mein Tipp:

Zuerst das Foto im Fotobearbeitungsprogramm auf die Maximalanwendung „Web-Bild“ (1600 x 900 px mit Q=70 %) reduzieren und dann die drastisch verkleinerte Datei  von rund 100 bis 200 KB hochladen. Selbst größere Bildermengen werden dann ratzfatz in die Mediathek geladen.

WordPress Bildkomprimierung von JPEGs anpassen

Falls man mit der Basiseinstellung von WordPress nicht zufrieden ist, besteht die möglich den Wert abzuschalten oder einen anderen Wert zu verwenden.

Dazu  navigiert man in den Ordner des verwendeten Themes und öffnet die Datei functions.php. Dort fügt man folgenden Code ein:
add_filter('jpeg_quality', function($arg){return 100;});
add_filter( 'wp_editor_set_quality', function($arg){return 100;} );

Damit wird die Komprimierung von JPEG-Bildern durch WordPress ausgeschaltet. Die 100 bedeutet, dass die Bildqualität von JPEGs nun bei 100 % liegt. Dementsprechend kann man auch eine höhere Komprimierung als 82 %  einstellen, indem man einen kleineren Wert als 82 wählt.

Aus einem Foto mach viele Fotos

Für den neuen Betrachter ist es oft eine Überraschung. Schaut man per FTP Proramm in den  Ordner „uploads“ so findet man nicht eine Bilddatei, sondern viele verschiedene Varianten.

Beim Hochladen der Bilder werden locker rund 10 verschiedene Bildformate, je nach verwendetem Plugin oder Theme,  produziert. Ich habe für mein Theme auch zusätzliche Formate konfiguriert. Wie man solche zusätzliche Formate konfiguriert habe ich in dem Bericht WordPress -Neue Bildgrößen hinzufügen beschrieben

Der Vorteil der Varianten besteht darin, dass nicht immer das große Bild, selbst beim Betrachten von Minibildern, geladen werden muss. Die Geschwindigkeit der Webseite wird so deutlich verbessert. Der Besucher wird es danken.

The post WordPress Bildkomprimierung ist beim upload sehr gut appeared first on MSR-SUPPORT.

Das Copyrightzeichen © stellt im Urheberrecht ein Symbol zur Kennzeichnung eines bestehenden Schutzes dar. Ich verwende das Zeichen bei meinen Fotos bereits seit langer Zeit in den IPTC Daten. Nicht beachtet hatte ich, dass dieses Zeichen nicht auf allen Systemen zur Verfügung steht. Meist wird in solchen Anwendungen das Zeichen dann nicht dargestellt oder durch andere Hieroglyphen ersetzt. Dies ist zwar nicht schön, damit kann man aber leben.

Ärgerlich wird es wenn das Copyrightzeichen Fehler in der Programmausführung verursacht. In meiner WordPress Version 5.2.4 war dies der Fall.

Fehlerbeschreibung des Copyrightzeichen in der WordPress Installation

• Beim hochladen von Fotos werden allen Foto Varianten (Thumb-Größen) erzeugt. Dies konnte ich per FTP prüfen.
• In der Mediathek wird das kleine Vorschaubild nicht dargestellt. Richtig müsste es lauten, es wird ein Bild mit 1px Größe angezeigt. Alle anderen Informationen funktionieren.
• Das Foto kann über die Menüpunkte Bearbeiten und Anschauen dargestellt und bearbeitet werden und man erhält den Eindruck, dass alles korrekt funktioniert.
• Spätesten wenn man das Bild in einen Bericht einfügen will stellt sich heraus, dass etwas faul ist. Die Option der Bildgrößenauswahl wird nicht angezeigt. Falls man dies übergeht und das Bild in den Bericht einfügt kommt dann die Ernüchterung. Es wird nur ein Bild mit 1 px Größe aktiviert.
• Wird das Bild, ohne das Copyrightzeichen, in den IPTC Daten hochgeladen funktioniert es bestens.

Um es kurz zu fassen, es hat mich einiges an Zeit gekostet den Fehler zu lokalisieren. Ärgerlich war auch, dass nicht in allen von mir untersuchten Webseiten der Fehler auftrat. Ob es an der WordPress Version lag bezweifle ich da ich unterschiedlicher Versionen untersucht habe. Auch der Einfluss von Plugins kann ausgeschlossen werden da ich zuerst alle Plugins im Rahmen der Fehlersuche deaktiviert hatte.

Um in Zukunft solchen Problemen aus dem Weg zu gehen habe ich davon Gebrauch gemacht das Symbol durch Klammern anzudeuten(C).  Laut Wikipedia ist dies eine zulässige Darstellung. Zusätzlich habe ich all meine Fotos per Stapelverarbeitung auf das Zeichen untersucht und ersetzt.

Ich hoffe der Tipp hilft anderen welche in die gleiche Falle tappen. Natürlich brauchen Anwender welche das Copyrightzeichen nicht verwenden sich keine Sorge machen, oder? Auch andere Sonderzeichen sind nach dieser Erfahrung mit Vorsicht zu verwenden. Dies gilt natürlich nicht bei Verwendung des entsprechen Codes im HTML Code.

So erzeugen Sie das Copyright in HTML

HTML ist nicht ganz einfach, wenn es um Sonderzeichen geht. Doch es gibt einen Ausweg: Die so genannten Entities sind zuständig, wenn es um das Anzeigen von Copyright oder anderen Symbolen geht.
In HTML gibt es für das Copyright-Zeichen © ein eigenes Entity. So nennt man spezielle Abkürzungen zum Darstellen von Zeichen, die nicht in allen Zeichensätzen vorhanden sind.
Um in HTML ein Copyright-Zeichen zu erzeugen, geben Sie ein:

©

Alternativ dazu können Sie die Unicode-Nummer des Zeichens verwenden:

©

The post Copyrightzeichen -Fehlerquelle in WordPress Mediathek appeared first on MSR-SUPPORT.