APA blogs: Tutorial Blog

Tampilkan postingan dengan label Tutorial Blog. Tampilkan semua postingan

Cara Disable Klik Kiri (Left Click) Mouse Pada Gambar di Blog

Nonaktifkan Klik kiri pada Gambar di Blogger Posting Di Blogger, bila seseorang mengklik gambar (ditambahkan blogger upload gambar) dalam posting blog gambar dibuka di tab baru.
Ini adalah perilaku default diposting gambar di Blogger, itu dirancang khusus untuk lightbox gambar tetapi jika lightbox dinonaktifkan gambar dibuka di tab baru, itu karena gambar yang Anda tambahkan pada post editor secara otomatis dibungkus dalam sebuah elemen anchor dengan link ke gambar asli yang membuat gambar link ke sumbernya.
Tidak ada pengaturan di Blogger Dashboard untuk mengaktifkan fungsi ini on atau off sehingga Anda telah melakukan beberapa pekerjaan tambahan untuk mencegah gambar dari pembukaan di tab baru jika diklik. Ada dua cara untuk melakukan itu.Mengedit HTML dari setiap postingKetika Anda meng-upload gambar di posting blogger Anda gambar secara otomatis dibungkus dalam sebuah tag anchor ke file gambar asli. Itulah alasan gambar yang Anda posting di blogger dapat diklik, jika Anda menghapus tag anchor, gambar menjadi unclickable.Buka editor posting blogger Anda, meng-upload gambar di posting kosong dan kemudian beralih ke mode HTML (gunakan tombol di kiri atas). Ini adalah apa yang akan Anda lihat:

Menghapus dua baris disorot (2 dan 4) akan melakukan pekerjaan atau dalam modus klik compose pada gambar dan kemudian pilihan Link pada toolbar Format, akan menghapus link.Tapi Anda harus melakukan hal ini setiap kali Anda meng-upload gambar yang sulit dan jika Anda memiliki ratusan posting dengan ribuan gambar maka ini akan menjadi pekerjaan yang membosankan bagi Anda.Cara JavaScriptDengan kode kecil dari JavaScript di blog Anda, Anda dapat menonaktifkan klik kiri pada semua gambar di dalam posting di blog Anda itu berarti Anda tidak harus mengedit setiap gambar untuk menghapus link itu. Namun JavaScript ini tidak menghapus link dari gambar, itu hanya menonaktifkan klik kiri pada gambar.Menambahkan Perpustakaan jQuery pertamaCatatan: Jika jQuery sudah ditambahkan dalam template Anda, melewatkan langkah ini.Sebelum kita menambahkan kode JavaScript utama, mari kita mencakup kerangka jQuery dalam template. Ini adalah kerangka kerja JavaScript. Berikut kode HTML untuk kerangka jQuery:

Untuk menambahkan HTML ini dalam template Anda pergi ke Dashboard Blogger Anda -> Template -> Edit HTML -> Tekan CTRL + F (CMD + F pada Mac) dan mencari <head> dan paste JavaScript / HTML langsung di bawah itu. Kemudian mungkin terlihat seperti ini :

Setelah kode ini di tempat yang tepat, klik Save Template dan langkah pertama dilakukan. Sekarang pindah ke langkah berikutnya untuk tindakan nyata.JQuery Fungsi KodeIni kode jQuery kecil menonaktifkan klik kiri pada gambar (atau apa pun yang Anda inginkan) di dalam tubuh posting. Jadi bahkan jika Anda memiliki gambar Anda dibungkus dalam sebuah anchor link diklik, dan bahkan jika Anda klik, tidak akan terjadi.

Untuk membuat kode ini bekerja untuk blog Anda, Anda harus menambahkan ini dalam template. Ikuti instruksi untuk menambahkannya:

Pergi ke Dashboard Blogger Anda

Pilih tab Template

Klik pada Edit HTML dan lanjutkan

Sekarang gunakan CTRL + F atau CMD + F di Mac

Cari </ head> dalam template dan kemudian paste jQuery / kode JavaScript di atasnya dan Simpan template.

Ini adalah apa kode seharusnya terlihat seperti pada itu tempat yang benar

