Skip to content

jQuery ile yeni elementlere müdahale

Diyelim ki sitenizde jQuery kullanarak bazı elementleri sayfa açılışında değiştiriyorsunuz. Örneğin;

jQuery(document).ready(function() {  	
	jQuery("img.avatar").parent("a").addClass("thumbnail pull-left"); 
});

Herşey güzel görünüyor sorun yok derken bir baktınız ki ajax kullanarak site içinde değişiklik yaptığınız zaman yeni eklenen içeriğe sayfa açılışında yaptığınız değişiklikler uygulanmıyor. Ve işin kötüsü jQuery ile yeni eklenen elementlere müdahale edemiyorsunuz çünkü o elementler sayfa açılışında orada değildi.
Continue reading

Bootstrap carousel sapıtması ve çözümü

Sorun:  Bootstrap 2.2.2′nin  carousel özelliğini herhangi sebepten bir çok defa durdurup, bir daha başlattığınızda carousel’in sapıtıp sürekli döndüğünü görmüş olabilirsiniz. Zira ben gördüm. İşin sonunda anladık ki bu olay bootstrap’ın bug’ıymış. Adamlar çözümü yayınlayıncaya kadar geçici çözümümüz:

bootstrap.min.js
find:

his.paused=!1),

replace:

his.paused=!1),this.interval&&clearInterval(this.interval),

Detaylı açıklama burda:

https://github.com/twitter/bootstrap/pull/6655

ss

Theme Customizer ile boğuşmalar

Özet: Theme Customizer üzerinden site ayarları tasarlayacaksanız, ayarları functions.php üzerinden yükleyip de tema dosyalarından globals ile çağıramıyorsun.

Bu hafta sıfırdan Bootstrap üzerine kurulu, bütün tema seçeneklerinin Theme Customizer üzerinden değiştirilebildiği bir Theme Framework yazdım (Bu site bu temayı kullanıyor şu an). Yazmak zorunda kaldım diyebilirim çünkü hali hazırda kullanabileceğim bir altyapının olmadığını gördüm. Bootstrap kullanan çok tema var ama buradaki can alıcı nokta; Bootstrap gibi bir css framework kullanıyorsan WordPress Theme Framework’da özel css kullanmazsın arkadaş. Adamlar tonla özel css’in yanına Bootstrap da eklemiş satıyolar responsive theme ayağına. Neyse sinirlendim gene, konumuza dönelim.

Theme Customizer‘ın en ilginç ve güzel tarafı yapılan değişikliklerin anında site üzerinde görüntülenebilmesi. Bir renk değişimini anında site üzerinde göstermek çok zor olmasa da, site düzeni, logo yüklenmesi, özel yazı stili ve tema stilinin anında site üzerinde gösterilmesi için özel uğraş gerektiriyor. Yaptım, ettim, bitti. Denedim çalışıyor derken bi baktım Theme Customizer’dayken eğer herhangi bağlantıya tıklarsam kaydedilmemiş bütün değişiklikler kayboluyordu. Sonradan uğraşlar sonucu keşfettim ki (Buradaki soruda WordPress.Com kadrosundan biri olan Otto’nun verdiği ipucu iyi geldi) Theme Customizer’dayken functions.php bile olsa ayarların globals ile çağırımları normal WordPress’de olduğu gibi değilmiş. Vardır bir sebebi arka planda neden böyle diye hayata küsmeye gerek yok. Peki çözüm nedir?

Eğer temanızda, ayarları sitede kullanmadan önce bazı fonksiyonları çalıştırmanız gerekiyorsa, örneğin:

$anatema_settings = get_option( 'anatema_settings' ); // site options
switch ($anatema_settings["layout"]) {
    case 'only-content':
        $anatema_layout["primary_class"] = "span8";
        $anatema_layout["primary_fullwidth_class"] = "span8";
        $anatema_layout["secondary_class"] = "hide";        
        $anatema_layout["container_class"] = "container";       
        $anatema_layout["page_class"] = "site-narrow";      
      break;
    case 'sidebar-content':
        $anatema_layout["primary_class"] = "span8 pull-right";
        $anatema_layout["primary_fullwidth_class"] = "span12";
        $anatema_layout["secondary_class"] = "span4";       
        $anatema_layout["container_class"] = "container";       
         break;
    default:
    case 'content-sidebar':
        $anatema_layout["primary_class"] = "span8";
        $anatema_layout["primary_fullwidth_class"] = "span12";
        $anatema_layout["secondary_class"] = "span4";       
        $anatema_layout["container_class"] = "container";       
       break;   
}

Bu kodların sonuçlarını kullandığınız tema dosyalarında globals ile çağırım yerine yukarıdaki gibi site ayarlarını tema’da kullanmadan önce çalıştırılması gereken kodları özel bi dosyaya toplayın ve her tema dosyasına include edin.

Bu arada bahsettiğim Theme Customizer’daki ayarlar nedir diye merak ediyorsanız, hızlıca hazırladığım şu video’yu izleyebilir veya yukarıdaki bağlantıdan ‘e üye olabilir ve kendi sitenizde kendiniz kurcalayabilirsiniz ;)