de.hideout-lastation.com
Paradies Für Designer Und Entwickler


10 WordPress Template Tags, die Sie möglicherweise nicht wissen

WordPress wird seit seiner Einführung mit zahlreichen Template Tags ausgeliefert. Diese Vorlagen-Tags in WordPress sind PHP-Funktionen, die zum Ausgeben und Abrufen von Daten verwendet werden können .

Wenn Sie ein WordPress-Theme entwickelt haben, sind Ihnen möglicherweise einige dieser Template-Tags bekannt, z. B. the_title mit dem Titel des Beitrags, the_author mit dem Namen des Autors des Beitrags und der Link des the_author .

WordPress entwickelt sich weiter. Jede neue Version enthält oft ein paar neue Vorlagen-Tags. So sehr, dass das Einhalten all dieser Vorlagen-Tags - alt oder neu - ziemlich herausfordernd sein kann. Sehen Sie sich diese 20 Template-Tags an, die Sie vielleicht übersehen haben.

Kapital P

WordPress muss gemäß ihrer Richtlinie und Norm mit der Großschrift geschrieben werden. WordPress ist ein Nein, nein; Der richtige Weg ist, es als WordPress zu buchstabieren.

Die Hauptstadt "P" ist ein Thema von so großer Bedeutung, dass Matt Mullenweg (Gründer von WordPress) es bereits 2009 in seinen Beschluss aufgenommen hat. Die Funktion capital_p_dangit() wird im Rahmen der Initiative eingeführt.

Seit : 3.0.0

 // Einfaches Verwenden von $ footer_text = get_theme_mod ("footer_text", ""); $ footer_text = captial_p_dangit ($ footer_text); // Jeder WordPress-Text wird mit Großbuchstaben P // gedreht. Oder mit einem WordPress-Filter. add_filter ("the_excerpt", Funktion ($ text) {return capital_p_dangit ($ text);}); 
Benutzerdefiniertes Logo

In 4.5 hat WordPress die Möglichkeit eingeführt, ein Logo für Themen über den Customizer hochzuladen. Diese neue Funktion erfordert Unterstützung für das add_theme_support( 'site-logo' ) : Durch Hinzufügen von add_theme_support( 'site-logo' ) wird das Logo im Customizer add_theme_support( 'site-logo' ) .

Diese Funktion führt zur Verwendung einiger neuer Vorlagen-Tags, die mit der Logo-Bildausgabe in Themes umgehen können, nämlich: has_custom_logo(), get_custom_logo() und the_custom_logo() .

Seit : 4.5.0

 // 1. Die Ausgabe enthält das Bildlogo und den Link zurück nach Hause. the_custom_logo (); // 2. Erhalte die benutzerdefinierte Logo-Ausgabe "string". $ logo = get_custom_logo (); // 3. Bedingt if (has_custom_logo ()) {$ logo = get_custom_logo (); } // 4. Das 'get_custom_logo' verwenden, um das Logo mit einem div zu umhüllen; add_filter ("get_custom_logo", Funktion ($ html) {return ''. $ html. '";}); 
Miniaturbild-URL

WordPress verfügt über ein seit langem integriertes, natives Dienstprogramm, um ein Thumbnail-Bild oder ein Featured-Bild hinzuzufügen. Das Vorlagen-Tag, the_post_thumbnail(), zeigt das Bild-Tag zusammen mit ihren Attributen.

Aber was, wenn Sie das Bildminiaturbild stattdessen als Hintergrund über CSS anzeigen möchten? Verwenden Sie das Vorlagen-Tag get_the_post_thumbnail_url() .

Seit : 4.4.0

Beispiel :

Zufallszahl generieren

Mit diesem Vorlagen-Tag erhalten Sie eine Zufallszahl basierend auf einem bestimmten Bereich. WordPress verwendet diese Funktion intern, um ein zufälliges Passwort zu generieren. Sie können es wahrscheinlich verwenden, um eine zufällige Gutscheinnummer für Ihre WooCommerce-Website zu generieren.

Seit : 2.6.2

Beispiel :

 // Generiere eine Zahl von 1 bis 200 $ rand_number = wp_rand (1, 200); // Ausgabe wird nicht unter 0 oder 201 oberhalb liegen. 
Kommentare Seitenumbruch

Die meisten Themes verwenden derzeit the_comments_navigation() was den Navigationslink "Next" und "Prev" ergibt. Wenn Sie eine nummerierte Navigation (Paginierung) the_comments_pagination() möchten, ersetzen the_comments_pagination() stattdessen das Tag durch the_comments_pagination() .

Beachten Sie, dass das Vorlagen-Tag nur in WordPress 4.4.0 verfügbar ist. Stellen Sie sicher, dass Sie vor dem Bereitstellen eine Überprüfung durchführen.

Seit : 4.4.0

Beispiel :

 'ol', 'short_ping' => wahr, 'avatar_size' => 42, )); ?> 
Kürzende URL

