Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Kupası
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

WordPress Gövde Sınıfına Kullanıcı Tarayıcı ve İşletim Sistemi Sınıfları Nasıl Eklenir

Editoryal Not: WPBeginner üzerindeki ortak bağlantılardan komisyon kazanıyoruz. Komisyonlar, editörlerimizin görüşlerini veya değerlendirmelerini etkilemez. Editoryal Süreç hakkında daha fazla bilgi edinin.

WordPress temaları geliştirirken, bazen CSS veya jQuery kullanarak tasarımınızın belirli yönlerini değiştirmek için kullanıcının tarayıcı ve işletim sistemi bilgilerine ihtiyaç duyabilirsiniz. WordPress bunu sizin için yapabilir. Bu makalede, WordPress gövde sınıfına kullanıcının tarayıcı ve işletim sistemi sınıflarını nasıl ekleyeceğinizi göstereceğiz.

Detecting user platform and browser in WordPress

WordPress varsayılan olarak web sitenizin farklı bölümleri için CSS sınıfları oluşturur. Ayrıca, tema ve eklenti geliştiricilerinin kendi sınıflarını bağlayabilmeleri için filtreler de sağlar. Tarayıcı ve işletim sistemi bilgilerini CSS sınıfı olarak eklemek için body_class filtresini kullanacaksınız.

Yapmanız gereken ilk şey, temanızın functions.php dosyasına aşağıdaki kodu eklemektir.

        function mv_browser_body_class($classes) {
                global $is_lynx, $is_gecko, $is_IE, $is_opera, $is_NS4, $is_safari, $is_chrome, $is_iphone;
                if($is_lynx) $classes[] = 'lynx';
                elseif($is_gecko) $classes[] = 'gecko';
                elseif($is_opera) $classes[] = 'opera';
                elseif($is_NS4) $classes[] = 'ns4';
                elseif($is_safari) $classes[] = 'safari';
                elseif($is_chrome) $classes[] = 'chrome';
                elseif($is_IE) {
                        $classes[] = 'ie';
                        if(preg_match('/MSIE ([0-9]+)([a-zA-Z0-9.]+)/', $_SERVER['HTTP_USER_AGENT'], $browser_version))
                        $classes[] = 'ie'.$browser_version[1];
                } else $classes[] = 'unknown';
                if($is_iphone) $classes[] = 'iphone';
                if ( stristr( $_SERVER['HTTP_USER_AGENT'],"mac") ) {
                         $classes[] = 'osx';
                   } elseif ( stristr( $_SERVER['HTTP_USER_AGENT'],"linux") ) {
                         $classes[] = 'linux';
                   } elseif ( stristr( $_SERVER['HTTP_USER_AGENT'],"windows") ) {
                         $classes[] = 'windows';
                   }
                return $classes;
        }
        add_filter('body_class','mv_browser_body_class');

Bu betiğin ilk kısmı kullanıcının tarayıcısını algılar ve $classes‘a ekler. İkinci kısım kullanıcının işletim sistemini algılar ve onu da $classes ‘a ekler. Son satır, sınıfları eklemek için WordPress body_class filtresini kullanır.

Şimdi temanızın header.php dosyasındaki <body> HTML etiketine body sınıfını eklemeniz gerekir. Şablon dosyanızdaki body satırını bu kodla değiştirin:

<body <?php body_class(); ?>>

Eğer underscores gibi bir başlangıç teması ya da Genesis gibi iyi kodlanmış tema çerçeveleri ile çalışıyorsanız, temanızın body etiketinde body class fonksiyonuna zaten sahip olacağını unutmayın. Kod uygulandıktan sonra HTML kaynağında body etiketiyle birlikte tarayıcı ve işletim sistemi sınıflarını görebileceksiniz. Ayrıca WordPress tarafından body etiketine başka sınıflar eklendiğini de fark edeceksiniz.

Adding browser and OS information in WordPress body class

Artık sınıfları farklı tarayıcılar ve işletim sistemleri için şekillendirebilir veya jQuery’de seçici olarak kullanabilirsiniz. Umarız bu makale WordPress’te kullanıcının tarayıcı ve işletim sistemi bilgilerini tespit etmenize yardımcı olmuştur.

WordPress tema geliştirmeye yeni başlıyorsanız, yeni tema tasarımcıları için Sass ve WordPress Body Class 101 ‘e giriş yazımıza da göz atmak isteyebilirsiniz. Herhangi bir geri bildiriminiz veya sorunuz olursa aşağıya bir yorum bırakarak bize bildirin.

Kaynak: Justin Sternberg

Açıklama: İçeriğimiz okuyucu desteklidir. Bu, bazı bağlantılarımıza tıklarsanız komisyon kazanabileceğimiz anlamına gelir. WPBeginner'ın nasıl finanse edildiğini, neden önemli olduğunu ve nasıl destek olabileceğinizi görün. İşte editoryal sürecimiz.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Ultimate WordPress Araç Kiti

Araç setimize ÜCRETSİZ erişim sağlayın - her profesyonelin sahip olması gereken WordPress ile ilgili ürün ve kaynaklardan oluşan bir koleksiyon!

Reader Interactions

10 yorumBir Cevap Bırakın

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Mel says

    Hi.. I’ve been a fan of this website for almost 3 years.. by the way any update on this function for edge browser? thanks :)

    More power!!!

  3. Bill Robbins says

    This is a wonderful way to tweak styling for individual browsers. The only major drawback is it can backfire when used with some caching plugins/systems. You’ll end up applying styles intended for one browser to all browsers because the body tag will be cached just like the rest of the content on the page.

Bir Cevap Bırakın

Yorum bırakmayı seçtiğiniz için teşekkür ederiz. Lütfen tüm yorumların yorum poli̇ti̇kasi uyarınca denetlendiğini ve e-posta adresinizin yayımlanmayacağını unutmayın. Ad alanında anahtar kelime KULLANMAYIN. Kişisel ve anlamlı bir sohbet edelim.