css und script in functions.php einbinden

  • Gelöst 4rno

    (@4rno)


    vor 7 Jahren, 7 Monaten

    Hallo,

    Ich versuche seid 2 Tage mein css und js in der Function.php einzubinden.
    Mein css funktioniert mit diesem Code im header.php wunderbar:

    <link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri()?>/css/style.css" type="text/css" media="screen" title="alternate" />

    Doch habe ich gelesen es sei nicht die saubere Variante und nun versuche ich das Ganze in der functions.php einzubinden.
    Im header steht mein wp_head richtig
    Ich habe alle mögliche Blogs duchgelesen und komme einfach nicht weiter. Kann mir Jedamn sagen, ob mein Code richtig ist bzw. wie ich vorgehen soll?
    Ich arbeite in einer lokalen Umgebung, habe mein eigenes Templates und habe nicht viel Ahnung von PHP. 

    <?php

function mein_css() {

wp_enqueue_style( 'style', get_template_directory_uri() .'css/style.css', false );

wp_enqueue_style( 'bootstrap', get_template_directory_uri() .'css/bootstrap.min.css', false );

wp_enqueue_style( 'unslider', get_template_directory_uri() .'css/unslider.css', false );
	
}

function mein_scripts() {	
wp_enqueue_script( 'bootstrap-script', get_stylesheet_directory_uri().'js/bootstrap.min.js', false );

}
add_action( 'wp_enqueue_scripts', 'mein_css');
add_action( 'wp_enqueue_scripts', 'mein_scripts');

?>
Ansicht von 9 Antworten – 1 bis 9 (von insgesamt 9)
  • Moderator Torsten Landsiedel

    (@zodiac1978)

    vor 7 Jahren, 7 Monaten

    Fehlt da vielleicht nur ein Slash nach get_template_directory_uri?

    Gruß, Torsten

    Thread-Starter 4rno

    (@4rno)

    vor 7 Jahren, 7 Monaten

    Vielen Dank für die schnelle Antwort.

    Ich habe aber schon mit und ohne Slash versucht. Ohne Erfolg.

    Moderator Torsten Landsiedel

    (@zodiac1978)

    vor 7 Jahren, 7 Monaten

    wp_enqueue_style( 'style', get_template_directory_uri() .'css/style.css', false );

    Der dritte Parameter ist das Dependenz-Array und nimmt kein bool’schen Parameter:

    Home

    Für den vierten Parameter kannst du einen true/false-Wert setzen, um die angehängte Versionsnummer auf die WP-Version umzustellen, was aber keine gute Idee ist. Für ein Cache-Busting sollte die Version immer gesetzt (und entsprechend bei Änderung hochgesetzt) werden.

    Das false könntest du sonst auch weglassen, da es ja der Standardwert ist.

    Gruß, Torsten

    Thread-Starter 4rno

    (@4rno)

    vor 7 Jahren, 7 Monaten

    Ich habe mit einem anderen Code versucht. Leider immer noch ohne Erfolg. Meine Dateien liegen auch im richtigen Ordner.
    Mittlerweile glaube ich nicht, dass es an den Code liegt. Ich vermute einen Parameter muss vielleicht in einer andere php-Datei definiert werden. Stimmt das?
    Nochmal Danke für deine Hilfe.

    function mein_css() {
//wp_enqueue_script('jquery');

wp_register_script('bootstrap', get_template_directory_uri() .  '/js/bootstrap.js', array('jquery'), '', false );
wp_register_script('flex', get_template_directory_uri() .  '/js/jquery.flexslider-min.js', array('jquery'), '', false );

wp_register_style('style', get_template_directory_uri() .  '/css/style.css', '', '', 'screen' );
wp_register_style('flex', get_template_directory_uri() .  '/css/flexslider.css', '', '', 'screen' );
wp_register_style('bootstrap', get_template_directory_uri() .  '/css/bootstrap.css', '', '', 'screen' );

wp_enqueue_script( 'bootstrap' );
wp_enqueue_script( 'flex' );

wp_enqueue_style( 'style' );
wp_enqueue_style( 'flex' );
wp_enqueue_style( 'bootstrap' );
}
add_action( 'wp_enqueue_scripts', 'mein_css');

