it-swarm.com.de

Konvertieren von HTML-Vorlagen in Wordpress-Designs

Beim Versuch, eine statische HTML-Seite in ein Wordpress-Design zu konvertieren, trat ein Problem auf. Die Seite wird nicht ordnungsgemäß ausgeführt Nach der Überprüfung der Google Chrome-Konsole wird festgestellt, dass die CSS-Datei mit dem falschen Pfad geladen wird

es lädt Website/css/styles.css und Website/css/style-desktop.css

so habe ich Stylesheets aus header.php importiert

<link rel="stylesheet" href="<?php bloginfo( 'template_directory' ); ?>/css/skel.css" />
<link rel="stylesheet" href="<?php bloginfo( 'template_directory' ); ?>/css/style.css" />
<link rel="stylesheet" href="<?php bloginfo( 'template_directory' ); ?>/css/style-desktop.css" />
<link rel="stylesheet" href="<?php bloginfo( 'template_directory' ); ?>/css/style-noscript.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="<?php bloginfo( 'template_directory' ); ?>/css/ie/v8.css" /><![endif]-->
<!--[if lte IE 8]><script src="<?php bloginfo( 'template_directory' ); ?>/css/ie/html5shiv.js"></script><![endif]-->
<script src="<?php bloginfo( 'template_directory' ); ?>/js/jquery.min.js"></script>
<script src="<?php bloginfo( 'template_directory' ); ?>/js/skel.min.js"></script>
<script src="<?php bloginfo( 'template_directory' ); ?>/js/init.js"></script>

Das Stylesheet sollte unter website.com/wp-content/theme/themename/css/styles.css abgerufen werden

Ich bin mir nicht sicher, ob ich irgendetwas in function.php schreiben soll

UPDATE1:

Es stellte sich heraus, dass eine der JS-Dateien die CSS-Datei direkt lädt, sodass ich den Pfad der CSS-Dateien ändern musste

Es sieht mit CSS in Ordnung aus, aber es gibt einige Konflikte im Thema.

1
Kalmuraee

Wie gesagt, du solltest deine Stylesheets so in deine functions.php in deinem Theme einreihen:

function adds_to_the_head() { // Our own unique function called adds_to_the_head

wp_register_style( 'custom-style-css', get_stylesheet_directory_uri() . '/css/styles.css','','', 'screen' ); // Register style.css

wp_enqueue_style( 'custom-style-css' ); // Enqueue our stylesheet

}
add_action( 'wp_enqueue_scripts', 'adds_to_the_head' );
1
user3325126

Versuchen Sie es so

<script src="<?php echo get_template_directory_uri(); ?>/js/jquery.min.js"></script>

Es ist jedoch ratsam, Ihr Skript in function.php einzuordnen. Funktionsreferenz/wp enqueue script

0
shuvroMithun

Sie können diesen Weg nutzen. Und es ist auch Standard

/**
 * Enqueue scripts and styles.
 */
function test_name_scripts() {
    wp_enqueue_style( 'test-name-style', get_stylesheet_uri() );

    wp_enqueue_script( 'test-name-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20151215', true );

    wp_enqueue_script( 'test-name-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );

    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
        wp_enqueue_script( 'comment-reply' );
    }
}
add_action( 'wp_enqueue_scripts', 'test_name_scripts' );

Folgen Sie auch diesem Tutorial: https://developer.wordpress.org/themes/basics/including-css-javascript/

0
Abdus Salam