Cara Mudah Membuat 2 Kolom Widget Di Postingan Dan Sidebar

Cara Mudah Membuat 2 Kolom Widget Di Postingan Dan Sidebar

Cara Membuat 2 Buah Elemen Colomn Gadget/Widget Baru :




1. Login Blogger, Pilih Template lalu Edit HTML.
2. Ceklis / Centang Expand Widget Template ( hal ini dimaksudkan agar semua kode HTML pada tampilan widget di Tata Letak / Layout Anda dapat terlihat semua ) .
3. Cari kode ]]></b:skin> dengan menekan tombol CTRL+F
4. Copy Paste script CSS berikut ini diatas ]]></b:skin> :

#box-main-container {
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}

 Anda dapat mengubah padding ( jarak posisi gadget ) 0px 10px 10px 10px maksudnya adalah Jarak ( Atas, Kanan, Bawah, Kiri ) . Anda juga dapat merubah border ( garis tepi widget ) dengan warna. Caranya hapus $bordercolor dan ganti dengan kode warna yang Anda inginkan. Contoh : Kode warna hitam = #000000

5. Kemudian carilah bro kode

•   <div id=main-wrapper>
•   <div id=content-wrapper>
•   <div id=header>
•   <div id=sidebar-wrapper>
•   <div id=bottom>

     jika sudah ketemu dan didapat atau hampir sama dengan kode diatas, letakkan kode HTML di bawah ini di Atas  atau di bawah salah satu kode tadi. Itu sesuai dengan penempatan Anda mau diatas atau dibawah. Contoh diatas <div id=main-wrapper>

<div id=box-main-container>
<div id=box1 style=width: 50%; float: left; margin:0; text-align: left;>
<b:section class=box-column id=Mediablogger1 preferred=yes style=float:left;/>
</div>
<div id=box2 style=width: 50%; float: right; margin:0; text-align: left;>
<b:section class=box-column id=Mediablogger2 preferred=yes style=float:right;/>
</div>
<div style=clear:both;/>
</div>

Penjelasan :

<div id=main-wrapper> adalah posisi halaman utama anda biasanya berukuran lebar 950px. Biasanya dipakai untuk penempatan menu horizontall atau daftar isi sebuah blog.

 

<div id=content-wrapper> adalah posisi postingan.

 

<div id=header> adalah posisi kepala. Biasanya ditempatkan judul blog dan deskripsi blog. Bisa juga diberi space iklan.

 

<div id=sidebar-wrapper> adalah posisi sidebar blog.

 

<div id=bottom> adalah posisi paling bawah. Atau Footer Blog Anda.

Pilih salah satu, mau menempatkannya dimana. Apabila mau menempatkan 2 kolom widget tersebut dibanyak tempat tinggal copy saja kode yang kedua diatas yg ada 50% nya itu, tetapi tidak perlu copy kode yang pertama karena kan sudah ada kode CSS sebelumnya

download now

Read More

Cara Membuat Widget Blog Top 9 Sosial Media

Cara Membuat Widget Blog Top 9 Sosial Media

Assalamualaikum..

Seiring berjalannya waktu, sosial media dewasa ini sudah menjadi kebutuhan. Bayangkan men, "kebutuhan". Jadi menurut sebagian orang, mungkin sosial media sudah dianggap setingkat dengan bernafas, makan, berkedip ataupun beol. #skip #pembukaanyanggagal :D

So, ane sebagai seorang blogger juga sadar, peran sosmed itu penting. Misalnya untuk sekadar berteman, area promosi atau fan page.

Nah, maka dari itu, kali ini ane mau bagi-bagi widget top 9 sosial media yang kece abis buat kamu para blogger. GRATIS...!!!!! Home made, bikinan ane sendiri.. Ngahahahaha.. <<< *sengaja ditegesin, padahal ngga penting sih..* :o

Top 9 Social Media

Kenapa ada 9 ?? Ya, mungkin emang 9 ini yang lagi populer dan banyak penggunanya. Ngga tau juga sih kalo udah ganti lagi. Ya, namanya juga susah move on.. #skip #abaikan :v

Okelah, daripada kelamaan, silahkan langsung copas atau download aja >>>


Demo :

Find me on :

Float up : disini.

Find me on :

Float left : disini.



Lalu paste di "Tambah html/Javascript" di gadget blog kamu.

Bisa buat sekadar promosi akun, nambah teman, fan page, atau buat keren-kerenan.. Serbaguna kan..

Silahkan dimodif atau edit-edit sendiri sob. Misalnya position, warna border, text, efek hover-nya, atau atribut lain.

O iya. Jangan lupa juga ganti kodenya pada atribut href :"https://www.faceb.......... (dan seterusnya) dan arahkan ke jejaring sosialmu sendiri ya. Ngga lucu banget kalo sampe nyasar ke link lain.

Ane pemula, justru ane malah seneng kalo kalian bisa lebih bagus, komen, lalu pamer ke sini. Lumayan kan, sama-sama tambah ilmu.. ;) hehe

Penampakan

Yup, oke guys, sekian dulu.. Silahkan liat penampakannya.. Ane pasang di blog ini juga kok..

Sebentar lagi juga insyaAllah ane update lagi yang vertikal atau dengan ukuran yang lebih kecil..

Silahkan komen atau request kalo berkenan.. Maklum, pemalas kayak ane ini emang harus dikasih pancing dulu biar mau gerak.. :O

Gubay..!!! See ya..!!!

download now

Read More