Cara Membuat Back To Top Dengan Jquery

Kali ini saya akan membahas mengenai Cara Membuat Back To Top Dengan Jquery, Cara Membuat Back To Top Dengan Jquery pada Blogsot. untuk langkahnya anda langsung menuju ke TKP :

Login Ke Blogger
MAsuk ke Rancangan --> Tata Letak --> Add Widget --> Html/Javascript.
Kemudian masukkan kode berikut :

<style type="text/css">
#scrolltotop a
{
display: block;
display: none;
z-index: 999;
opacity: .6;
position: fixed;
top: 100%;
margin-top: -20px;
left: 50%;
margin-left: -150px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
width: 68px;
line-height: 1px;
height: 15px;
padding: 10px 3px;
background-color: #000;
font-size: 12px;
font-weight: bold;
text-align: left;
color: #fff;
}
</style>
<div id="scrolltotop"><a href="#">Scroll to top</a></div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var scroll_timer;
var displayed = false;
var $scrolltotop = $('#scrolltotop a');
var $window = $(window);
var top = $(document.body).children(0).position().top;
$window.scroll(function () {
window.clearTimeout(scroll_timer);
scroll_timer = window.setTimeout(function () {
if($window.scrollTop() <= top)
{
displayed = false;
$scrolltotop.fadeOut(500);
}
else if(displayed == false)
{
displayed = true;
$scrolltotop.stop(true, true).show().click(function () { $scrolltotop.fadeOut(500);
});
}
}, 100);
});
});
</script>

Ganti kode yang berwarna merah sesuai dengan keinginan anda
Kemudian Save.

Dan lihatlah hasilnya, blog anda akan terlihat lebih menarik dan keren dengan Back to top Jquery.

Membuat Spoiler di Blog

Membuat Spoiler di Bloghttp://pbgcheatv1.blogspot.com/ - Layaknya sebuah spoiler yang sering digunakan di dalam sebuah forum, spoiler blog juga sangat dibutuhkan dalam dunia blogging. Dengan membuat spoiler, pemilik blog akan lebih mudah untuk menghemat tempat/area di blog karena konten yang dibuat si pemilik blog yang bisa memakan tempat dapat disembunyikan (gambar, kode, dll). selain itu, membuat spoiler di blog juga ditujukan untuk mengurangi berat blog saat proses loading sebab konten yang ukurannya besar tidak akan ikut di load dan hanya akan tampil setelah tombolspoiler tersebut di klik.

Seperti apa sih spoiler itu ?
Coba liat tampilan spoiler di bawah ini :

Untuk membuat spoiler seperti di atas, maka kita cukup menggunakan kode dibawah ini :

<div>
<div style="margin-bottom: 5px;">
<div class="smallfont" style="margin: 2px;">
<input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 12px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"/>
</div>
<div class="alt2" style="border: 1px inset ; margin: 5px; padding: 1px;">
<div style="display: none;">

Isi Spoiler . . .

</div>
</div>
</div>
</div>

Contoh kode spoiler tersebut adalah contoh kode untuk spoiler yang berisikan teks biasa. Kalo sobat blogger mau memasukkan kode HTML, sobat blogger harus parse dulu kode HTML tersebut agar kodenya tidak langsung bekerja. Buat parse kode HTML bisa diliat Disini

Untuk gambar, cukup ganti tulisan yang berwarna hijau dengan kode <img src="url gambar"> (kode HTML untuk memanggil gambar).

Secara umum kode untuk membuat spoiler di blog sama seperti kode di atas, tapi sobat blogger bisa sedikit modifikasi sehingga hasilnya nanti bisa sesuai keinginan.

Cara Membuat Warna Komentar Admin Berbeda dengan Pengunjung

Cara Membuat komentar admin berbeda dengan pengunjung adalah sebagai berikut :

• Langkah pertama yang harus sobat lakukan adalah Log in ke blogger dan masuk menu Layout kemudian masuk menu Edit HTML
• Jangan Lupa centang "expand widget templates"
  Kemudian pasang kode dibawah ini tepat diatas kode ]]></b:skin

.comment-body-author {
background: #FFFF29; /* Warna Background */
border:1px dotted #FF2929; /*Border*/
margin:0;
padding:0 0 0 20px;
}