?>
    • Diese Antwort wurde geändert vor 7 Jahren, 7 Monaten von 4rno.
    Moderator Torsten Landsiedel

    (@zodiac1978)

    vor 7 Jahren, 7 Monaten

    Die Dependenz muss immer ein Array sein. Und die Versionsnummer sollte gesetzt sein. Die Media-Angabe würde ich beim Standardwert „all“ lassen, also nicht setzen.

    Daher nicht so:
    wp_register_style('style', get_template_directory_uri() . '/css/style.css', '', '', 'screen' );

    sondern so:
    wp_register_style('style', get_template_directory_uri() . '/css/style.css', array(), '1.0.0' );

    Bei den Skripten sollte die Versionsnummer entsprechend der Skripte gesetzt werden.

    Ansonsten sieht das korrekt aus. Wenn du schreibst, dass es nicht funktioniert: Kommt gar nichts im Frontend an oder etwas Falsches?

    Gruß, Torsten

    Thread-Starter 4rno

    (@4rno)

    vor 7 Jahren, 7 Monaten

    Es kam nichts im Frontend. Es erschient nur mein html-Code und die Bilder, die über den WordPress-Editor hochgeladen hatte.

    Ich kann es nicht erklären aber in der Seitenquelltext wurde immer das css von einem anderen Theme aufgerufen.
    In der function.php habe ich also switch_theme(‚Name_von_mein_theme‘); ganz am Anfang der function geschrieben. und jetzt klappt es!!

    Du hast recht. Die Versionsnummer bei den Skripten muss angegeben werden und wp_enqueue_script(‚jquery‘); sollte außerdem nicht auskommentiert werden, wenn das array leer ist. Ansonsten array(‚query‘) verwenden.

    Vielen Dank für deine Hilfe! 🙂

    Thread-Starter 4rno

    (@4rno)

    vor 7 Jahren, 7 Monaten

    Ich muss hier leider etwas nachtragen.

    Das Einbinden hat wunderbar funktioniert. Nun kann ich mich nicht mehr in Backend einloggen. Ich bekomme eine komplette weiße Seite, wenn ich http://localhost:8888/wordpress/wp-admin/ eingebe.

    Ich suche im Forum nach und melde mich zurück, wenn ich was finde.

    Moderator Torsten Landsiedel

    (@zodiac1978)

    vor 7 Jahren, 7 Monaten

    In der function.php habe ich also switch_theme(‚Name_von_mein_theme‘); ganz am Anfang der function geschrieben.

    Das sollte nicht notwendig sein. Hast du denn das richtige Theme aktiviert?

    Die Versionsnummer bei den Skripten muss angegeben werden und wp_enqueue_script('jquery'); sollte außerdem nicht auskommentiert werden, wenn das array leer ist. Ansonsten array('query') verwenden.

    Versionsnummer *muss* nicht angeben werden, aber *sollte*. Damit ein Ändern der Versionssnummer dafür sorgt, dass der Cache inavlidiert wird und somit die neue Version der Datei geladen wird (Stichwort: Cache-Busting)

    Die Abhängigkeit von jquery anzugeben sorgt dafür, dass es *vorher* geladen wird. Genau dafür ist dieser Parameter da. 😉

    Um den Fehler zu sehen, den die weiße Seite eigentlich anzuzeigen würde, aktiviere mal den DEBUG-Modus.
    https://marketpress.de/2014/wp-debug-log-fehlermeldungen-in-wordpress-ausgeben/

    Gruß, Torsten

    Thread-Starter 4rno

    (@4rno)

    vor 7 Jahren, 7 Monaten

    Ich habe endlich den Fehler gefunden.

    Ich hatte in meiner function.php mehrere php-tag drin.
    Dies führte zu dem „white screen“.

    Tja das kommt vor, wenn man von php so gut wie keine Ahnung hat 🙂

    Das Problem hat sich endlich gelöst. Vielen Vielen Dank Torsten.

Ansicht von 9 Antworten – 1 bis 9 (von insgesamt 9)
  • Das Thema „css und script in functions.php einbinden“ ist für neue Antworten geschlossen.