Catatan bahwa ini akan menonaktifkan klik kiri pada semua gambar terkait dalam tubuh posting blog Anda, tetapi jika Anda pernah ingin gambar yang akan diklik kemudian hanya menambahkan kelas clickEnabled dengan tag img. Jadi klik gambar diaktifkan akan terlihat seperti ini (hanya melihat nama kelas)

Ini akan menghentikan kode dari berjalan pada gambar tertentu, Anda dapat melakukan ini pada sejumlah gambar dalam posting Anda.
Tidak hanya di blogspot, Anda dapat menggunakan potongan kode pada situs web apapun yang Anda inginkan Wordpress, Tumblr dll hanya mengubah pemilih (pasca-tubuh img:.. Tidak (clickEnabled) hal) tetapi jika Anda tidak yakin tentang itu Anda dapat menghubungi saya untuk mengetahui pemilih yang benar untuk situs atau blog.
Kode ini hanya berhenti browser dari melakukan sesuatu ketika link gambar di dalam pos tubuh diklik, sederhana, bukan?

Cara Membuat Facebook LikeBox Popup melayang di Blog er

Banyak cara Membuat Penggemar blog Kita Semakin Ramai / Banyak dan Semakin Popouler, salah satunya melalui fanspage facebook dimana kita lihat bahwa pada umumnya orang yang sudah menjelajah di Internet sudah memilki akun facebook. dan untuk mempermudah orang untuk menyukai fanspage tersebut adalah dengan membuat fanspage dengan pop up melayang di Blog.

Contohnya sperti Gambar Dibawah ini :

Ok, Langsung saja dengan Tutorialnya

Langkah-langkahnya sebagai berikut :

Go To Blogger> Desain> Edit HTML
Backup template anda
Paste kode berikut tepat di atas </ body>

#fblikepop #counter-display{float:right;font-size:11px !important;font-weight:normal !important;margin:5px 0 0 0;text-align:right;line-height:16px;}</style>
<script src='http://mybloggertricks.googlecode.com/files/jquery.js' type='text/javascript'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>
<script src='http://mybloggertricks.googlecode.com/files/mbtlikebox2.js' type='text/javascript'/>
<script language='javascript'>
//<![CDATA[
    $(document).ready(function(){
        $().KNFBFansPRO({
           timeout: 30,
            wait: 0,
            url: 'http://www.facebook.com/pages/Cici123',
            closeable: true        });
    });
//]]>
</script>
<div id='fbtpdiv'/>

Membuat perubahan-perubahan penting:

Ganti ini Apa Blogs dengan nama \halaman/Fanspage Facebook sobat.
Timer diset untuk 30 detik, untuk mengubahnya cukup mengedit timeout: 30
Widget ini muncul segera setelah ada visitor. Jika Anda ingin untuk muncul setelah satu menit atau lebih kemudian edit wait: 0
Ganti http://www.facebook.com/pages/Cici123 dengan alamat halaman/Fanspage sobat.

Membuat Tooltip Berlink Di dalam-nya

Langkah Membuat Coda Bubbles dengan jQuery

Pertama langkahnya seperti biasanya ya hanya pilih Dashboard (gb.1),lalu Tata Letak (gb.2) kemudian contreng tulisan Expands Widget Templates (gb.3).

(1)

(2)

kwicks jquery navigasi menu tooltip blogger.

(3)

Nah,selanjutnya cari kode ]]></b:skin> (gunakan Ctrl+F di keyboard sob),setelah ketemu tinggal letakkan kode CSS berikut tepat diATAS kode ]]></b:skin> tersebut.

Setelah itu cari kode </head> gunakan Ctrl+F pada keyboard untuk mempermudah pencarian,setelah sobat menemukan kode </head> letakkan persis diATASnya kode script berikut:

var hideDelayTimer = null;

// tracker
var beingShown = false;
var shown = false;

var trigger = $('.trigger', this);
var popup = $('.popup', this).css('opacity', 0);