Dieses Vorlagen-Tag verkürzt die URL-Länge. Und solch eine sehr lange URL wird nicht in eine neue Zeile innerhalb des Body-Inhalts einbrechen. Es gibt 2 Optionen, die Sie verwenden können: overflow-wrap: break-word; hinzufügen overflow-wrap: break-word; in Ihrem CSS, oder schneiden Sie die Länge der URL mit dem URL- url_shorten() .

Seit : 1.2.0

Beispiel :

 $ link = get_the_permalink (); $ url_text = url_shorten ($ link); // zB www.hongkiat.com/blog/css ... echo ' '. $ url_text. ' '; 
Fügen Sie Inline-Skripte hinzu

Wir haben immer das wp_enqueue_script, um ein Skript und seine Abhängigkeiten zu registrieren. Das Laden eines internen Skripts war jedoch nicht ganz einfach, bis dieses Vorlagen-Tag, wp_add_inline_script eingeführt wurde.

Das Hinzufügen eines Inline-Skripts erfordert ein bekanntes Skript in der Warteschlange, an das es angehängt wird. Dieser Handler wird als erster Parameter des Skripts übergeben, der der Funktion wp_localize_script() ähnelt. Der zweite Parameter sollte den Inhalt des Skripts übergeben. Der dritte Parameter gibt an, ob der Inline-Ausdruck "vor" oder "nach" ausgegeben werden soll.

Seit : 4.5.0

Beispiel :

 Funktion enqueue_script () {wp_enqueue_script ('twentysixteen-script', get_template_directory_uri (). '/js/functions.js', array ('jquery'), '20160412', true); wp_add_inline_script ('twentysixteen-script', 'window.hkdc = {}', 'before'); } add_action ('wp_enqueue_scripts', 'enqueue_script'); // Ausgabe: // // 
Dropdown-Sprache

Das Vorlagen-Tag wp_dropdown_languages gibt eine HTML-Option aus, die eine Liste von Sprachen in Ihrer WordPress-Site wp_dropdown_languages . Sie werden dieses Vorlagen-Tag nützlich finden, wenn Sie Ihre Website lokalisieren müssen. Sie können damit Ihre Sprachoptionen auf dem Bildschirm " Benutzer-Editor" oder im Front-End Ihrer Website anzeigen, damit Benutzer ihre bevorzugte Sprache auswählen können.

Seit : 4.0.0

Beispiel :

 wp_dropdown_languages ​​(array ('id' => 'lang_options', 'name' => 'lang_options', 'sprachen' => get_available_languages ​​(), 'übersetzungen' => array ('id_ID', 'ja'), // Indonesien und Japan 'ausgewählt' => 'en_US', 'show_available_translations' => false, )); 
Hol dir die Avatar Image URL

Wie der Name schon sagt, get_avatar_url() dieses Template-Tag get_avatar_url() des Avatars des Benutzers ab. Sie können den Avatar beliebig darstellen und modellieren, anstatt ihn einfach über das HTML-Bild-Tag anzuzeigen.

Seit : 4.2.0

Beispiel :

 $ avatar = get_avatar_url ('[email protected]'); 
Holen Sie sich ein Thema

Diese Funktion ruft ein Objekt ab, das Informationen zum aktuell aktiven Theme enthält. Diese Information beinhaltet das Thema Slug, Name, Version, Text Domain, Autor, etc.

Im folgenden Codefragment verwenden wir es, um die Version abzurufen und sie als Skriptversion zu übergeben.

Seit : 3.4.0

Beispiel :

 $ theme = wp_get_theme (); define ('THEME_SLUG', $ theme-> Vorlage); // twentyixteen definieren ('THEME_NAME', $ theme-> get ('Name')); // Twenty Sixteen definieren ('THEME_VERSION', $ theme-> get ('Version')); //1.2 function load_scripts () {wp_enqueue_script ('script-ie', $ templateuri .'js / ie.js ', array ("jquery"), THEME_VERSION); wp_script_add_data ('script-ie', 'konditional', 'lt IE 9'); } add_action ('wp_enqueue_scripts', 'load_scripts'); 

Was Sie nicht über die Berechnung der prozentualen Margins in CSS wissen

Was Sie nicht über die Berechnung der prozentualen Margins in CSS wissen

Die meisten Webdesigner denken, dass sie CSS ziemlich gut kennen. Schließlich gibt es nicht viel - ein paar Selektortypen, ein paar Dutzend Eigenschaften und einige Kaskadenregeln, an die man sich kaum erinnern muss, da sie auf den gesunden Menschenverstand hinauslaufen. Aber wenn Sie sich auf das Wesentliche konzentrieren, gibt es viele obskure Details, die nur wenige Designer wirklich verstehen.

(Tech- und Design-Tipps)

Ein Blick in: CSS4 Document Rule

Ein Blick in: CSS4 Document Rule

Viele Websites haben viele Seiten, aber alle diese Seiten werden üblicherweise mit nur einem Stylesheet formatiert. Es empfiehlt sich, nur ein Stylesheet zu verwenden, um HTTP-Anforderungen zu minimieren, damit die Seiten in einem Browser schneller geladen werden können.Es wird jedoch eine Reihe von Stilregeln geben, die im Stylesheet enthalten sind und für einige Seiten nicht benötigt werden. Wä

(Tech- und Design-Tipps)