Temaya özel css dosyası nasıl eklenir?

Bazı temalar, style.css dosyasını düzenlememenizi ister, bunun yerine custom.css dosyasını kullanır. Custom.css dosyasına kod yazarsanız, style.css dosyasında aynı öğe stilinin üzerine yazılır. Bu tema güncelleme kullanıcı stilleri kaybını önlemek için yapıldığını düşünüyorum, öyle mi?

Bu nasıl çalışır? Temalarına zaten custom.css dosyası ekliyorlar mı? Ancak bu dosya temaya nasıl dahil edilir, böylece tema önce custom.css'de stil arar mı? Teşekkürler.

Başka bir css dosyası eklemek istersem genellikle bu kod parçasını eklerim

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

Tema yapıcıların, temanın düzen tasarımını mümkün olduğunca korumak istediklerine inanıyorum. Bu nedenle özel bir css dosyası çok acı vermez. Bence bu daha çok bir destek sorusu. Özel css dosyası ile, yapımcılar temalarını kullananlara daha kolay yardımcı olabilir. Orijinal style.css değiştirilmediğinden, tema oluşturucu muhtemelen özel css dosyasına bir göz atabilir.

Özel css eklemek için WordPress'te @import kullanmak artık en iyi uygulama değildir, ancak bu yöntemle yapabilirsiniz.

en iyi uygulama işlevi function.php dosyasında kullanmaktır wp_enqueue_style().

Örnek :

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'));

Alt temayı etkinleştirin ve function.php dosyasına aşağıdaki örnek kodu ekleyin

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());
}

Benim önerim alt temaları kullanmak olacaktır. Uygulanması çok kolaydır ve yaptığınız tüm değişiklikler (stiller dahil) orijinal temadan tamamen izole edilmiştir.

Ana temanın CSS'sinin veya diğer dosyaların üzerine yazılmasını önlemek için, WordPress'de DAİMA bir alt tema kullanmalısınız ... bunu yapmazsanız, yalnızca yolda büyük baş ağrılarına ve sorunlara neden olursunuz.

https://codex.wordpress.org/Child_Themes

... ve bir çocuk teması oluşturmanın ne kadar kolay olduğu ile, bir tema kullanmamanız için hiçbir neden yok.

Daha sonra bir alt tema kullanmak, yalnızca ana öğeden çocuğunuza kopyalayarak veya aynı ada sahip yeni bir dosya oluşturarak istediğiniz ana ana tema dosyalarından herhangi birini geçersiz kılmanıza olanak tanır.

custom.cssDosyayla ilgili olarak, tema geliştiricilerinin bunu ele almasının birçok yolu vardır ... birçoğu bunu basitçe bir alt tema kullanmak istemeyen istemcilerin ana style.cssdosyayı düzenlemesini önlemek için denemek ....

Her iki şekilde de bu konuda endişelenmemelisiniz, bir çocuk teması kullandığınız sürece, temanızı daha sonra güncellemek ve değişikliklerinizi kaybetmek konusunda endişelenmenize gerek yoktur ... bana daha sonra teşekkür edeceğim, söz veriyorum.

Html'nizi birlikte bırakmak istiyorsanız. bunu css dosyanıza ekleyebilirsiniz. Bence bu daha iyi.

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

ayrıca temanıza bağlı olarak çocuk ve ebeveyn temalarıyla da çalışacaktır.

- unutmayın, css sıralı çalışır (zaten kullanılan aynı tanımlayıcı düzeyini kullanırken), bu nedenle dosyanızdaki son şeyin üzerine yazılır. bir şeyleri geçersiz kılmak istiyorsanız özel stil içe aktarma işleminizi en alta koyun.

En iyi yol, sıyrılan tüm stilleri tek bir işlevde birleştirmek ve daha sonra eylem kullanarak çağırmaktırwp_enqueue_scripts . Tanımlı işlevi temanızın işlevlerine ekleyin. Php ilk kurulumun altında bir yere.

Kod Bloğu:

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' );

Lütfen aklınızda bulundurun :

3. parametre, bu stil sayfasının başka bir stil sayfasına bağlı olup olmadığını gösteren bağımlılık dizisidir. Yani, yukarıdaki kodumuzda custom.css, style.css dosyasına bağımlı

|
Ek Temel:
wp_enqueue_style() işlev 5 parametreye sahip olabilir: bu şekilde - wp_enqueue_style ( $ handle, $ src, $ deps, $ ver, $ media );
WP Kodlamanın gerçek dünyasında, genellikle bu şekilde bu işlevin içine javascript dosyaları / jQuery kitaplıkları ekliyoruz:

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

True / false parametresi isteğe bağlıdır (2., 3. ve 4. parametreler de isteğe bağlıdır), ancak çok önemlidir, boole parametresini true olarak kullandığımızda komut dosyalarımızı altbilgiye yerleştirmemizi sağlar.

WordPress Panonuzdan Görünüm> CSS'yi Düzenle'ye gidin.

İşte temel CSS editörüne sahip ekran.

Şimdi CSS'nizi doğrudan varsayılan metne yapıştırın. CSS'nizin yalnızca düzenleyicide görünmesi için varsayılan metni silebilirsiniz. Ardından stil sayfasını kaydedin, CSS'niz yayınlanacaktır.

Bir alt tema kullanın. En iyi bahsiniz. Bu şekilde tema güncellenirse, oluşturduğunuz stil sayfalarını geçersiz kılmazsınız.

https://codex.wordpress.org/Child_Themes

Bu rotaya gidin, daha sonra kendinize teşekkür edeceksiniz.