Jumat, 24 Januari 2014

0 CARA MENGATUR LEBAR KOLOM DI BLOGGER

Mungkin postingan seperti ini udah basi untuk di tampilkan lagi, sebenarnya saya juga merasa sih kalau postingan seperti yang saya buat ini udah banyak yang jadi karena saya pemula diblogger oleh sebab itu saya cuman mau berbagi sama teman-teman yang belum tau dan yang kebinggungan bagaimana cara mengatur lebar disetiap sidebar blogger. Bagi yang sudah ngerti dah sudah bener pahan mengenai ini saya mohon maaf kalau ada yang salah. ^_^.

Langsung aja ya
Pertama yang jelas login ke blogger dulu,
Pilih template-->  Edit HTML

saya saran kan setiap mau mengedit kode HTML diblogger sobat ada baiknya kode HTML nya di copy dulu ke Notepad untuk menghindari terjadinya error. kalau sudah di pindah di notepad kalau terjadi error kan bisa kita salin ulang kode HTML nya.

BEBERAPA CARA MENGATUR KOLOM LEBAR DI BLOGGER.
1. Mengaturukuran Sidebar Blog
    cari kode dibawah ini
    #sidebar-wrapper {width: 315px;float: right;word-wrap:
    Cara yang sama untuk mengetahui lebar sebelah kiri (left)

2. Latar Depan Halaman
    cari kode #outer-wrapper
  #outer-wrapper {width: 900px;margin: 0 auto;padding: 0px 0px;text-align: left; font: $bodyfont;background:#fff;}
   
3. Untuk Bagian Header
    Cari kode
    #header-wrapper {
    height:100px;
    width:980px;
    margin: 0 auto;
    }

4. Kolom Postingan
    #main-wrapper {width: 600px;float: 

5. Untuk Kolom Footer
    #footer {
      width: 958px;
      clear:both;
      margin: 0 auto;
      padding-top:15px;
      line-height: 1.6em;
      text-transform:uppercase;
      letter-spacing:.1em;
      text-align: center;
    }

KETERANGAN: 
    Kalau tidak ada kode seperti ini , width: 958px;, height:100px; tinggal tambahin aja kode seperti itu di   HTML bagian sidebar yang mau di atur posisinya baik itu lebar atau tingginya dan ukurannya terserah mau dibuat brapa yang penting sesuai sama yang kalian inginkan.

width                 : Lebar
heinght             : Tinggi
right                  : Kanan
left                    : Kiri
line-height        : Tinggi Baris


Mungkin cukup disini dulu sedikit tutorial dari saya, mudah mudahan bermanfaat dat bisa menjadi bekal. oh iya Terima kasih sudah mau mampir di blogger saya. yang sudah berkunjung jangan lupa dikomentarin ya. mudah-mudahan penjelasan saya diatas bisa digunakan.

Kamis, 23 Januari 2014

0 CARA MEMASANG ICON FEED YANG UNIK DI BLOGGER

Assalamualaikum WR.WB. 
Salam Weblog buat kalian smuanya. Mungkin dari sobat ada yang kepingin memasang Favicon seperti RSS, Facebook, Twiter yang mungkin enak dilihat. setelah browsing2 ke mbah google ahirnya dapat juga cara mebuat favicon dan bagaimana cara membuat icon tersebut tampak melayang di blogger kita. 

OK deh saya akan coba membahas tentang cara memasang favicon RSS,Facebook,Twiter melayang yang mengikuti arah mouse. 

Yang pertama soba siapin dulu logo2 favicon yang sobat senangi atau bisa cari-cari digoogle jenis faviconnya atau sobat buat dahulu faviconnya di website dibawah ini
Atau kalau sobat tidak mau susah-susah buat favicon dulu sobat bisa langsung pakai yang kepunyaan saya. 

langsung aja ya.
yang utama pasti login dulu ke bloger
pilih tata letak trus pilih tambah getget--> HTML/Java script

 Kalau sudah copi kode dibawah ini didalam kotak HTML/ Java script