// set the mouseover and mouseout on both element
$([trigger.get(0), popup.get(0)]).mouseover(function () {
// stops the hide event if we move from the trigger to the popup element
if (hideDelayTimer) clearTimeout(hideDelayTimer);

// don't trigger the animation again if we're being shown, or already visible
if (beingShown || shown) {
return;
} else {
beingShown = true;

// reset position of popup box
popup.css({
top: -100,
left: -33,
display: 'block' // brings the popup back in to view
})

// (we're using chaining on the popup) now animate it's opacity and position
.animate({
top: '-=' + distance + 'px',
opacity: 1
}, time, 'swing', function() {
// once the animation is complete, set the tracker variables
beingShown = false;
shown = true;
});
}
}).mouseout(function () {
// reset the timer if we get fired again - avoids double animations
if (hideDelayTimer) clearTimeout(hideDelayTimer);

// store the timer so that it can be cleared in the mouseover if required
hideDelayTimer = setTimeout(function () {
hideDelayTimer = null;
popup.animate({
top: '-=' + distance + 'px',
opacity: 0
}, time, 'swing', function () {
// once the animate is complete, set the tracker variables
shown = false;
// hide the popup entirely after the effect (opacity alone doesn't do the job)
popup.css('display', 'none');
});
}, hideDelay);
});
});
});

</script>

Nah,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (4)

Cara Membuat tooltip jquery navigasi menu for blogger blogspot.

Cara Membuat tooltip jquery navigasi menu for blogger blogspot.

(4)

membuat navigasi menu javascript css blogger jquery tooltip.

(5)

Selanjutnya pilih HTML/Javascript lihat Gb(5)kemudian letakkan kode berikut:

