7
2013
Galeri Eklenmiş Yazı İçin Sayfaya Eklenen CSS Kodlarını Kaldırma
WordPress'te yazılarımız içerisine, o yazıya eklenmiş olan resimlerden oluşturduğumuz bir galeri eklemek mümkün. Ancak galeri eklenmiş yazılar görüntülendiğinde, kaynak kodunda, satır içi CSS biçimlendirme kodları eklenir. Benim gibi bu tür kodlardan hoşlanmayanlar ya da hazırladıkları temalarda, galerileri kendileri biçimlendirmek isteyenler için bu kodların eklenmesini engellemek mümkün.
Galeri eklenmiş bir yazıyı görüntülediğinizde, sayfanın kaynak kodunu görüntülediğinizde aşağıdaki gibi bir kod eklendiğini göreceksiniz.
#gallery-1 {
margin: auto;
}
#gallery-1 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%;
}
#gallery-1 img {
border: 2px solid #cfcfcf;
}
#gallery-1 .gallery-caption {
margin-left: 0;
}
Bu kodun hemen altında da galeri kodları yer alır. İşte bu satır içi CSS kodunun eklenmesini engellemek için yine aşağıdaki kodları temanızın functions.php dosyasına uygun şekilde eklemeniz yeterli.
add_filter( 'use_default_gallery_style', '__return_false' );
Ancak bunu kodu eklediğinizde artık galerilerinizi yan yana görüntüleyecek biçimlendirme kodları olmayacağı için galerideki resimler alt alta görünecekler. Bunu engellemek, tüm galerileriniz için ortak bir biçimlendirme uygulamak için aşağıdaki CSS biçimlendirmelerini temanızın style.css ya da biçimlendirmelerinizin yer aldığı .css dosyasına ekleyin, isterseniz ek biçim özellikleri ekleyerek, galerinizdeki resimlerin daha etkileyici görünmesini sağlayabilirsiniz de.
/* galeri resmini biçimlendir */
.gallery img {
max-width: 98%;
padding: 1%;
border: 1px solid #ccc;
}
/* galeriyi biçimlendir */
.gallery {
clear: both;
overflow: hidden;
margin: 0 auto;
}
/* galeri elamanını biçimlendir */
.gallery .gallery-item {
overflow: hidden;
float: left;
margin: 10px 0 0;
text-align: center;
list-style: none;
}
/* galeri başlığı kullanılmışsa onu biçimlendir */
.gallery-caption {
font-size: 11px;
}
Bu biçimlendirmeler yukarıdaki biçimlendirmelerden farklı gelebilir, ancak bu biçimlendirme kodlarında kullanılan sınıflar, galerinin HTML kodlarında da kullanılıyorlar yani sorun yok.
Thanks DeluxeBlogTips
hocam bu konuya benzer bir şey sormak istiyorum.
bası eklentiler kendi style kodlarını (sayfalarını) ekliyorlar head tagları arasına. çok sayıda css çekimi de hızı düşürüyor. google page speed de bu şekilde örneğin.
sormak istediğim "wp-content/plugins/shadowbox-js/css/extras.css" şeklinde olan css leri engelleyip bunları bizim temamızın ana stil dosyasına kaydederek yapamaz mıyız?
Tabi ki istediğiniz şekilde yapabilirsiniz, ancak bunun için öncelikle eklentinin kodlarını inceleyip, o css ve .js dosyalarını nasıl eklediğini öncelikle görmeniz gerekiyor. Yani eklenti kodları arasında aşağıdakine benzer bir kod bulmalısınız.
wp_enqueue_style( 'cleaner-gallery', CLEANER_GALLERY_URL . 'cleaner-gallery.css', false, 0.8, 'all' );
ardından da kod içindeki cleaner-gallery ifadesini kullanarak bu css dosyasının yüklenmesini aşağıdaki şekilde engelleyebilirsiniz. Kodları düzenleyip, functions.php dosyanıza ekleyin. Fonksiyon içerisinde birden fazla CSS dosyasının kayıt edilmesini engelleyecek satırları ekleyebilirsiniz.
add_action( 'wp_print_styles', 'yakuphoca_css_sil', 100 );
function yakuphoca_css_sil() {
wp_deregister_style( 'cleaner-gallery' );
}
Aşağıdaki gibi satırları çoğaltabilirsiniz.
add_action( 'wp_print_styles', 'yakuphoca_css_sil', 100 );
function yakuphoca_css_sil() {
wp_deregister_style( 'cleaner-gallery' );
wp_deregister_style( 'başka css' );
wp_deregister_style( 'başka bir css' );
}
Tabi ki bu kodları kullandıktan sonra bu dosyaların içindeki CSS biçimlendirmelerinizi temanızın style.css dosyasının en altına komple kopyalayıp, yapıştırmanız gerekiyor.
eyvallah hocam bunu uyguladım. oldu sağolasın.
bazı yerlerde benzer kullanım anlatılmış yalnız eklinti sayfasında wp_enqueue_style adının bulunup yazılması gerektiği belirtilmediğinden başarısız olmuştum.
şimdi bir de gallery css sini silebiliyoruz. bunun gibi yine eklenti kaynaklı olan doğrudan sayfaya eklenen css leri nasıl kaldırabilirirm. satır içi css denilen olay sanırım.
Genelde eklentiler bu tarz kodlar için add_action( 'wp_head'... ile head bölümüne, add_action('wp_footer'... şeklindeyse footer alanına eklerler. Eklenti içinde bu kodları bulduktan sonra temanızın functions.php sayfasına remove_action('wp_head'... veya remove_action('wp_footer'.. şeklinde kodlar ekleyerek bu kodların işlemesini engelleyebilirsiniz. Şöyle kullanırsanız daha iyi olur remvove_action('wp_head', 'eklentinin fonksiyonu', 100); bu haliyle bu kodun önceliğini bayağı sonraya (100. sıraya) koymuş olacağınızdan, eklenti yukarıdaki şekilde wp_head kancasına fonksiyon taksa bile sizin kodunuz sonradan çalışacağından, bu kancayı silecek dolayısıyla da eklentinin kod eklemesini engellemiş olacaksınız.