17 Feb 2013

Cara Membuat Judul Widget Blog Berada di Tengah

Cara Membuat Judul Widget Blog Berada di Tengah - Cara membuat tema widget blog berada di tengah atau Cara membuat judul font widget blog berada di tengah atau Cara membuat judul/tema widget font sidebar blog berada di tengah.

Cara Membuat Judul Widget Blog Berada di Tengah

Cara tutorial kita pada hari ini termasuk memodifikasi widget atau font pada blog atau juga bisa di kategorikan membuat blog menjadi lebih nyaman di pandang karena bisa di seimbangi oleh judul widget blog yang terkesan produktif dan elegant, seperti Sobat lihat screenshot di atas terlihat enak dipandang dan teratur. Tutorial ini juga banyak para kalangan website atau blogger yang menerapkan sistem text-align:center; pada script .sidebar h2{ atau h2 pada templatenya masing-masing. Untuk lebih jelasnya, simak tutorial hangat berikut:

1. Login ke akun Blogger Sobat.
2. Pilih Template > Edit Html > Lanjutkan > Centang ( Expand Template Widget ).
3. Cari kode h2 atau h3 ( untuk mempermudah pencarian, tekan Ctrl+F atau F3 ).
4. Kemungkinan Sobat akan bertemu script sebagai berikut.
h2 {
 font: $(widget.title.font);
color: $(widget.title.text.color);
margin: 0 0 .5em;
5. Untuk membuat judul atau tema widget berada di posisi tengah, tambahkan text-align:center; menjadi seperti berikut:
h2 {
 font: $(widget.title.font);
color: $(widget.title.text.color);
margin: 0 0 .5em;
text-align:center;
6. Kemungkinan juga sobat menemukan script dibawah ini, perhatikan script text-align:left;
.sidebar h2{margin:10px 0 0 0;padding:9px 0 8px 10px;font-size:24px;line-height:24px;font-family:Kaushan Script,Arial,Helvetica,Sans-serif;color:#303030;background:url(https://lh4.googleusercontent.com/-TkjV_KK6sZ4/TyR40diWzmI/AAAAAAAAApg/Xnf76LhTc0c/h120/sidebar-tab4.png) left top repeat-x;border-top:1px solid #E4E3E3;border-left:1px solid #E4E3E3;font-weight:bold;text-align:left;text-shadow: 4px 4px 4px #aaa;}
7. Sobat ganti script text-align:left; menjadi text-align:center; sehingga menjadi sebagai berikut:
.sidebar h2{margin:10px 0 0 0;padding:9px 0 8px 10px;font-size:24px;line-height:24px;font-family:Kaushan Script,Arial,Helvetica,Sans-serif;color:#303030;background:url(https://lh4.googleusercontent.com/-TkjV_KK6sZ4/TyR40diWzmI/AAAAAAAAApg/Xnf76LhTc0c/h120/sidebar-tab4.png) left top repeat-x;border-top:1px solid #E4E3E3;border-left:1px solid #E4E3E3;font-weight:bold;text-align:center;text-shadow: 4px 4px 4px #aaa;}
8. Setelah itu, lebih baik tekan Pratinjau terlebih dahulu, jika berhasil baru tekan Simpan.

Demikianlah tutorial kita pada hari ini, semoga artikel kita pada hari ini bisa membantu dan bermanfaat buat sobat sekalian. Semoga Berhasil....

11 komentar:

  1. mantap gan,... tutorial Cara Membuat Judul Widget Blog Berada di Tengah nih yang ane cari,....salam kenal aja dari MANIAK SOFTWARE PC,....


    BalasHapus
  2. wiehh sip lahh...
    nambah ilmu

    BalasHapus
  3. thanks gan, kunjungannya ya ditunggu mudanlubis.blogspot.com

    BalasHapus
  4. kok ane cari - cari nggak ketemu ?

    BalasHapus
    Balasan
    1. Kalau gak ketemu, coba langsung cari text-align:left;

      Hapus
  5. Oh Gitu Cara Nya Loh , Aku Baru Tau

    Komen Back : http://r3d-xcode.blogspot.com

    BalasHapus
  6. wahh,artikelnya sangat membantu

    Mampir-mapir ke blogku ya

    searchfadhil.blogspot.com

    BalasHapus
  7. alhamdulillah,,,,ketemu tips jitu nih akhirnya...trims sobat..sukses n terus berkarya,,,
    berkunjung juga ya..
    http://mmm-php-s3.blogspot.com/

    BalasHapus

BERI KOMENTAR | KHUSUS PENGGUNA TERDAFTAR
Silahkan beri komentar Anda dengan bijak dan sesuai dengan topik (untuk komentar OOT sebaiknya di Forum Ngopi).