Javascript und CSS über wp_enqueue_scripts einbinden

WordPress bietet eine Möglichkeit um CSS und Javascript über die Funktion wp_enqueue_scripts einzubinden. Der Codex empfiehlt diese Vorgehensweise gegenüber etwa dem hardcoden in den Theme-Dateien wie der header.php oder der footer.php. Zur Verbesserung der Website-Performance können dann gleich noch Script-Aufrufe nach wp_footer (also gegen Ende des Quelltexts) verschoben werden.

In der header.php finden sich beispielsweise solche oder ähnliche Anweisungen, die durch die Funktionen ersetzt werden sollen:

<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/style.css" type="text/css" media="screen" />
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/print.css" type="text/css" media="print" />
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/themename.js">
<script type='text/javascript' src='/js/jquery.js'></script>
<script type='text/javascript' src='/js/jquery-migrate.min.js'></script>

In folgendem Beispiel sollen nun die themename.js, die die jquery-Bibliothek benötigt, sowie die style.css und print.css des Themes eingebunden werden. Im wp_footer soll außerdem die WordPress-eigene jquery-Bibliothek eingebunden werden. Ein angenehmer Nebeneffekt ist, dass die eigene jquery-Kopie nicht mehr von Hand aktualisiert werden muss.

functions.php

// Theme Scripts & Styles registrieren
function themename_scripts_styles() {
  // Scripts: Name, URI, Abhängigkeiten, Version, in wp_footer platzieren?
  wp_register_script( 'themename-js', get_template_directory_uri() . '/js/themename.js', array( 'jquery' ), '2.05', true );
  wp_enqueue_script( 'themename-js' );
  // Andere Scripts in den Footer verschieben
  remove_action('wp_head', 'wp_print_scripts');
  remove_action('wp_head', 'wp_print_head_scripts', 9);
  remove_action('wp_head', 'wp_enqueue_scripts', 1);
  // CSS: Name, URI, Abhängigkeiten, Version, CSS Media Type
  wp_register_style( 'themename-screen', get_template_directory_uri() . '/style.css', false, '20140925', 'screen' );
  wp_enqueue_style( 'themename-screen' );
  wp_register_style( 'themename-print', get_template_directory_uri() . '/print.css', false, '20140925', 'print' );
  wp_enqueue_style( 'themename-print' );
}
add_action( 'wp_enqueue_scripts', 'themename_scripts_styles' );

Beim Erstellen eigener Funktionen können Generatoren zu Hilfe genommen werden. Bei der Verwendung von Child-Themes mit alternierenden CSS-Klassen sollte get_template_directory_uri() mit get_stylesheet_directory_uri() ersetzt werden.

Referenz

Kommentar-Formular mit comment_form anpassen

comments.php

comment_form();

ersetzen durch

$comments_fields =  array(
  'author' =>
    '<p class="comment-form-author"><label for="author">' . __( 'Name', 'domainreference' ) . '</label> ' .
    ( $req ? '<span class="required">*</span>' : '' ) .
    '<input id="author" name="author" type="text" value="' . esc_attr( $commenter['comment_author'] ) .
    '" size="25"' . $aria_req . ' /></p>',
  'url' =>
    '<p class="comment-form-url"><label for="url">' . __( 'Website', 'domainreference' ) . '</label>' .
    '<input id="url" name="url" type="text" value="' . esc_attr( $commenter['comment_author_url'] ) .
    '" size="25" /></p>',
);
$comments_args = array(         
    // Titel des Formulars
    'title_reply'=>'Anmerkung oder Frage schreiben',
    // Titel bei Antwort auf einen anderen Kommentar
    'title_reply_to'=>'%s antworten',
    // Text vor dem Formular
    'comment_notes_before' => '',
    // Kommentarfelder Autor, URI
    'fields' => apply_filters( 'comment_form_default_fields', $comments_fields ),
    //Kommentarfeld
    'comment_field'=>'<p class="comment-form-comment"><textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"></textarea></p>',
    // Text hinter dem Formular
    'comment_notes_after' => '<p class="comment-notes">Jeder Beitrag wird von Hand freigeschaltet.
    Mit dem Absenden Ihres Kommentars willigen Sie ein, dass der angegebene Name im Zusammenhang mit Ihrem Kommentar und ggf. Ihrer Website gespeichert wird.</p>',
    // Senden-Schaltfläche
    'label_submit'=>'Absenden'
  );