• Silahkan Edit Code CSS diatas sesuai kreasi sobat sehingga tampilannya semakin menarik.
• Langkah selanjutnya masih di menu Edit HTML dan tanda "Expand Widget Templates" masih tercentang Kemudian Cari Code dibawah ini,

<dl id='comments-block'>

<b:loop values='data:post.comments' var='comment'>

<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>

<a expr:name='data:comment.anchorName'/>

<b:if cond='data:comment.authorUrl'>

<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>

<b:else/>

<data:comment.author/>

</b:if>

<data:commentPostedByMsg/>

</dt>

<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<p><data:comment.body/></p>
</dd>
<b:else/>

<dd class='comment-body'>

<b:if cond='data:comment.isDeleted'>

<span class='deleted-comment'><data:comment.body/></span>

<b:else/>

<p><data:comment.body/></p>

</b:if>

</dd>

</b:if>

<dd class='comment-footer'>

<span class='comment-timestamp'>

<a expr:href='data:comment.url' title='comment permalink'>

<data:comment.timestamp/>

</a>

<b:include data='comment' name='commentDeleteIcon'/>

</span>

</dd>

</b:loop>

</dl>

• Perhatikan kode yang berwarna ungu itu adalah code yang harus kamu tambahkan diantara kode yang berwarna putih diatas
  Ingat penempatan kode yang berwarna ungu harus benar maka perhatikan kode yang berwarna biru itu adalah tagsnya.
  
  
  Kalau sudah kemudian Simpan dan lihat hasilnya.

Cara Membuka Disable Klik Kanan Pada Blog yang Diproteksi

Cara Membuka Disable Klik Kanan Pada Blog yang Diproteksi - Pastinya sobat kesal dengan blog yang ingin sobat copas tidak bisa mengklik kanan, Nah sebenarnya ada cara mudah untuk membuka disable klik kanan di blog. 

Mendisable klik kanan menggunakan javascript pada browser. Kalau browsernya di disable javascriptnya?

Otomatis fitur disable klik kanan tidak akan bisa digunakan lagi. Nah cara membuka disable klik kanan pada blog yaitu dengan mendisable javascript pada browser sobat. Nah berikut disable javascript untuk membuka disable klik kanan pada blog pada browser - browser tertentu :

Membuka Disable Klik Kanan di Chrome

1. Klik Options > Under the Hood > Content Settings
2. Pilih opsi Do not allow any site to run JavaScript

Membuka Disable Klik Kanan di Mozilla Firefox

1. Klik Alat > Pengaturan > Isi
2. Hapus centang Aktifkan JavaScript

Membuka Disable Klik Kanan di Opera

1. Klik Menu > Settings > Preferences
2. Klik Tab Advanced
3. Di Content hapus centang Enable JavaScript

Hanya 3 browser yang saya tahu, kalau di Internet Explorer atau Safari coba saja cari sendiri untuk disable javascript. Begitulah Cara Membuka Disable Klik Kanan Pada Blog yang Diproteksi, yang intinya hanya disable javascript. Sekian saja postingan saya kali ini semoga bisa bermanfaat,

Cara Membuat Auto Refresh/Reload Otomatis Untuk Blogspot

Cara Membuat Auto Refresh Untuk Blogspot -  Kali ini saya akan posting tentang cara membuat auto refresh untuk blogspot. sobat pasti sudah tahu tentunya apa yang dimaksud dengan auto-refresh, ya betul...

yaitu me-load halaman blog berulang-ulang sesuai dengan waktu yang di tentukan oleh pemilik blog. Tidak usah basa-basi lagi, langsung aja dipraktekan cara membuat auto refresh untuk blogspot.

Cara Membuat Auto Refresh Untuk Blogspot :

1. Login ke Blogger
2. Pilih  Design > Edit HTML
3. Cari kode </head>
4. Letakan kode dibawah ini setelah kode </head>
5. <meta content='200' http-equiv='refresh'/>

Keterangan : Yang berwarna merah berarti blog sobat akan me-refresh setiap 200 detik. Bisa diganti sesuai dengan keinginan sobat. Sekian posting saya kali ini, semoga bermanfaat buat sobat blogger semua.

Cara Membuat Artikel Terkait dengan Gambar

