2016-04-20 6 views
3

ich gelernt habe, wie wp_style_add_data zu verwenden Stylesheets für die frühen Versionen von Internet Explorer hinzuzufügen - die, wie es die notwendigen CSS-Regeln nur ideal ist überschreibt und nimmt den Rest von meinem style.css.Wie reiht man Stylesheets korrekt in Wordpress-Seitenvorlagen ein, indem man 'wp_style_add_data' verwendet?

Zusätzlich zu meiner page.php habe ich eine zweite Seite Vorlage, die ich full-page.php genannt habe, die fast identisch ist, abgesehen von ein paar Änderungen an der Kopfzeile und ein paar andere kleine Unterschiede.

Da meine Vorlagen fast die gleichen sind, scheint es Overkill zu sein, zwei lange Stylesheets zu schreiben, wenn ich etwas Ähnliches wie die wp_style_add_data Funktion tun konnte, um nur diejenigen zu schreiben, die ich ändern muss.

hatte ich gehen am wp_style_add_data mit dem Stylesheet für meine Seitenvorlage einzureihen. Dies funktioniert tatsächlich und nimmt alle Stile, die ich hinzufügen, sofern sie nicht bereits andere in full-page.css sind. Hier

ist der Code, den ich verwenden:

if (is_page_template('page-templates/full-page.php')) 

    { wp_enqueue_style('theme_style', get_stylesheet_uri()); 
     wp_enqueue_style('theme-full-page', get_stylesheet_directory_uri() . '/css/full-page.css', array('theme_style')); 
     wp_style_add_data('theme-full-page'); 

} 

else { wp_enqueue_style('theme_style', get_stylesheet_uri()); 

wp_enqueue_style('theme_style_ie8', get_stylesheet_directory_uri() . '/css/ie8.css', array('theme_style')); 
wp_style_add_data('theme_style_ie8', 'conditional', 'IE 8'); 

Allerdings ist es auch mit der folgenden Fehlermeldung kommen.

Warning 
: Missing argument 3 for wp_style_add_data(), called in /var/sites/l/lucieaverillphotography.co.uk/public_html/wp-content/themes/lucieaverillphotography/functions.php on line 31 and defined in 
/var/sites/l/lucieaverillphotography.co.uk/public_html/wp-includes/functions.wp-styles.php 
on line 
223 

Ich denke, das liegt daran, dass ich das Teil entfernt haben, dass es nur erzählt wirksam werden, wenn der Benutzer die Anzeige der Webseite auf IE 8 ist, aber ich habe recherchiert, was ich stattdessen könnte hinzufügen, und haven Ich konnte keine Antwort finden.

Jede Hilfe würde sehr geschätzt werden.

UPDATE: ------------------------------------------ --------------------------------

ich glaube, ich habe es geschafft, diese heraus zu arbeiten, wie es scheint jetzt zu arbeiten - alle Änderungen, die ich in style.css mache, beeinflussen das andere Stylesheet full-page.css, außer ich spezifiziere etwas anderes in full-page.css.

auf dem Code der Suche, würde dies der richtige/beste Weg, dies zu schreiben? Es scheint ein wenig lang und ich muss die Stylesheet-Namen oft wiederholen, aber es scheint auch zu funktionieren. Ich weiß, dass es oft verschiedene Wege gibt, Dinge mit PHP zu tun, und ich bin vorsichtig, wenn ich später Probleme habe, wenn ich mein Thema erstelle.

if (is_page_template ('page-templates/Voll page.php'))

{ wp_enqueue_style('theme_style', get_stylesheet_uri()); 

    wp_enqueue_style('theme-full-page', get_stylesheet_directory_uri() . '/css/full-page.css', array('theme_style')); 
    wp_style_add_data('theme-full-page', 'title', 'theme-full-page'); 
} 
+0

Lesen Sie [Referenz] (https://developer.wordpress.org/reference/functions/wp_style_add_data/#source-code) erneut. 'wp_style_add_data()' benötigt drei Argumente. – MinhTri

+0

Danke Dan, ich glaube ich habe es nach dem Lesen gelöst. Ich habe meinen Code oben hinzugefügt. – Jack1991

Antwort

1

Sie haben bereits den Stil Warteschlange eingereiht, wp_style_add_data() nicht einreihen, fügt er Meta-Daten zu einer bereits eingereiht Stil und diese Funktion erlaubt keine leeren Parameter. siehe unten.

if (is_page_template('page-templates/full-page.php')) { 
     wp_enqueue_style('lucieaverillphotography_style', get_stylesheet_uri()); 
     wp_enqueue_style('lucieaverillphotography-full-page', get_stylesheet_directory_uri() . '/css/full-page.css', array('lucieaverillphotography_style')); 
     //wp_style_add_data('lucieaverillphotography-full-page'); --> not needed & cannot be used without required inputs 

} 

Aber ..... Sie alle Ihre CSS in einer einzigen Datei und rufen Sie diese als Standard auf allen Seiten (Aufruf ie8 spezifische Stylesheets, wenn Sie wollen ....), auf diese Weise kann es sein, kombinieren könnte browser cached und nach dem ersten besuch lädt sich die css schneller ... Verbessere CSS-Spezifität und ids/klassen, das erspart dir auf lange Sicht viel Arbeit!

Wenn Sie bestimmte Änderungen an CSS Template wollen, müssen Sie ein paar Optionen

  1. wenn die CSS-Änderungen im Artikel/Seite sind, wird es in der Regel ein id/Klasse nur auf dieser Seite festgelegt sein (oder füge eins hinzu).

  2. Fügen Sie benutzerdefinierte CSS direkt auf die Vorlage (es irgendwo auf der Seite arbeitet, wird nicht mit Standards populär sein, aber für den Moment können Sie CSS-Regeln überall innerhalb Style-Tags

  3. stellen eine benutzerdefinierte Klasse in die Header hinzufügen für den Body-Tag, zB >

Sie können dann gezielt CSS in Ihrer Vorlage Ziel ... zB

.page-id-2 header{ display: none;} //-->use chrome inspector to see what classes are outputted on each template 
+0

Hallo David, ich bin mir nicht sicher, ob ich dem folge - wenn ich all mein CSS in ein Stylesheet schreiben würde, wie könnte ich Dinge in meinen anderen Seitenvorlagen ändern? Zum Beispiel habe ich in meiner 'full-page.php' Vorlage eine transparente Kopfzeile, die erfordert, dass ich die Kopfzeile in' position: absolute' ändere, während sie in der Hauptvorlage auf 'position: relative' gesetzt ist. Wie kann ich dies auf einem einzelnen Stylesheet tun? Ich könnte später noch weitere Seitenvorlagen hinzufügen. – Jack1991

+0

Ich aktualisierte weitere Informationen, aber wie gesagt, lesen Sie auf CSS-Spezifität, Sie werden es leicht genug verstehen. – David

+0

kümmern, um das DV zu erklären? – David

Verwandte Themen