comment_form($comments_args);

Das E-Mail-Feld wurde in diesem Beispiel entfernt.

functions.php

Alternativ zur Defintion der Felder Autor, URI usw. über das Array $comments_fields lassen sich diese über eine Funktion in der functions.php deaktivieren.

function remove_comment_fields($fields) {
unset($fields['email']);
unset($fields['url']);
return $fields;
}
add_filter('comment_form_default_fields','remove_comment_fields');

Wer die Kommentarfunktion dann noch datensparsamer machen möchte, kann die Kommentare ohne IP-Adresse speichern lassen. Ein angepasstes Kommentarformular soll sich außerdem positiv auf das SPAM-Aufkommen auswirken, da die SPAM-Bots nach bestimmten Schlüsselbegriffen wie z. B. den erlaubten HTML-Tags suchen.

Referenz

Datenbank-Präfix von WordPress nachträglich ändern

Aus Sicherheitsgründen sollte nicht der Standard-Präfix wp_ in der Datenbank von WordPress verwendet werden. Dies ist eine von vielen Möglichkeiten um sich z. B. vor Botangriffen zu schützen.

Zunächst sollte ein Backup der Datenbank und der Datei wp-config.php erstellt werden.

Mit SQL-Befehlen werden nun die einzelnen Tabellen umbenannt. Soll der neue Präfix tp461o2_ sein, dann sieht das so aus:

RENAME TABLE `wp_commentmeta` TO `tp461o2_commentmeta`;
RENAME TABLE `wp_comments` TO `tp461o2_comments`;
RENAME TABLE `wp_links` TO `tp461o2_links`;
RENAME TABLE `wp_options` TO `tp461o2_options`;
RENAME TABLE `wp_postmeta` TO `tp461o2_postmeta`;
RENAME TABLE `wp_posts` TO `tp461o2_posts`;
RENAME TABLE `wp_terms` TO `tp461o2_terms`;
RENAME TABLE `wp_term_relationships` TO `tp461o2_term_relationships`;
RENAME TABLE `wp_term_taxonomy` TO `tp461o2_term_taxonomy`;
RENAME TABLE `wp_usermeta` TO `tp461o2_usermeta`;
RENAME TABLE `wp_users` TO `tp461o2_users`;

Im Anschluss müssen noch alle Werte in den Tabellen options und usermeta aktualisiert werden, die auf den alten Tabellenpräfix verweisen.

UPDATE `tp461o2_options` SET `option_name`=REPLACE(`option_name`,’wp_’,’tp461o2_’) WHERE `option_name` LIKE ‘%wp_%';
UPDATE `tp461o2_usermeta` SET `meta_key`=REPLACE(`meta_key`,’wp_’,’tp461o2_’) WHERE `meta_key` LIKE ‘%wp_%';

Zuletzt wird der Tabellenpräfix in der wp-config.php angepasst und alles sollte rund laufen:

$table_prefix  = 'tp461o2_';

Anzumerken ist noch, dass diese Methode zwar funktioniert, aber Schwierigkeiten auftreten können sobald weitere Tabellen von Plugins angelegt worden sind. Diese müssen dann auch entsprechend umbenannt werden. Am Besten wird der Präfix aber schon bei der Installation von WordPress entsprechend angepasst, so dass diese Änderung später gar nicht mehr nötig wird.

Referenz

Erweiterte Autoreninformationen ohne Plugin anzeigen