Lalu simpan dan lihat hasilnya,oh ya,kode yang bercetak tebal (http://belajargooglecode.googlecode.com/files/Siapa%20Bilang%20Bid%27ah%20itu%20sesat.mp3) , (http://3.bp.blogspot.com/-OyJmeSaNDXA/T60LK6s8WxI/AAAAAAAABkQ/x6UY2x9CGw8/s1600/download%2Bbutton%2Bpelajaran%2Bblog.jpeg) dan juga (Benarkah Bid'ah Itu Sesat?) ganti sesui selera anda.
try

Cara membuat Tooltip Gambar dalam link di blog

Cara membuat Tooltip Gambar dalam link di blog,
Tooltip adalah sebuah tool yang melekat pada sebuah link dan berfungsi memberikan keterangan atau petunjuk kepada pengunjung mengenai isi suatu dokumen atau sebuah halaman web atau blog yang akan dituju sebelum link tersebut di klik.
dan dalam artikel ini Tooltip yang dimaksud adalah tooltip ketika didekatkan dengan mouse akan memunculkan keterangan gambar.

Untuk cara membuat Tooltip gambar dalam link ini dapat anda simak sebagai berikut :

Log in ke blog anda
Klik Rancangan
Klik Edit HTML
Cari kode </head>
Simpan kode di bawah ini di atas kode </head>

kemudian klik simpan template
dan sekarang cara menggunakannya yaitu dengan menambahkan atribut rel dan juga class ke dalam link seperti di bawah ini :

Jadi Gunakan kode itu, silahkan gunakan dimana saja anda mau. Itulah sedikit cara membuat tooltip gambar dalam link di blog

Cara Membuat Komentar Facebook (FB) di Blog

Komentar Facebook di blog

Cara Membuat Komentar Facebook (FB) di blog,
Supaya blog kita semakin bagus dan komunikasi kita semakin luas maka kita bisakanlah budaya berkomentar, karena komentar itu adalah cara untuk memperbaiki sesuatu melalui kritikan dari orang lain. berkomentar tidak cukup hanya dari komentar yang dibuat blogger karena menurut saya pada umunya orang sudah punya facebook, jadi orang akan lebih mudah berkomentar pada saat membuaka facebook.Cara membuat Komentar facebook di blog adalah pemasangan aplikasi komentar facebook di bog khususnya blogger.

cara membuat komentar facebook (FB) di Blog :

login / masuk ke facebook sobat
Kunjungi situs Facebook Developers.
Pilih Comments yang ada pada daftar social plugins facebook pada situs Facebook Developers.

Masukan URL blog dengan URL blog / website sobat kemudian masukan jumlah komentar yang kan dimunculkan pada blog sobat dan lebar kotak komentar facebook.

Bila kamu sudah selesai, langkah selanjutnya klik Get Code.
Setelah itu akan muncul kotak kode facebook yang berisi 2 kotak kode, yaitu kotak kode no.1 dan kotak kode no.2.
Perhatikan gambar :
Buka "Tab Browser Window" baru kemudian buka situs blogger dan login ke blog sobat.
Klik "Design" kemudian klik "Edit HTML" untuk mengedit HTML template blog sobat.
Cari kode <body>, bila kamu sulit mencarinya kamu tekan tombol Ctrl + F, setalah itu kamu ketik <bod atau <body> pada kolom pencarian yang muncul, bila sudah ketemu kamu letakkan kode no.1 (kotak kode no.1) dibawah kode <body>.

Contoh :

...........

<body>

<div id="fb-root"></div>

<script>(function(d, s, id) {

var js, fjs = d.getElementsByTagName(s)[0];

if (d.getElementById(id)) return;

js = d.createElement(s); js.id = id;

js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=198573203529943";

fjs.parentNode.insertBefore(js, fjs);

}(document, 'script', 'facebook-jssdk'));</script>

......

Catatan : Ganti karakter "&" dengan "&".

Apabila diletakan di bawah komentar blogger maka cari kode "<p class='comment-footer'>" kemudian letakan kode no.2 fb di bawah kode "<p class='comment-footer'>".

Contoh :......

<p class='comment-footer'>

<hr/>

<div class="fb-comments" data-href="http://monozcore.blogspot.com" data-num-posts="5" data-width="470" data-colorscheme="dark"></div> <hr/>

......

Catatan : Ganti data-href="http://monozcore.blogspot.com" dengan expr:data-href='data:post.url' supaya komentar facebook secara otomatis disesuaikan dengan lokasi URL postingan artikel.

Bila kode no.2 sudah ditempatkan silakan sobat save template sobat.

Itulah Cara membuat Komentar Facebook (FB) di blog

Cara membuat daftar isi dengan thumbnail

Cara Membuat daftar Isi dengan thumbnail atatu bergambar, sebuah daftar isi sebuah blog akan memudahkan kita untuk mendapatkan artikel yang ingin kita cari. Cara membuat daftar isi dengan Thumbnail / bergambar ini sebanarnya adalah artikel yang saya dapat di blog sbat saya kbetulan saya sangat mencari artikel ini. Itulah sebabnya saya mengopy supaya artikel ini tidak hilang atau tercecer kmana-mana dan skaliam jga buat berbagi buat newbie seperti saya,
Inilah sobat blogger cara membuat daftar isi dengan Thumbnail / bergambar :

Log in ke blog anda
Klik Rancangan

Baca selengkapnya »

Cara Membuat Random Post Di Blog

Cara Membuat Random Post di Blog atau membuat Postingan secara acak pada blogger ini sangat membantu sobat dalam peningkatan jumlah tayangan laman selain artikel terkait atau related post. Artikel Cara membuat random Post di Blog sebenarnya sudah terlalu mudah bagi sobat blogger, tapi buat yang awam atau yang newbi kemungkinan perlu untuk mengetahuinya, dan inilah cara membuat random post.

Cara membuat Random Post di Blog:

login pada blog kamu.
Klik Rancangan/ design.
Lalu tambah gadget.
Pilih HTML/Javascript.
Copy dan paste kode dibawah ini:

Keterangan :
Ganti var numofpost=10 dengan jumlah postingan yang kan ditampilkan
misal 15,20,5 atau seterusnya.nah demikianlah tutorial cara membuat random post di blog.
Nah.... mudahkan.

Cara Membuat Tukeran / Excange Link Text Di Blog

Di Tutorial Sebelumnya Saya sebenarnya sudah Menjelaskan Mengenai Cara Membuat Tukeran / Excange Link Banner Di Blog, Nah untuk Membuat htmlnya dalam bentuk Text Bedanya Hanya Mengganti dibagian dalamnya , inilah htmlnya

<textarea   rows="3" cols="17" style="width: 252px; height: 83px; color: Black;   background-color: white;" readonly><a href="http://apajaboleh2aja.blogspot.com/" target="_blank" title="APA Blogs"><blink><b><span class="Apple-style-span" style="color: red; font-family: Comic Sans MS;">APA Blogs</span></b></blink></a>

</textarea>

dan cara Pembuatannya lihat di Cara Membuat Tukeran / Excange Link Banner Di Blog
Dengan Keterangan :

http://apajaboleh2aja.blogspot.com/ Ganti Dengan Link Sobat
APA Blogs Ganti Dengan Deskripsi Blog Sobat

Dan Hasilnya Kira-kira begini :

<a href="http://apajaboleh2aja.blogspot.com/" target="_blank" title="APA Blogs"><blink><b><span class="Apple-style-span" style="color: red; font-family: Comic Sans MS;">APA Blogs</span></b></blink></a>

Cara Membuat Tukeran / Excange Link Banner Di Blog

Baiklah Sobat APA blogs , kali ini saya Akan menerangkan sedikit tentang pembuatan kode html untuk Tukeran link. Sebenarnya ada 2 bentuk / jenis yang bisa dibuat untuk tukeran link ini yang yang bentuk text/ Tulisan dan ada dalam bentuk banner baik animasi ataupun tidak, namun kali saya akan memberi cara membuat excange link / Tukeran Link dalam bentuk Banner.

cara membuat :

Masuk Ke Blogger
Pilih Tambah gadget di Sidebar
Masukkan Kode Berikut

<textarea  rows="3" cols="17" style="width: 252px; height: 83px; color: Black;  background-color: white;" readonly>&lt;a href="

http://apajaboleh2aja.blogspot.com/" target="_blank" title="Selalu Belajar dari Kata APA"><img src="http://desmond.imageshack.us/Himg198/scaled.php?server=198&filename=cooltext660736020.png&res=medium" border="0" alt="Selalu Belajar dari Kata APA"></a></textarea>

Dengan Keterangan Sebagai Berikut :

’http://apajaboleh2aja.blogspot.com/’ ganti sesuai dengan alamat blog anda.
’http://desmond.imageshack.us/Himg198/scaled.php?server=198&filename=cooltext660736020.png&res=medium’ gantilah dengan URL Image yang ingin ditampilkan.
’Selalu Belajar Dari kata APA’ gantilah dengan Diskripsi Blog anda.

Dan Hasilnya Kira-kira Begini

<a href="http://apajaboleh2aja.blogspot.com/" target="_blank" title="Selalu Belajar dari Kata APA"><img src="http://desmond.imageshack.us/Himg198/scaled.php?server=198&filename=cooltext660736020.png&res=medium" border="0" alt="Pelajaran Blog Cara Membuat Form Link Exchange/Tukar Link."></a>

Cara Membuat Text Area Dengan Tombol Select / tandai semua All

Di Tutorial Sebelummnya sudah kita Jelaskan tentang text Area dan cara pembuatannya.
Artikel Kali ini saya akan Menjelaskan Cara pembuatan text area dengan Tombol / button Select All

Baca selengkapnya »

Text Area dan cara Pembuatannya

1. Pengertian Text Area
Text area adalah Tempat / area yang digunakan untuk meletakkan tulisan / kata-kata agar lebih teratur, biasanya bagi blogger ini sangat berguna untuk memudahkan pembaca dalam mengocpy paste suatu tulisan

Baca selengkapnya »

Cara Mengendalikan Para Anti Copy Paste Di Blog

Mengendalikan / mengatasi Pada copypaster dengan cara membuat anti copy paste pada artikel. Cara kerja script ini adalah menonaktifkan fungsi blok pada posting sehingga copy paste terhadap blog kita

Baca selengkapnya »

Cara Membuat Profil facebook di blog

Membuat / memasang Profil facebook atau sering juga disebut lencana facebook Merupakan fitur facebook yang memungkinkan pengguna mengintegrasikan halaman profil facebooknya ke blog yang ia kelola.

Baca selengkapnya »

Cara membuat nomor halaman ditambah tombol navigasi next

Wah sudah lumayan lama tidak posting tentang tutorial blog nih, jadi agak kurang update deh blog ini. Setelah dulu saya pernah membahas tentang Mengganti Tulisan Posting Lama Dan Posting Baru Jadi Lebih

Baca selengkapnya »

Cara memasang adf.ly di blog

Bagi yang belum tahu caranya memasang adf.ly di blog ini saya kasih caranya
1.Login ke adf.ly

Baca selengkapnya »

Cara Membuat Like Box (Fans Box) Facebook di Blog

Apakah anda ingin menampilkan seberapa banyak fans blog anda di facebook? Saat ini facebook menyediakan berbagai macam aplikasi dan widget yang dapat anda gunakan di website atau blog anda. Tapi kali ini saya akan membahas bagaimana cara membuat like box (dulu disebut fan box) dan menampilkannya di blog anda.

Baca selengkapnya »

Cara Membuat Menu Tab View Pada Blog

Membuat menu tab view di blog itu sangat diperlukan bagi blogger yang ingin membuat desain blognya terlihat lebih profesional dan hemat ruang.

Baca selengkapnya »

Membuat Blog 3 Kolom di Blogspot

Membuat Blog 3 kolom di blog khusunya di blogger / blogspot,
Dalam Membuat Blog 3 kolom / sidebar sebenarnya sudah tidak asing lagi buat blogger yang sudah mahir dan artikel ini mungkin tidak ada apa-apanya tapi buat blogger yang newbie / pemula seperti saya ini mungkin perlu untuk mengetahuinya.
Bagi anda yang menginginkan Membuat blog 3 kolom tak perlu khawatir, karena template anda yang sekarang bisa anda modifikasi sendiri tanpa harus mengganti-ganti template. Karena penggantian template yang terlalu sering juga bisa membingungkan pengunjung tetap anda (fans) dan juga robot search engine.

Posting kali ini sebenarnya adalah request dari teman blogger beberapa waktu yang lalu yang menginginkan membuat blog 3 kolom. Beberapa template blog mungkin berbeda penamaan css templatenya, namun pada tutorial ini menggunakan template pada umumnya blogger gunakan. Tanpa perlu berbasa-basi, berikut ini cara memodifikasi atau membuat blog di blogspot 3 kolom :

Cara Membuat Blog 3 kolom di Blogspot :

1. Login ke blogger. Masuk ke design, lalu edit html. Jangan lupa backup terlebih dahulu template anda. Kemudian berikan centang pada expand widget template.

2. Tambahkan kode berikut sebelum kode ]]></b:skin>