- Artikel Terkait atau related post sangatlah penting dalam sebuah blog yang sangat mengutamakan SEO. Karena dengan adanya artikel terkait, pengunjung tidak akan bosan membaca artikel blog kita. Sehingga Bounce Rate akan semakin kecil. 

Dan kali ini saya akan share bagaimana cara membuat artikel terkaitdengan gambar, Berikut langsung saja kita simak bersama-sama :)

Screenshoot :

Cara Membuat Artikel Terkait dengan Gambar :

1. Login Blogger
2. Masuk Menu Template - Edit HTML - Lanjutkan
3. Centang pada Expand Template Widget
4. Cari kode </head> Gunakan tombol CTRL + F untuk mempermudah pencarian.
5. Lalu Copy kode berikut dan letakan tepat diatas kode </head>

<!--Start Related Posts-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:90%;
min-height:90%;
padding-top:0px;
padding-left:8px;
}
#related-posts h2{
font-size: 1.0em;
font-weight: bold;
color: white;
font-family: Rockwell,Georgia,Serif;
margin-bottom: 0.8em;
margin-top:0em;
padding-bottom:0em;
}
#related-posts a{
color:white;
}
#related-posts a:hover{
color:white;
}
#related-posts a:hover {
background-color:#080;
}
</style>
<script type='text/javascript'>
var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgd-Xl6AO_CkiNAvmfshNbbkbObgUw4tBmnXJfeTS4eG9PJ40CxlNJsFk9vggijOFjH3MCCYXtCbIy7lZJHKJ4_ltFKI167Xzu52JjXYvAz6qQ-8nUkrwa00Ho_3yerzbxcDSwEnGQ1MQCc/s1600/No+Image.jpg&quot;;
var maxresults=6;
var splittercolor=&quot;#000000&quot;;
var relatedpoststitle=&quot;Silahkan Baca Ini Juga:&quot;;
</script>
<script src='http://yourjavascript.com/22811210832/RelatedPoststhumb3.txt.js' type='text/javascript'/>
</b:if>
<!--End Related Post-->

    6. Selanjutnya cari kode berikut ( Jika ada dua kode, pilih bagian yang kedua ) :

<data:post.body/>

    7. Kalau kode diatas sudah ketemu, Sekarang copy'lah script berikut :

<!-- Start Related Posts-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=7&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
</b:if>
<!-- End Related Posts-->

    8. Paste'kan kode script diatas tepat dibawah kode :

<data:post.body/>

    9. Jika sudah, klik Simpan Template.

Catatan :
Berikut ini adalah kode yang bisa sobat ganti sebelum menyimpan template, gantilah tulisan berwarna merah sesuai keinginan sobat.

• Menampilkan jumlah artikel terkait yang muncul max-results=7
• Judul artikel terkait var relatedpoststitle=&quot;Silahkan Baca Ini Juga:&quot;;
• Warna Tulisan var splittercolor=&quot;#000000&quot;;

Ok, Sekian saja postingan saya kali ini tentang Cara Membuat Artikel Terkait dengan Gambar, semoga dapat bermanfaat.

Cara Memasang Tombol Like di Setiap Postingan

Tombol Like langsung terhubung dengan jejaring sosial Facebook, sehingga apabila da seseorang yang mengklik tombol like maka secara otomatis postingan diblog kita ajan tershare ke beranda orang tersebut. 

Like Button

Dengan kata lain Tombol Like adalah cara alternatif untuk mempromosikan blog kita ke khalayak ramai. Jika sobat tertarik untuk memasang tombol like, caranya cukup mudah kok. Sobat hanya perlu mengikuti tahap-tahapnya yang akan saya share kali ini.

Screenshoot :

Cara Memasang Tombol Like di Setiap Postingan :

1. Login Blogger
2. Masuk ke Menu Template - Edit HTML - Lanjutkan
3. Beri Tanda Centang Expand Template Widget
4. Cari Kode :

<data:post.body/>

     5. Letakan kode berikut tepat dibawah kode <data:post.body/>

<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=tahoma&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:310px; height:31px;'/>

     6. Simpan Template.

Catatan :
Jika dalam pencarian kode <data:post.body/> sobat menemukan lebih dari 1 kode, maka pilih saja kode yang kedua.

Sekian saja postingan saya tentang Cara Memasang Tombol Like di Setiap Postingan, semoga dapat bermanfaat bagi sobat :)

