Wie füge ich eine benutzerdefinierte CSS-Datei zum Thema hinzu?

Normalerweisefügeich diesen Code hinzu,wennicheine weitere CSS-Datei hinzufügenmöchte

 <link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/my_custom_css.css" type="text/css" media="screen" />
 

Ichglaube,die Themenherstellermöchten so viel wiemöglich vom Layoutdesign des Themasbeibehalten.Einebenutzerdefinierte CSS-Dateitut alsonicht viel weh.Ich denke,esistehereine Unterstützungsfrage.Miteinerbenutzerdefinierten CSS-Datei können die Hersteller denjenigen,dieihre Themen verwenden,leichter helfen.Da die ursprüngliche style.css unverändertbleibt,kann der Theme Maker wahrscheinlicheinen Blickin diebenutzerdefinierte CSS-Datei werfen.

I usually add this piece of code if I want to add another css file

<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/my_custom_css.css" type="text/css" media="screen" />

I believe the theme makers want to retain as much as possible of the theme's layout design. So a custom css file doesn't hurt much. I think it's more of a support question. With custom css file, the makers can help those who use their themes more easier. Because the original style.css is unaltered, so the theme maker can probably take a look in the custom css file.

Die Verwendung von @importin WordPress zum Hinzufügen vonbenutzerdefiniertem CSSistnichtmehr diebeste Vorgehensweise,Sie können diesjedochmit dieser Methodetun.

Diebeste Vorgehensweiseist die Verwendung der Funktion wp_enqueue_style()in functions.php.

Beispiel :

 wp_enqueue_style ('theme-style', get_template_directory_uri().'/css/style.css');
wp_enqueue_style ('my-style', get_template_directory_uri().'/css/mystyle.css', array('theme-style'));
 

Using @import in WordPress for adding custom css is no longer the best practice, yet you can do it with that method.

the best practice is using the function wp_enqueue_style() in functions.php.

Example:

wp_enqueue_style ('theme-style', get_template_directory_uri().'/css/style.css');
wp_enqueue_style ('my-style', get_template_directory_uri().'/css/mystyle.css', array('theme-style'));

Aktivieren Sie das untergeordnete Thema undfügen Sie denfolgenden Beispielcodein diefunction.php

 add_action( 'wp_enqueue_scripts', 'child_enqueue_styles');

function child_enqueue_styles() {

wp_enqueue_style( 'reset-style', get_template_directory_uri() . '/css/reset.css', array());
}
 

Activate the child theme and add the following example code in the function.php

add_action( 'wp_enqueue_scripts', 'child_enqueue_styles');

function child_enqueue_styles() {

wp_enqueue_style( 'reset-style', get_template_directory_uri() . '/css/reset.css', array());
}

Mein Vorschlag wäre,untergeordnete Themen zu verwenden. Esist sehreinfach zuimplementieren und alle von Ihnen vorgenommenen Änderungen (einschließlich der Stile) sind vollständig vom ursprünglichen Themaisoliert.

My proposal would be to use child themes. It is very easy to implement and all modifications you do (including styles) are completely isolated from the original theme.

Wenn Sie Ihr HTMLbehaltenmöchten. Sie können dies zu Ihrer CSS-Datei hinzufügen.Ich denke dasistbesser.

 @import url("../mycustomstyle.css");
 

Abhängig von Ihrem Themafunktioniertes auchmit untergeordneten und übergeordneten Themen.

- Beachten Sie,dass CSS sequentiell arbeitet (wenn Sie dieselbebereits verwendete Kennungsebene verwenden),sodass das,was zuletztin Ihrer Dateienthaltenist,überschrieben wird. Setzen Sie also Ihren Customstyle-Importganz unten,wenn Sieetwas überschreibenmöchten.

If you want to leave your html along. you can add this to your css file. I think this is better.

@import url("../mycustomstyle.css");

also depending on your theme it will work with child and parent themes.

-- keep in mind, css works sequential (when using the same level of identifier, already used ) , so what is last in your file will overwrite. so put your customstyle import at the bottom if you want to override stuff.

Umein Überschreiben von CSS oder anderen Dateien des Hauptthemas zu verhindern,sollten Sie IMMERein untergeordnetes Themain WordPress verwenden. Wenn Sie diesnichttun,werden Sie späternurnochgroße Kopfschmerzen und Probleme haben.

https://codex.wordpress.org/Child_Themes

... und daes soeinfachist,ein untergeordnetes Themaeinzurichten,gibt es keinen Grund,warum Sie keines verwenden sollten.

Wenn Sieein untergeordnetes Thema verwenden,können Sie allegewünschten übergeordneten Hauptdesigndateien überschreiben,indem Sieeinfach vom übergeordnetenin das untergeordnete Thema kopieren odereine neue Dateimit demselben Namenerstellen.

In Bezug auf die Datei custom.cssgibt es zahlreiche Möglichkeiten,wie Theme-Entwickler damit umgehen. Viele vonihnentun dieseinfach,um Clients zu verhindern,die kein untergeordnetes Theme verwendenmöchten. von der Bearbeitung der Hauptdatei style.css ....

So oder so sollten Sie sich darüber keine Sorgenmachen,solange Sieein untergeordnetes Thema verwenden,sollten Sie sichnicht darum kümmernmüssen,Ihr Thema später zu aktualisieren und Ihre Änderungen zu verlieren. Gewöhnen Sie sich an,immer untergeordnetes Thema zu verwenden Themen,Sie werdenmir später danken,ich verspreche.