#main-wrapper {
width: 433px;
padding:15px;
float: right;
display: inline;
word-wrap: break-word;
overflow: hidden;
-moz-border-radius: 5px 5px 5px 5px;
-moz-box-shadow: 0 0 3px #CCCCCC;
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #DDDDDD;
margin: 5px;
}
#sidebar-wrapper {
width: 225px;
float: right;
display: inline;
word-wrap: break-word;
overflow: hidden;
-moz-border-radius: 5px 5px 5px 5px;
-moz-box-shadow: 0 0 3px #CCCCCC;
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #DDDDDD;
margin: 5px;
}
#sidebar-wrapper2 {
width: 225px;
float: left;
display: inline;
word-wrap: break-word;
overflow: hidden;
-moz-border-radius: 5px 5px 5px 5px;
-moz-box-shadow: 0 0 3px #CCCCCC;
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #DDDDDD;
margin: 5px;
}

Jika nama id pada template anda adalah sama, silahkan anda tambahkan saja kode css dibawahnya ke dalam template yang sudah anda punya, pada id yang sama tersebut.

3. Cari kode <div id='content-wrapper'> kemudian letakkan kode <div id='main-wrapper'> sebelum kode akhir div content-wrapper.

4. Setelah kode akhir div dari main-wrapper, copykan kode berikut ini :