[July 17,2013]Fresh nod32 keys

Username:TRIAL-0091704268
nod32key:2s7pbdf9dk
Username:TRIAL-0091704273
nod32key:hes3caah32
Username:TRIAL-0091704275
nod32key:rpatc64fa4
Username:TRIAL-0091704279
nod32key:curs6fe8sr
Username:TRIAL-0091704282
nod32key:ec3hp7rca6
Username:TRIAL-0091704287
nod32key:sdfstnt5v4
Username:TRIAL-0091704290
nod32key:xdvhksvkm6
Username:TRIAL-0091704294
nod32key:e6xfexvcnt
Username:TRIAL-0091704300
nod32key:ph35r8n7n7
Username:TRIAL-0091705017
nod32key:sbhpfdmkdh
Username:TRIAL-0091705035
nod32key:hvxsh46kjx

cara membuat likebox fanspage facebook melayang pada blog

setelah posting sebelumnya saya share tutorial cara membuat fanspage facebook blog, kali ini saya juga akan share tutorial yang sama mengenai cara membuat fanspage pada blog, tapi tampilan dari fanspage berikut berbeda karena tampilannya buka muncul bukan berdiam tapi pada tutorial kali ini saya akan menshare caranya yang melayang, bila anda penasaran seperti apa sih contohnya, silahkan anda liat gambar yang ada di sebelah

ok dari pada baca tulisan saya yang ga bermutu mending ke tutorial mengenai cara membuat likebox fanspage facebook melayang pada blog :


pertama yang harus sobat lakukan pasti login dulu ke blogger
setelah itu masuk ke bagian template anda dan jangan lupa untuk mencentang "Expand Template Widget"
setelah itu cari kode </head> ( gunakan F3 untuk mempercepat pencarian )
Setelah ketemu, letakan kode dibawah ini tepat di atas kode </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

 kalau sudah, klik SAVE.


langkah selanjutnya adalah memasang widget tersebut agar muncul diblog sobat, sekarang sobat masuk dimana sobat menambahkan widget, setelah itu pilih add gadget/tambah gadget.
setelah itu masukan kode dibawah ini

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=URL FANS PAGE FACEBOOK ANDA &amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=330" scrolling="no" frameborder="0" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span><a href=" http://pbgcheatv1.blogspot.com/2013/07/cara-membuat-likebox-fanspage-facebook.html "><b>Get Widget</b></a></span></div></div>

ya seperti itulah kalau ada yang bingung silahkan anda tanyakan disini, ya cukup sudah tutorial mengenai cara membuat likebox fanspage facebook melayang pada blogx yang sangat aneh dan simple tapi moga bermanfaat terima kasih, owh iya jangan lupa untuk meninggalkan komentar

[July 15,2013]Fresh nod32 keys

Username:TRIAL-0091586835
nod32key:xudp4vamnu
Username:TRIAL-0091586838
nod32key:mtcdaf53p4
Username:TRIAL-0091586840
nod32key:uppje8ftrc
Username:TRIAL-0091586843
nod32key:fc2tavb63c
Username:TRIAL-0091586846
nod32key:8bvh5349ta
Username:TRIAL-0091586848
nod32key:5nbr8s5f9h
Username:TRIAL-0091586852
nod32key:c3r962hs43
Username:TRIAL-0091586855
nod32key:c6mtmd4a8n
Username:TRIAL-0091586857
nod32key:f7uumtckch
Username:TRIAL-0091586858
nod32key:3jstk65ura
Username:TRIAL-0091586863
nod32key:aran8kk7a9

Trik Jitu Membuat Postingan Blog Ke Facebook Tanpa Plugin

Setelah kesana kemari nyari cara gimana caranya supaya postingan kita dari blog bisa langsung ke posting di wall Facebook kita tanpa menggunakan plugin akhirnya membuahkan hasil juga. Untuk trik ini memang ada beragam cara yang biasa digunakan, ada sebagian yang menggunakan plugin blog terutama untuk blog dengan cms WordPress, dan ada juga yang memakai API.