To prevent overwritting of main theme CSS or other files, you should ALWAYS use a child theme in WordPress ... not doing so will only cause you major headaches and problems down the road.

https://codex.wordpress.org/Child_Themes

... and with how easy it is to setup a child theme, there is no reason you shouldn't be using one.

Using a child theme will then allow you to override any of the main parent theme files you want, simply by copying from parent into your child, or by creating a new file with the same name.

Regarding the custom.css file there's numerous ways that theme developers handle this ... a lot of them do this simply to try and prevent clients who don't want to use a child theme, from editing the main style.css file ....

Either way you shouldn't be worried about that, as long as you use a child theme you shouldn't have to worry about updating your theme later on and losing your changes ... get in the habit of always using child themes, you will thank me later, i promise.

Derbeste Wegist, allein die Warteschlangegestellten Stile zueinereinzigen Funktion zu kombinieren und sie dann mit der Aktion wp_enqueue_scripts aufzurufen. Fügen Sie die definierte Funktion der Dateifunctions.php Ihres Themasirgendwo unterhalb der Ersteinrichtung hinzu.

Codeblock:

 function add_theme_scripts() {
    wp_enqueue_style( 'style', get_template_directory_uri() . '/css/style.css' );
    wp_enqueue_style ( 'custom', get_template_directory_uri () . '/css/custom.css', array( 'style' ) );
}
add_action ( 'wp_enqueue_scripts', 'add_theme_scripts' );
 

Bittebeachten Sie:

Der dritte Parameterist das Abhängigkeitsarray,das angibt,ob dieses Stylesheet voneinem anderen Stylesheet abhängigist odernicht. In unserem obigen Codeist custom.css also von style.css

|
Zusätzliches Basic:
Die Funktion wp_enqueue_style() kann 5 Parameter haben: so - wp_enqueue_style ( $ handle,$ src,$ deps,$ ver,$media );
In der realen Welt der WP-Codierungfügen wirnormalerweise auch Javascript-Dateien/jQuery-Bibliotheken hinzu,die wiefolgtfunktionieren:

 wp_enqueue_script( 'script', get_template_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true);
 

Der 5. Parametertrue/falseist optional (2.,3. und 4. Parameter sindebenfalls opt.),aber sehr wichtig. Erermöglichtes uns,unsere Skriptein der Fußzeile zuplatzieren,wenn wir denbooleschen Parameter alstrue verwenden.

The best way is to combine all enqueued styles into a single function and then call them using wp_enqueue_scripts action. Add the defined function to your theme's functions.php somewhere below the initial setup.

Code Block:

function add_theme_scripts() {
    wp_enqueue_style( 'style', get_template_directory_uri() . '/css/style.css' );
    wp_enqueue_style ( 'custom', get_template_directory_uri () . '/css/custom.css', array( 'style' ) );
}
add_action ( 'wp_enqueue_scripts', 'add_theme_scripts' );

Please Note :

3rd parameter is the dependency array which refers to whether or not this stylesheet is dependent on another stylesheet. So, in our above code custom.css is dependent on style.css

|
Additional Basic:
wp_enqueue_style() function may have 5 parameters: like this way - wp_enqueue_style( $handle, $src, $deps, $ver, $media );
In real world of WP Coding, usually we also add javascript files/jQuery libraries inside that function like this way:

wp_enqueue_script( 'script', get_template_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true);

The 5th parameter true/false is optional (2nd, 3rd and 4th params are also opt.) but very essential, it allows us to place our scripts in footer when we use the boolean parameter as true.

Gehen Sie zu Darstellung> Bearbeiten Sie CSSin Ihrem WordPress-Dashboard.

Hierist der Bildschirmmit demgrundlegenden CSS-Editor.

Fügen Sienun Ihr CSS direktin den Standardtextein.Sie können den Standardtext löschen,sodass Ihr CSSnurim Editor angezeigt wird.Speichern Sie dann das Stylesheet und Ihr CSS wird live sein.

Go to Appearance > Edit CSS from your WordPress Dashboard.

Here is the screen with basic CSS editor.

Now paste your CSS directly to the default text. You can delete the default text so that your CSS only appears in the editor. Then save the stylesheet and your CSS will be live.

Wenn Sie Problememit dem Webbrowser-Cache vermeidenmöchten,müssen Sie die Dateiversion angeben,wiein diesem Beispielgezeigt.

 wp_enqueue_style ('theme-style', get_template_directory_uri().'/path/to/css/style.css?v=' . filemtime(get_template_directory() . '/path/to/css/style.css'));
 

In diesem Fall schreibeich das letzte Änderungsdatumin Unix-Zeit als Abfrageparameter.

If you want to avoid web browser cache problems, you need include the file version, like in this example is shown.

wp_enqueue_style ('theme-style', get_template_directory_uri().'/path/to/css/style.css?v=' . filemtime(get_template_directory() . '/path/to/css/style.css'));

In this case, I write the last modification date in unix time as a query param.

Verwenden Sieein untergeordnetes Thema.Esist Ihrebeste Wahl.Auf diese Weise überschreiben Sie die von Ihnenerstellten Stylesheetsnicht,wenn das Themajemals aktualisiert wird.

https://codex.wordpress.org/Child_Themes

Gehen Sie diesen Weg,Sie werden sich späterbedanken.

Use a child theme. It's your best bet. This way if the theme is ever updated, you won't override the stylesheets you've created.

https://codex.wordpress.org/Child_Themes

Go this route, you'll thank yourself later.