<div id='sidebar-wrapper2'>
<b:section class='sidebar' id='sidebar10' preferred='yes'>
<b:widget id='HTML100' locked='false' title='TITLE WIDGET Fans' type='HTML'>
</b:section>
</div>

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar11' preferred='yes'>
<b:widget id='HTML101' locked='false' title='TITLE WIDGET Fans' type='HTML'>
</b:section>
</div>

Sehingga susunan secara garis besar adalah seperti ini :

<div id='content-wrapper'>

<div id='main-wrapper'>
BLOG POST
</div>

<div id='sidebar-wrapper2'>
SIDEBAR KIRI
</div>

<div id='sidebar-wrapper'>
SIDEBAR KIRI
</div>

</div>

5. Selesai. Silahkan anda coba. Untuk kode yang berwarna merah, bisa anda sesuaikan sendiri dengan template anda, seperti warna, dan ukuran lebar template anda.

Cara Membuat Artikel Terkait Bergambar Berjalan Dibawah Postingan

Setelah blogwalking kesana kemari yang bertujuan mencari artikel terkait bergambar dan berjalan tetapi saya tidak menemukan satu pun artikel yang saya cari, walaupun itu ada saya hanya menemukan artikel terebut tetapi setelah disimpan artikel terkait tersebut hasilnya berada di atas postingan tentunya tidak sesuai dengan harapan saya, akhirnya saya pun memutar otak sampai akhirnya saya mendapatkan caranya sendiri langsung saja,
1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Tata Letak.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode <data:post.body/>
6. Setelah menemukannya, langsung saja copy paste kode di bawah ini setelah code <data:post.body/>

