Cara Edit Template Blogger Mobile

Dalam posting ini saya akan menunjukkan bagaimana Anda dapat mengedit template mobile blog Blogger Anda. Jika Anda telah mengaktifkan mobile Template (bawah Pengaturan -> Email dan Mobile version lama dari Blogger, di bawah Template dalam tata letak baru), Anda akan dapat menyesuaikan Template Blogger Mobile dengan bantuan definisi CSS.
Anda juga akan dapat mengontrol widget yang akan ditampilkan dan yang tidak. Anda bahkan dapat mengkonfigurasi widget untuk menampilkan konten alternatif kepada pengunjung ponsel Anda.

Cara Edit Template Blogger Mobile

  1. Masuk ke Blogger, kemudian pergi ke Dashboard -> Template ( Layout lama) -> Mobile.
  2. Klik pada Icon Aksesoris bagian bawah Template Mobile. Dan memilih Dropdown untuk "Custom", preview template mobile, lalu simpan.


Blogger Template

Bagaimana untuk menyesuaikan struktur Template Mobile

Blogger dibuat dengan menggunakan widget Blogger yang telah menambahkan properti baru (mobile) untuk tag <b:widget/>.. Properti ini dapat mengambil nilai berikut: 'default', 'yes', 'no', 'only'. Seperti bisa Anda tebak, properti ini akan menentukan bagaimana widget akan diberikan dalam tampilan mobile.
Secara default, widget yang akan ditampilkan pada ponsel adalah:
  • Header
  • Blog
  • Profile
  • PageList
  • AdSense
  • Dan Attribution
a) Jika Anda ingin menyembunyikan semua kata widget, Anda perlu menggunakan properti mobile = 'no' pada tag widget. Dengan demikian,widget tidak akan lagi muncul dalam tampilan mobile.
Misalnya, Anda dapat menyembunyikan Gadget Attribution dalam pandangan Mobile jika Anda menggunakan:
<b:widget id='Attribution1' locked='true' mobile='no' title='' type='Attribution'/>
b) Jika Anda ingin menampilkan widget non-default pada tampilan Mobile blog Blogger Anda, maka hanya mengatur properti untuk mobile, yes '.
Berikut ini adalah sebuah contoh:

Ini adalah tag normal untuk Widget Arsip Blog:
<b:widget id='BlogArchive1' title='Blog Archive' type='BlogArchive'>
Bila Anda mengatur properti mobile sebagai
<b:widget id='BlogArchive1' title='Blog Archive' mobile='yes' type='BlogArchive'>
Anda akan melihat Widget Arsip pada tampilan Mobile Anda.
c) Jika Anda ingin widget hanya muncul dalam tampilan mobile, Anda dapat melakukan hal ini dan harus menyetel properti Mobile untuk 'only':
<b:widget id='Attribution1' locked='true' mobile='only' title='' type='Attribution'/>
Jika Anda menggunakan tag ini, gadget atribution akan hilang dari tampilan desktop, dan hanya akan muncul pada tampilan mobile.

Bagaimana untuk menyesuaikan tampilan dan nuansa dari Template Mobile

Anda sepenuhnya dapat menyesuaikan tampilan dari template mobile Anda. Elemen body dari template mobile akan ditata oleh kelas mobile:
<body class='loading mobile '>
Pastikan bahwa template Anda berisi baris kode berikut:
<body expr:class='"loading" + data:blog.mobileClass'>
Jika Anda memiliki pengalaman bekerja dengan CSS, Anda dapat menggunakan nama kelas untuk template gaya mobile Anda.
.mobile .date-header { text-decoration:underline; }

Widget alternatif Konten pada View Mobile

Bila Anda beralih ke Template Mobile Custom, Anda mungkin menemukan bahwa template yang terlalu besar untuk masuk ke dalam Browser Mobile.
Jika mau, Anda dapat menyediakan konten alternatif di dalam widget.
Sebagai contoh:
<div class="widget-content">
<b:if cond="data:blog.isMobile">

<a href="http://www.blogger.com"> Powered By Blogger </a>
<b:else/>
<!-- Show an image link in desktop view.-->
<a href="http://www.blogger.com">
<img expr:src="data:fullButton" alt="Powered By Blogger"/>
</a>
</b:if>
</div>

Kode ini akan menampilkan Powered by Link teks Blogger on the Mobile dan Powered by Blogger gambar pada tampilan desktop biasa.

Kondisi
<b:if cond="data:blog.isMobile"/>
dapat digunakan untuk memeriksa apakah pengunjung yang melihat blog Anda dalam mobile browser atau tidak. Anda dapat menggunakan conditional check creatively dan memberikan tampilan yang sama sekali berbeda dengan versi mobile dari blog. Selamat tweaking!
thumbnail
Judul: Cara Edit Template Blogger Mobile
Rating: 100% based on 99998 ratings. 5 user reviews.
Ditulis Oleh

Artikel Terkait Blogger, Blogging :

 
Copyright © 2013. About - Sitemap - Contact - Privacy
Template Seo Elite oleh Bamz