Realisiert werden soll die Anzeige von Autoreninformationen in der Einzelansicht von Beiträgen ohne Plugin. Folgende Punkte sollen angezeigt bzw. beachtet werden:

  • Links zur Website des Autors und ggf. sozialen Netzwerken, sofern diese Informationen im Profil angegeben sind
  • bisher verfasste Beiträge verlinkt mit dem individuellen Archiv des Autoren
  • Ausgabe des Website-Namens im Text via Abfrage, damit die Lösung variabel einsetzbar ist

Über die functions.php oder via Plugin werden benutzerdefinierte Autorenangaben möglich. In einer Multisite-Umgebung präferiere ich den Einsatz dieser Kontaktangaben netzwerkweit, also über ein Must-Use-plugin zu definieren. Zur Übersichtlichkeit auf der Profil-Seite werden dort zunächst AIM, Jabber und YIM deaktiviert.

function custom_contactmethods( $contactmethods ) {
  unset($contactmethods['aim']);
  unset($contactmethods['jabber']);
  unset($contactmethods['yim']);
  $contactmethods['twitter'] = 'Twitter';
  $contactmethods['facebook'] = 'Facebook';
  $contactmethods['xing'] = 'XING';
  return $contactmethods;
}
add_filter('user_contactmethods','custom_contactmethods',10,1);

single.php

<div class="postauthor">
  <p class="postauthorabout">&Uuml;ber den Autor<p>
  <h2><?php the_author(); ?></h2>
  <p class="postauthorbio"><?php if(get_the_author_meta('description') != NULL) { ?><?php the_author_meta('description'); ?> <?php } ?>
  Auf <?php bloginfo('name'); ?> stammen <a href="<?php echo get_author_posts_url( get_the_author_meta( 'ID' ) ); ?>" title="Alle Beitr&auml;ge von <?php the_author(); ?>"><?php the_author_posts(); ?> Beitr&auml;ge</a> aus der Feder von <?php the_author_meta('user_firstname'); ?>.</p>
  <p class="postauthorlinks">
  <?php if(get_the_author_meta('user_url') != NULL) { ?><a href="<?php the_author_meta('user_url'); ?>">Website</a> <?php } ?>
  <?php if(get_the_author_meta('facebook') != NULL) { ?><a href="<?php the_author_meta('facebook'); ?>">Facebook</a> <?php } ?>
  <?php if(get_the_author_meta('twitter') != NULL) { ?><a href="<?php the_author_meta('twitter'); ?>">Twitter</a> <?php } ?>
  <?php if(get_the_author_meta('xing') != NULL) { ?><a href="<?php the_author_meta('xing'); ?>">XING</a> <?php } ?>
  </p>
</div>

style.css

.postauthorabout { font-size:0.8em; }
.postauthorabout, .postauthorlinks { font-variant:small-caps; }
.postauthorbio { margin:0 0 0.8em 0; }
.postauthorlinks { font-weight:bold; }
.postauthorlinks a { margin:0 0.4em 0 0; }

Ergebnis

So kann das Ganze dann aussehen:

Autoreninformationen Screenshot

Referenz

Child-Theme erstellen

  1. einen neuen Theme-Ordner in /wp-content/themes/ erstellen z. B. themename-childthemebezeichnung (das erleichtert das Wiederfinden bei vielen Themes im Ordner)
  2. im Ordner themename-childthemebezeichnung eine style.css erstellen die mindestens folgendes enthält:
/*
Theme Name: Childthemename
Description: Ein Originaltheme-Childtheme.
Author: Johannes
Author URI: http://wpdoc.de
Template: Originalthemename
Version: 1.0
*/

Im Anschluss kann durch erstellen einzelner Styles, Funktionen oder Template-Dateien das Original-Theme angepasst werden.

Referenz

Suchfunktion verbessern

Realisation über ein Plugin. Beitrag dient als Notiz und wird kontinuierlich erweitert.