<div style="display:scroll; position:fixed; bottom:80px; right:0px;">
<a class="linkopacity" href="https://www.facebook.com/yobi" target="_blank" rel="nofollow" title="Add me your facebook" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://i239.photobucket.com/albums/ff304/cxoluvme/facebook_32.png" /></a><br />
<a class="linkopacity" href="http://twitter.com/Yobi" target="_blank" rel="nofollow" title="Add me your Twitter" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://i239.photobucket.com/albums/ff304/cxoluvme/twitter.png" /></a><br />
<a class="linkopacity" href="http://seftria-nurza.blogspot.com/feeds/posts/default" target="_blank" rel="nofollow" title="Newslater" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://i239.photobucket.com/albums/ff304/cxoluvme/feed.png" /></a><br />
</div> 

Keterangan:
Ganti warna merah dengan profil Facebook,Twiter dan RSS FEED blog sobat.
Ganti warna biru dengan logo favicon kepunya an soba, kalau gak punya logo pakek punya saya juga boleh.

OK cukup dulu ya tutorial dari saya, terima kasih yang sudah mau berkunjung dang jangan lupa tinggalkan komentar ya. hehehehhehehe..


Minggu, 19 Januari 2014

1 SEKILAS TENTANG MENU LOMPAT KE WIDGET BLOGGER

Assalamuallaikum WR.WB,
Sudah lama juga ternyata ane tidak ngotak atik blog apa lagi dibagian Edit HTML Template nya, kalau baru pertama binggung ui dengan tampilan edit Html yang baru apa lagi tampilannya sudah banyak tab2yang baru. kalau kolom tambah Edit HTML yang lama seandainya kita kepingin mengedit kode HTML tinggal kita centang kotak kecil Expand Template Widget dibagian atas kolom kode HTML nya langsung kita cari kode yang pingin kita tambah mengunakan pencarian dengan tekan ctrl+F pasti kode yang pingin kita cari langsung ketemu.
sedangkan kolom edit HTML pada tampilan terbaru ini sudah tidak ada lagi yang nama nya centang Expand Template Widget tetapi sudah ada cara yang baru lagi yaitu menu tab lompat ke widget, emang sih dengan ada nya menu lompat kewidget ini mempermudah kan kita menuju widget yang lagi kita cari akan tetapi yang agak sedikit menyulitkan kita di kolom edit HTML tersebut terdapat beberapa tandah panah kecil yang berwarna hitam (►), nahhhhhh syaran saya sebelum anda memulai mengedit kode HTML nya ada baiknya anda klik dulu tanda panah tersebut sampai tandah panah nya bener2 habis biar mempermudahkan kita dalam pencarian dan pengeditan kode HTML tersebut.

OK disini saya akan membahas tentang menu tab Lompat Kewidget
apa itu MENU LOMPAT KEWIDGET? menu lompat kewidget merupakan salah satu jalan pintas atau jalan tercepat untuk berada kesalah satu Komponent-komponet atau elemet template yang lagi kita cari atau yang mau kita edit, dan judul pada menu tab melompat kewidget ini sendiri cuman menyesuaikan dengan title yang ada disetiap widget-widget asli yang tersedia didalam widget blogger itu sendiri dan tidak menampilkan widget yang telah kita buat sendiri. Sebagai contoh pada gambar dibawah ini:

Perhatikan gambar diatas setelah kita amati terlihat hanya tampil macam-macam widger dari blogger yang memiliki title-title sebagai berikut, Header1, Label1, Feed2, LinkList15, Html3, Blog1, Navbar1, HTML9, HTML2, Stats1, HTML1, PopularPosts2, dan Followers1, macam-macam widget yang saya ketik ini merupakan contoh dari widget2 edit HTML Blog punya saya sendiri. 

BAGAIMANA CARA MENGGUNAKAN MENU TAB LOMPAT KE WIDGET TERSEBUT?
Cukup simpel kok, anda cuman kelik tab menu lompat kewidget terus pilih widget yang mau anda tampilkan, sebagai contoh : anda kepingin menampilkan widget Header di bagian kotak kode HTML, anda cukup pilih tab header1 dan otomatis anda akan tampil dibagian kolom header.

Cukup sekian dulu dah tutorial dan cara mengetahui tentang LOMPAT KE WIDGET dari saya, kalau yang sudah berkunjung dan yang berkenan saya hara tinggalkan komentar, baik itu krikitan atau syaran. terimakasih, salam Blogwalking

