Używanie wp_add_inline_style bez arkusza stylów


18

Muszę dodać niestandardowe style wstawiane do nagłówka niestandardowego motywu, który tworzę. Natknąłem się na wp_add_inline_style()funkcję, która działa, ale tak naprawdę mi nie pasuje, ponieważ zależy od konkretnego arkusza stylów. Musiałbym dodać style wbudowane na końcu znacznika head bez zależności arkusza stylów.

Próbowałem ustawić arkusz stylów motywu lub nieistniejący. W obu przypadkach działa, ale to trochę brudne włamanie IMO (albo załaduj arkusz stylów motywu dwa razy, albo odwołaj się do pliku widma ...). Czy istnieje właściwy sposób dodawania stylów wbudowanych w głowie bez uzależnienia od arkusza stylów?

Oczywiście mogę dodać je bezpośrednio do pliku header.php, ale chciałbym tego uniknąć.

Odpowiedzi:


24

Wystarczy dodać style bezpośrednio do nagłówka strony. Najlepszym sposobem na to jest użycie haka czynności „wp_head”, przy założeniu, że używasz motywu z hakiem. Tak jak:

add_action('wp_head', 'my_custom_styles', 100);

function my_custom_styles()
{
 echo "<style>*{color: red}</style>";
}

Sprawdź kodeks WP, aby dowiedzieć się więcej o hakach akcji.


Nie ma problemu! Cieszę się, że mogłem pomóc.
SkyShab

Jeśli (podobnie jak ja) chcesz dodać niestandardowy wbudowany CSS do stron panelu kontrolnego, możesz użyć admin_headakcji.
Ten Brazylijczyk

16

Możesz po prostu użyć „manekina”:

wp_register_style( 'dummy-handle', false );
wp_enqueue_style( 'dummy-handle' );

wp_add_inline_style( 'dummy-handle', '* { color: red; }' );

Naprawdę podoba mi się to rozwiązanie, ponieważ mój styl ma uchwyt i jest kolejkowany tak, jakby był zawarty w pliku .css.
dev_masta

Używanie false jako źródła wp_register_style również jest niedozwolone zgodnie z dokumentacją codex.wordpress.org/Function_Reference/…
stron

3

Twój motyw z pewnością ma domyślny arkusz stylów (inaczej nie zostałby nawet załadowany jako motyw). Wystarczy użyć tego arkusza stylów jako modułu obsługi wbudowanego CSS. Przykład można znaleźć w functions.php tematu TwentyFifteen (kod pominięty ze względu na zwięzłość):

function twentyfifteen_scripts() {
    wp_enqueue_style( 'twentyfifteen-style', get_stylesheet_uri() );

}
function twentyfifteen_post_nav_background() {
    wp_add_inline_style( 'twentyfifteen-style', $css );
}

1
OP konkretnie poprosił o metodę inną niż użycie wp_add_inline_style (). Obie metody działają, a ja nie znalazłem żadnego ważnego powodu, aby przejść do wp_add_inline_style (). Jeśli znasz powód, chciałbym o tym wiedzieć.
SkyShab

Twoje rozwiązanie działa, ale nadal jest „hacking” według czegoś, co usłyszałem od kogoś z zespołu WP (jeśli się nie mylę); nie do końca moja opinia . Myślę, że OP myślał, że nie da się tego zrobić bez dwukrotnego załadowania arkusza stylów lub użycia haka-widma. W każdym razie, jeśli nie są autorami wtyczki, zawsze istnieje arkusz stylów motywu. Ja również edytuję swoją odpowiedź, ponieważ twoje rozwiązanie jest udokumentowane w Kodeksie. :)
Casper

Grałem z wp_add_inline_style () i to właśnie znalazłem. Zaletą dołączania stylów do arkusza stylów jest to, że jeśli zostanie odznaczone, style nie zostaną wydrukowane. Ale jedna z metod drukuje je w linii w głowie. Powiedzmy, że jesteś programistą wtyczek, a Twoje style są drukowane w głowie. Nie ma to nic wspólnego ze stylami motywów, więc jeśli motyw podrzędny usunął zaznaczenie z głównego stylu motywu, aby użyć własnego, teraz style wtyczek nie są generowane. Z tego powodu PO mógł określić tę część żądania.
SkyShab
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.