it-swarm.asia

Eklenti satır içi stilleri kullanmadan CSS seçeneklerini nasıl eklerim?

Kısa bir süre önce herhangi bir yazıya veya sayfaya bir jQuery kaydırıcısını eklemek için kısa kod kullanan bir eklenti, WP Coda Slider kullandım. Bir sonraki sürümde bir seçenekler sayfası ekliyorum ve bazı CSS seçeneklerini eklemek istiyorum, ancak eklentinin stil seçeneklerini satır içi CSS olarak eklemesini istemiyorum. Seçimlerin çağrıldığında dinamik olarak CSS dosyasına eklenmesini istiyorum.

Ayrıca güvenlik sorunları için fopen kullanmak veya bir dosyaya yazmaktan da kaçınmak istiyorum.

Böyle bir şeyin başarılması kolay mı yoksa stil seçimlerini doğrudan sayfaya eklemekten daha iyi olur muyum?

25
Chris_O

Stil sayfasını eklemek için wp_register_style ve wp_enqueue_style kullanın. wp_head dosyasına bir stil sayfası bağlantısı eklemeyin. Kuyruk stilleri, diğer eklentilerin veya temaların gerekirse stil sayfasını değiştirmelerini sağlar.

Stil sayfanız bir .php dosyası olabilir:

wp_register_style('myStyleSheet', 'my-stylesheet.php');
wp_enqueue_style( 'myStyleSheet');

my-stylesheet.php şöyle görünürdü:

<?php
// We'll be outputting CSS
header('Content-type: text/css');

include('my-plugin-data.php');    
?>

body {
  background: <?php echo $my_background_variable; ?>;
  font-size: <?php echo $my_font_size; ?>;
}
27
Doug

Dinamik olarak bir CSS dosyası oluşturmak ve daha sonra yüklemek, özellikle CSS'de WP üzerinden işlenecek değişkenler varsa, bir CSS dosyası eklemenin çok düşük bir bant genişliği anlaşması olması gerektiğine BÜYÜK bir performans yükü ekler. Bir sayfa yüklemesi için oluşturulan iki farklı dosya olduğundan, WP iki kez başlar ve tüm DB sorgularını iki kez çalıştırır ve bu büyük bir karışıklıktır.

Kaydırıcınız yalnızca bir sayfada olacaksa ve stillerin dinamik olarak ayarlanmasını istiyorsanız, en iyi seçeneğiniz başlığa stil bloğu eklemektir.

Performans sırasına göre:

  1. Başlığa, dinamik olarak oluşturulmuş küçük stiller bloğu ekleyin - Çok hızlı
  2. Wp_enqueue_style aracılığıyla dinamik olmayan bir stil sayfası ekleme - Orta
  3. Wp_enqueue_style ile dinamik bir stil sayfası ekleme - Çok Yavaş
10
Dan Gayle

Genelde böyle yaparım:

function build_stylesheet_url() {
    echo '<link rel="stylesheet" href="' . $url . 'stylesheetname.css?build=' . date( "Ymd", strtotime( '-24 days' ) ) . '" type="text/css" media="screen" />';
}

function build_stylesheet_content() {
    if( isset( $_GET['build'] ) && addslashes( $_GET['build'] ) == date( "Ymd", strtotime( '-24 days' ) ) ) {
        header("Content-type: text/css");
        echo "/* Something */";
        define( 'DONOTCACHEPAGE', 1 ); // don't let wp-super-cache cache this page.
        die();
    }
}

add_action( 'init', 'build_stylesheet_content' );
add_action( 'wp_head', 'build_stylesheet_url' );
2
sorich87

Bu ilkin tüm önerileri konusunda zorluk yaşadım - belki biraz kalınım ya da belki katılımcılar ortak dokunuşunu kaybetti.

Bunu eklenti php dosyasında kodlamaya karar verdim: -

echo "<link href='http://www.brittany-gite-holidays.co.uk/wp-content/plugins/flexavailability/css/css.css' type='text/css' rel='stylesheet' />";
echo "<link href='http://www.brittany-gite-holidays.co.uk/wp-content/plugins/flexavailability/css/public.css' rel='stylesheet' type='text/css'/>";

İşe benziyor. Yalnızca eklentiyi kullanan sayfalara yüklenir. Benim için iyi olan h1 etiketinden sonra yükler. Nasıl daha verimli veya daha net olabileceğini göremiyorum.

.... ama belki de yanılıyorum - biraz kalın olduğumu söyledim.

1
chazza