<!– Marquee Serbablog Related Posts with Thumbnails Code Start–>
<b:if cond=’data:blog.pageType == "item"’>
<div id=’related-posts’>
<b:loop values=’data:post.labels’ var=’label’>
<b:if cond=’data:label.isLast != "true"’>
</b:if>
<b:if cond=’data:blog.pageType == "item"’>
<script expr:src=’"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=12"’ type=’text/javascript’/></b:if></b:loop>
<h3><b>Related Posts</b></h3>
<marquee align=’center’ behavior=’alternate’ direction=’left’ onmouseout=’this.start()’ onmouseover=’this.stop()’ scrollamount=’2′ width=’100%’>
<script type=’text/javascript’>
var currentposturl="<data:post.url/>";
var maxresults=10;
var relatedpoststitle="";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script></marquee>
</div><div style=’clear:both’/>
</b:if>
<!– Marquee Juniusblog's Related Posts with Thumbnails Code End–>

7. Simpan template dan lihat hasilnya.
Keterangan.
Kita juga dapat menganti beberapa kode css, seperti berikut ini
–> Berarti artikel terkait yang akan kita tampilkan adalah 10
SEMOGA BERHASIL

cara membuat kotak iklan banner di blog

hallo sobat, kali ini saya akan melanjutkan postingan tentang Bisnis Online. Yaitu Cara membuat kotak iklan (Banner Ads). Pemasangan kotak iklan ini bermanfaat jika ada orang yang ingin memasang iklan di blog sobat. Si Advertiser itu akan mengklik iklan ini dan akan dialihkan ke halaman detail tentang pemasangan iklan di blog sobat. Oke deh, cara memasangnya sederhana kok sobat. Lihat di bawah:

Baca selengkapnya »

APA blogs

Cara Disable Klik Kiri (Left Click) Mouse Pada Gambar di Blog

Cara Membuat Facebook LikeBox Popup melayang di Blog er

Ok, Langsung saja dengan Tutorialnya

Membuat Tooltip Berlink Di dalam-nya

Langkah Membuat Coda Bubbles dengan jQuery

Cara membuat Tooltip Gambar dalam link di blog

Cara Membuat Komentar Facebook (FB) di Blog

Cara membuat daftar isi dengan thumbnail

Cara Membuat Random Post Di Blog

Cara Membuat Tukeran / Excange Link Text Di Blog

Cara Membuat Tukeran / Excange Link Banner Di Blog

Cara Membuat Text Area Dengan Tombol Select / tandai semua All

Text Area dan cara Pembuatannya

Cara Mengendalikan Para Anti Copy Paste Di Blog

Cara Membuat Profil facebook di blog

Cara membuat nomor halaman ditambah tombol navigasi next

Cara memasang adf.ly di blog

Cara Membuat Like Box (Fans Box) Facebook di Blog

Cara Membuat Menu Tab View Pada Blog

Membuat Blog 3 Kolom di Blogspot

Cara Membuat Artikel Terkait Bergambar Berjalan Dibawah Postingan

cara membuat kotak iklan banner di blog

Aneh dan Unik

Entri Populer

Random Post

Link shabat

Labels

Blog Archive

Yang Baru Di Post

statistik pengunjung

Total Tayangan Halaman

Followers

Networked & Lencana FB

junba

Feedjit