Jumat, 17 Januari 2014

2 CARA MENGHAPUS KOLOM TAMBAH GADGET

Setelah muter - muter browsing ke mbah google bagaimana cara mengkonfigurasikan tab dibagian tambah gatget yang tidak bisa dihapus, sempat binggung sih kok gak ada cara mengkonfigurasikan tab dibagian tambah gatget agar timbul kolom hapusnya, kalau Edit HTML model yang lama sih tinggal kita rubah tulisan trus menjadi false aja udah timbul kolom hapus nya dibagian tambah gatget yang mau kita hapus, ni contoh html model lama yang tidak ada kolom hapus di konfigurasi atribut <b:widget id='Attribution1' locked='true' title='' type='Attribution'> Coba aja perhatikan Kode HTML tersebut disana kan ada tulisan true nya, tinggal kita ganti aja true nya mnjadi false yakin timbul kolom hapus nya dibagian bawah, ini sih cara edit HTML yang lama jangan dipraktekan cara yang ini lagi karna kita muter2 sampai kepusingan pun gak bklan ketemu Html seperti itu lagi sebab walaupun ada rata-rata smuanya udah mnjadi false walaupun ada yang true itu bukan kode yang lagi kita cari. 

OK langsung aja dah kita coba, 
A. Menghapus kolom konfigurasi Feed ( Recent Coment) di bagian tambah gatget blogger.
sebagai contoh gambar dibawah ini


yang utama yang jelas login dulu keblogger anda trus masuk ke kolom Templete►Edit HTML, 
sebelum memulai mengerjakan edit HTML nya sebaik nya sobat perhatikan dulu bagik-baik tandah panah hitam yang berada disamping dibagian no urut di kolom HTML tsbkalau bisa klik smua tanda panah nya sampai habis biar kode HTML nya lebih lengkap kalau bisa setiap kita mau mengedit kode HTML sebaiknya diklil dulu tandah panah hitam kecilnya sampai tandah panah nya bener2 sudah tidak ada lagi biar kita mudah mencari kode HTML yang kita cari (Sebelum mengerjakanya jangan lupa copas dulu kode HTML yang sudah tidak ada tanda panah lagi ke notepad sebab ini menghindari kesalahan2 dalam pengeditan). OK..

Lansung aja sobat klik Lompat ke widget -> pilih tab Feed2

 terus sobat cari kode yang seperti ini   <b:widget id='Feed2' locked='false' title='Recent Comments' type='Feed'>
  

 selanjutnya sobat hapus kode tersebut, trus simpan, kalau sobat mengalami error pada saat penghapusan sobat cari kode seperti ini </b:widget> biasanya kode tersebut berada diatas kode yang kita hapus tadi
kalau sudah simpan dah lihat di kolom tambah gatgetnya apakah tab yang mau kita hapus tadi sudah hilang atau belu.

B> Menghapus tab Navdar di bagian tambah gedget.
 Sebagai contoh gambar dibawah ini. 
 OK deh langsung aja gak usah panjang lebar wa njelasinya karena caranya sama dengan cara diatas, kalau cara diatas sudah dijalani dan berhasil aku yakin menghasul tab gatget yang tidak bisa dihapus yang lainnya bakalan bisa juga.

Sobat basuk ke blog trus pilih templete -> Edit Html, selanjutnya klik tab Lompat Ke Widget trus pilih tab Navdar1, selanjutnya sobat cari kode ini <b:widget id='Navbar1' locked='false' title='Navbar' type='Navbar'>, kalau udah ketemu langsung hapus kodenya, terus simpan template kalau ada kesalahan saat menyimpan sobat cari kode ini </b:widget> biasanya berada diatasnya, trus hapus kode tsb, simpan template, mudah - mudahan berhasil.

Sekian dulu ya postingan dari saya, untuk cara menghilangkan atau menghapus tab di bagian tambah getget yang lainnya yang tidak bisa dihapus saya harap sobat bisa mempraktek kannya sendiri karena cara nya sama aja dengan cara diatas. maaf sob kita sama2 belajar tapi bagi yang sama2 pemula bagi yang udah master saya butuh bimbingannya.

Kamis, 16 Januari 2014

0 Cara Mengedit Kode HTML Terbaru Blogger