Namun, kali ini Trik Jitu Membuat Postingan Blog Ke Facebook Tanpa Plugin akan mencoba memanfaatkan Aplikasi yang sudah ada di Facebook. Bagaimana Caranya? Caranya sangat mudah, hanya tinggal ikuti aja step by step pasti tak akan sesulit mengangkat langit, namun jika hanya dibaca aja pasti juga akan menjadi tak semudah membalik telapak tangan. Hehehe, itulah dunia IM 3P wajib dijalankan. Apa itu 3P? Praktek – praktek dan Praktek. Jangan mikir kelamaan, gak bisa ada mbah yang selalu setia menemani, siapa mbah itu? Mbah Google dong… Okeh, daripada kesana kemari langsung aja ke Te Ka Pe aja ya.

Berikut langkah-langkah Trik Jitu Membuat Postingan Blog Ke Facebook Tanpa Plugin :

1. Karena kita menggunakan Facebook, silahkan teman2 masuk ke akun Facebook dulu setelah itu ketikkan di kotak pencarian “ rss graffiti” sampai muncul seperti gambar dibawah Klik yang saya kasih lingkaran.

2. Kemudian akan dibawa kehalaman berikut :

 Silahkan Klik Tombol “Ke Aplikasi” yang diberi Lingkaran Merah.

 3. Kemudian Klik “Izinkan”

4.  Klik “Add New Publishing Plan”

5. Seperti petunjuk tanda panah pada gambar dibawah, pada tahap pertama isikan nama website/blog kita kekolom tersebut , kali ini saya coba masukkan http://pbgcheatv1.blogspot.com/ kemudian klik tombol “Create Publishing Plan”

6. Kemudian anda akan dibawa kehalaman seperti gambar dibawah. Pada gambar tersebut kita temukan 2 kolom dimana kolom pertama adalah “Source” dan Kolom kedua adalah “Target”. Langkah berikutnya adalah silahkan klik “Add New” pada kolom pertama “Source”

7. Isilah kolom yang diberi tanda panah petunjuk nomor 1 dengan namadomain atau blog diikuti dengan feed seperti gambar dibawah, kemudian klik tombol “Add Source”. Source ini lah yang berfungsi sebagai langganan postingan blog, yang nantinya akan mengaitkan artikel yang sudah dipublish ke Facebook.

8. Isilah Source sesuai kebutuhan kita. Kalo mau dicontoh juga boleh.

Feed Title di sini di isi dengan Judul Blog atau Nama Fan Page Facebok Anda dan bisa juga diisi dengan Facebook Profil. Saya sarankan, disesuaikan dengan nama Fan Page Facebook Anda, untuk memudahkan dalam mengingat. Misal; Plaza Rejo

Feed URL. Kotak ini di isi dengan url blog Anda ditambahkan dengan kata feed. Contoh; http://www.plazarejo.com/feed

Source Name Override. Kotak ini di isi dengan nama Fan Page Anda.

Sourve URL  Override, diisi dengan url blog Anda.

Hal lain yang perlu diperhatikan adalah penjadwalan publish. Bisa dilihat masing-masing pada pengaturannya. Semua penjadualan publish bisa disesuaikan dengan keinginan Anda. Kemudian klik Save.

9. Setelah Source sudah beres berlanjut ke kolom berikutnya yaitu target :

Klik “Add New” pada kolom Target yang diberi tanda angka 2.

Kemudian seperti gambar dibawah, pada petunjuk angka satu silahkan pilih Facebook yang akan digunakan. Biasanya akan muncul beberapa pilihan seperti Facebook profil, Group maupun Fanspage anda. Pilih salah satu saja setelah itu klik “Save Changes”

10. Nah, sampai tahap ini source rss dan target untuk publish facebook sudah terisi. Sekarang yang perlu Anda perhatikan adalah tombol OFF yang saya lingkari merah. Tombol tersebut bisa Anda klik, sehingga menjadi ON.

11. ketika tombol ON menyala hijau, berarti menandakan kalau posting secara otomatis dari blog ke facebook sudah berhasil.

Nah, sangat mudah bukan kalo mengikuti step by step Trik Jitu Membuat Postingan Blog Ke Facebook Tanpa Plugin. Hal ini bisa anda kreasikan lagi misalnya mau membuat fanspage model Set and Forget dan tentunya akan terus ter update secara otomatis. Gimana, enak bukan? Kalo kita jeli bisa oke lho…

Jika dirasa bermanfaat silahkan bagi keteman ya!! Klo ada yang kurang, ditunggu masukannya.

Terimakasih