9 Mart 2017

,

Blogger Responsive Tema'da Mobil Görünümü Özelleştirme

 Merhaba arkadaşlar bu yılın başında hatırlarsanız size buradaki yazımda responsive olmayan temalar için widgetların nasıl gizli veya görünür hale getirileceği hakkında sizlere bilgi vermiştim.

 Fakat kendim de dahil olmak üzere birçok blogger responsive tema kullandığı için bir arayış içine girdim ve sonunda responsive temalarda bir widget'ın veya herhangi bir kodun çalışmasının mobilde veya masaüstünde nasıl engelleneceğini buldum.

 Dilerseniz bu yöntem ile ilgili bilgi vermeye başlayalım.

Aşağıdaki kodları bir yere not edin;

<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
<!-- Sadece mobilde çalışmasını istediğin kod buraya -->
<b:else/>
<!-- Sadece masaüstünde çalışmasını istediğin kod buraya-->
</b:if>


 Bu kodun üç farklı işlevi var bunlar;

1.Bir widget'ı veya kodu sadece mobilde gösterme
 Aşağıdaki kodun <!-- Sadece mobilde çalışmasını istediğin kod buraya --> yazan 
kısmına widget veya kodları yerleştirin.

<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
<!-- Sadece mobilde çalışmasını istediğin kod buraya --></b:if>

Bu şekilde şekilde widget veya kod sadece mobilde çalışır, masaüstünde görüntülenmez.

2.Bir widget'ı veya kodu sadece masaüstünde gösterme
 Aşağıdaki kodun <!-- Sadece masaüstünde çalışmasını istediğin kod buraya--> yazan kısmına kodu ekleyin.

<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
<!-- Burası boş kalacak -->
<b:else/>
<!-- Sadece masaüstünde çalışmasını istediğin kod buraya-->
</b:if>


Bu şekilde ise kod veya widget sadece masaüstünde görünür, mobilde gözükmez.

3.Belli bir bölgede masaüstünde farklı, mobilde farklı nesne gösterme
 Bu kısım, vermiş olduğum kodun en can alıcı noktası.
 Örneğin sitenizde bir reklam bölgesi oluşturdunuz ve burada mobilde farklı masaüstünde  farklı bir reklam boyutunun veya türünün çalışmasını istiyorsunuz. Bunun için şunu yapmanız gerekiyor;
 Mobilde göstermek istediğiniz reklamı aşağıdaki kodun <!-- Sadece mobilde çalışmasını istediğin kod buraya --> yazan kısmına yerleştirin. Böylece reklam sadece mobilde görüntülenir.
 Peki aynı bölgede masaüstünde ise başka bir reklam göstermek istiyorsunuz. Bunun için de şunu yapıyorsunuz;
Masaüstünde göstermek istediğiniz reklamı aşağıdaki kodun <!-- Sadece masaüstünde çalışmasını istediğin kod buraya--> yazan kısmına ekleyin. Bu reklam ise sadece masaüstünde görünür.

<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
<!-- Sadece mobilde çalışmasını istediğin kod buraya -->
<b:else/>
<!-- Sadece masaüstünde çalışmasını istediğin kod buraya-->
</b:if>


Sadece reklamlar değil birçok nesneyi masaüstünde veya mobilde gizlemek veya göstermek için bu kodu kullanabilirsiniz.
Bilgi almak istediğiniz veya takıldığınız bir yer olursa yorum bölümünden sormayı unutmayın.
Paylaş:  

5 yorum:

  1. Hocam mesela bir reklam kodu sadece masaüstünde görünüyor. Mobilde görünmüyor. Bunu nasıl çözebilirim ? Ben her ikisinde de göstermek istiyorum

    YanıtlaSil
  2. Öncelikle blogger için söylüyorsanız widget olarak kaydettiğiniz reklam kodu eğer o widget tema tarafından mobilde gizleniyorsa gözükmez, bunu açmak için mobile=yes kodunu kullanmanız gerekir, bu yazımda anlattağım gibi http://www.bilgibil.com/2017/01/bloggerda-bir-widget-mobilde-veya.html.
    Eğer blogger tabanlı değilse veya direkt reklam kodunu temanın içine eklediyseniz mantıken mobilde de gözükmesi gerekir, ancak reklam web'e özel olabilir ve reklam sağlayıcı tarafından mobilde gözükmesi engellenebilir. Siz bana iletişim kısmından daha detaylı yazarsanız size yardımcı olabilirim.

    YanıtlaSil
  3. Blogger tabanlı değil. Ve reklam kendinden masaüstü kodlarını içeriyor

    YanıtlaSil
  4. Reklam servisinizi söylerseniz belki yardımcı olabilirim.

    YanıtlaSil
  5. Kodlama bilgim pek yok eski şablonum mobil ile uyumlu değildi. Çok seviyodum ama değiştirmek zorunda kaldım. Şimdiki şablonum mobil ile uyumlu gayet de memnunum.

    YanıtlaSil

Lütfen yorum yaparken saygılı olun.