Postingan pertama di blog saya cuman mengulas tentang tampilan terbaru blogger aja, yang sudah master weblog nya mohon bimbingan nya ya, yang belim bisa kita sama-sama belajar aja, biasa wa pemula di blog. hehehe.

OK deh langsung aja, Blogger kembali membuat tampilan baru untuk mengedit templet di bulan April Tahun 2013 kemarin. Mungkin teman-teman yang pada suka blog binggung kan dengan tampilan HTML terbaru nya, mungkin ada yg sudah lama main tapi udah vacum dan balik lagi bermain blog atau emang yang pemula bermain blog pada binggung dengan tampilan HTML templete saat ini. 

Sekaran kita coba sama-sama belajar.

MEMBAHAS TENTANG TAMPILAN EDIT HTML TERBARU

Secara garis besar cara dah fungsi kode HTML nya tetap sama kok hanya ada penambahan tombol-tombol dan kalau kolom edit HTML model lama kalau mau ngedit HTML nya kita di wajibkan centang kolom "Expand Template Widget",. untuk lebih jelas coba lihat perbedaan gambar kolom Edit HTML lama sama yang baru. contoh gambar dibawah ini

TAMPILAN EDIT HTML MODEL LAMA

TAMPILAN EDIT HTML MODEL BARU

Keterangan dari gambar templete yang baru
A: Tombol untuk kembali kemenu Templete
B: Tombol Untuk menyimpan perubahan pada template
C: Salah satu fitur yang baru dari edit HTML untuk mempermudah mencari kode HTML
D: Tombol untuk melihat versi HTML
E : Tombol untuk melihat tampilan browser
F: Tombol untuk menghilangkan perubahan HTML saat pengeditan
G: Tombol untuk mengembalikan perubahan yang sebelum nya sudah tapi hilang saat pemformatan

Disini saya jelaskan juga sedikit, pada tampilan edit HTML yang model terbaru ini yang perlu sobat ketahui, pahami dan pelajari pada saat mengedit HTML Templete adalah tombol Lompat ke Widget dan Panah - panah hitam kecil (►) yang berada di kotak di bagian samping kode HTML tersebut.

A. TOMBOL LOMPAT KE WIDGET
Sebenarnya tombol ini sangat membantu anda untuk menuju kekode HTML yang anda cari. Cukup anda klik dan anda pilih jenis Widget apa yang anda butuhkan dan otomatis anda akan melompat ke kode HTML yang anda ingin kan, walaupun tidak tepat dengan kode HTML yang anda cari yang penting sudah mendekati dengan kode HTML yang ada cari.

Yang jadi sedit permasalahan yang bisa menyulitkan anda menemukan kode yang anda cari adalah anda akan melihat tampilan tanda panah hitam kecik (►) disebelah kiri dibaris no urutan kode HTML, dan yang jadi permasalahan kode - kode yang lain banyak tersembunyi di balik tandah panah tersebut.

B. Tombol Tanda Panah Hitam

Tombol tanda panah tersebut ► adalah fitur baru yang akan membuka kode keseluruhan lebih detail lagi. kalau anda sedang mengedit kode HTML templete anda saya harap anda perhatikan dulu baik-baik tanda panah tersebut dan anda kelik terus tanda panah nya sampai tidak ada lagi tanda panah biar kode HTML nya menjadi detail, biar tidak bnggung lgi kalau lagi mengedit kode HTML nya.

Yang mungkin bakalan membinggungkan anda dan mungkin bisa membuat anda kerepotan sebab di kolom Edit HTML nya  sudah tidak ada lagi tombol Expand Widget Templatenya, oleh sebab itu kalian harus mengelik dahulu tombol tandah panah hitam (►) tersebut biar kode HTML nya lebih detail. untuk lebih jelas dah detailnya cobaaja sobat pelajarin dulu biar kita juga sama-sama mengerti. Oke.

Ya sudah cukup sekian dulu dah postingan pertama saya mudah - mudah han menjadi berkah, terimakasih kalau ada yang sudah berkunjung di postingan pertama saya ini. maklum baru belajar broe. hehehehehe
 

started from a hobby Copyright © 2013 - |- All rights reserved - |- Powered by Yobi3 SapuTra