/*
Plugin Name: Verbesserte Suchfunktion
Description: Diverse Verbesserungen für die interne Suche auf der Website.
Version: 1.0
*/

// Bei einzelnem Suchergebnis sofort auf Beitrag/Seite weiterleiten

add_action('template_redirect', 'redirect_single_post');
function redirect_single_post() {
if (is_search()) {
global $wp_query;
if ($wp_query->post_count == 1 && $wp_query->max_num_pages == 1) {
wp_redirect( get_permalink( $wp_query->posts['0']->ID ) );
exit;
}
}
}

Referenz

TinyMCE-Editor ab WordPress 3.9: Buttons hinzufügen/entfernen, Formate bearbeiten

Ab WordPress 3.9 hat sich die Ansprache des Editors, der TinyMCE nutzt verändert. Über die functions.php, bevorzugt über ein Plugin, dass im Zweifelsfall einfach deaktiviert werden kann, können weiterhin Bearbeitungen des Editors vorgenommen werden. Im Codebeispiel sind bereits einige Deaktivierungen für Buttons auskommentiert, der Vollständigkeit halber aber aufgeführt.

Buttons entfernen

function delete_buttons($buttons) {
// unset($buttons[0]); // Fett
// unset($buttons[1]);  // Kursiv
// unset($buttons[2]); // Durchgestrichen
// unset($buttons[3]); // Aufzählungszeichen
// unset($buttons[4]); // Nummerierung
// unset($buttons[5]); // Zitat
unset($buttons[6]);  // Horizontale Linie
unset($buttons[7]); // Text links ausrichten
unset($buttons[8]);  // Text zentrieren
unset($buttons[9]);  // Text rechts ausrichten
// unset($buttons[10]); // Link hinzufügen
// unset($buttons[11]); // Link entfernen
unset($buttons[12]); // Weiterlesen-Tag
unset($buttons[14]); // Vollbild-Ansicht
return $buttons;
}
add_filter('mce_buttons', 'delete_buttons');

function delete_buttons_2($buttons) {
// unset($buttons[0]); // Absatzformatierung Auswahl
unset($buttons[1]);  // Unterstreichen
unset($buttons[2]); // Blocksatz
unset($buttons[3]); // Textfarbe
// unset($buttons[4]); // Als Text einfügen
// unset($buttons[5]); // Formatierung löschen
// unset($buttons[6]);  // Sonderzeichen
unset($buttons[7]); // Einzug verringern
unset($buttons[8]);  // Einzug erhöhen
// unset($buttons[9]);  // Schritt widerrufen
// unset($buttons[10]); // Schritt wiederholen
unset($buttons[11]); // Hilfe
return $buttons;
}
add_filter('mce_buttons_2', 'delete_buttons_2');

Absatzformatierung-Auswahl und Format-Auswahl bearbeiten

function mce_mod( $init ) {
$init['block_formats'] = 'Paragraph=p;Heading 3=h3;Heading 4=h4;Heading 5=h5;Blockquote=blockquote';
$style_formats = array (
array( 'title' => 'Fett', 'inline' => 'b' ),
array( 'title' => 'Kursiv', 'inline' => 'em' ),
array( 'title' => 'Unterstrichen', 'inline' => 'span', 'styles' => array( 'text-decoration' => 'underline' ) ),
array( 'title' => 'Durchgestrichen', 'inline' => 'del' ),
array( 'title' => 'Hochgestellt', 'inline' => 'sup' ),
array( 'title' => 'Tiefgestellt', 'inline' => 'sub' )
);

$init['style_formats'] = json_encode( $style_formats );
$init['style_formats_merge'] = false;
return $init;
}
add_filter('tiny_mce_before_init', 'mce_mod');

function mce_add_buttons( $buttons ){
array_splice( $buttons, 1, 0, 'styleselect' );
return $buttons;
}
add_filter( 'mce_buttons_2', 'mce_add_buttons' );

Referenz