Showing posts with label Tutorial Blogger. Show all posts
Showing posts with label Tutorial Blogger. Show all posts

Wednesday, January 14, 2015

Cara Membuat Privacy Policy di Blog

Privacy Policy adalah sebuah dokumen hukum yang mengungkapkan beberapa informasi tentang pengelolaan situs atau blog. Privacy Policy ini mutlak dibuat oleh blogger yang ingin terjun kedalam dunia bisnis online, semisal Google Adsense.

Jika Anda jalan-jalan ke blog lain dan menemukan Privacy Policy mereka berbahasa Inggris, itu karena jasa pembuatan ini lebih banyak mengutamakan bahasa Inggris. Walau begitu Anda tetap bisa merubahnya kedalam bahasa Indonesia, jika dirasa perlu.

Privacy Policy sebenarnya bisa Anda buat sendiri, sesuai dengan kata-kata Anda sendiri, namun karena ketentuan baku dari berbagai pihak, sehingga banyak layanan yang menyediakan pembuatan Privacy Policy secara online dan gratis.

Adapun cara untuk membuat Privacy Policy ikuti langkah-langkahnya berikut ini :
  • Ada banyak situs penyedia pembuatan Privacy Policy, namun kali ini kita akan membuat dari situs Privacy Policy Online. Klik saja linknya dan masuk ke halaman tersebut. 
  • Pada halaman depan, terdapat sebuah form yang harus Anda diisi. Isi semua yang dibutuhkan. Pada kolom Your Site Title isi  dengan nama blog Anda, lalu alamat blog Anda dibawahnya. Pada kolom contact link, masukkan halaman Contact Us yang telah Anda buat, lalu terakhir email Anda. Setelahnya dibagian Advertisers pilihlah layanan iklan yang Anda (akan) ikuti lalu, klik Generate Policy atau klik Generate HTML (untuk mendapatkan kode HTML yang kemudian dipasang di blog Anda). Lihat gambar berikut :

tampilan form privacy policy yang harus diisi

  • Jika Anda mengklik Generate Policy akan muncul jendela baru pada browser Anda, itu adalah Privacy Policy Anda, bisa Anda copy langsung, namun lebih baik mengcopynya dalam bentuk HTML agar semua element tercover. Lihat dibagian bawah terdapat tombol Generate HTML for this page. Copy dan paste di blog Anda. 

HTML kode ini di paste di new page

  • Untuk memasangnya diblog, buatlah Laman baru. Caranya seperti biasa. Masuk ke blogspot, pilih Laman lalu Laman Baru. Pada kanvas, rubah mode Compose menjadi HTML lalu paste script tadi kedalamnya. Beri judul Privacy Policy dan publikasikan. 

tampilan format HTML pada new page

Kini Anda sudah memiliki Privacy Policy. Selamat mencoba dan semoga bermanfaat buat sobat blogger semuanya.

Monday, June 9, 2014

Cara Memasang Tombol Share Di Bawah Postingan Blog

http://hendrasuhendra176.blogspot.com/2014/06/cara-memasang-tombol-share-dibawah.html
Gambar : Recapitalmedia.com
Keberadaan tombol share untuk saling membagi artikel atau sharing ke media sosial seperti Facebook, Twitter dan lainnya sangat diperlukan dalam blog maupun website. Banyak dari pembaca yang suka men-sharing apa yang mereka baca di blog kita. Secara otomatis, justru hal ini akan membuat blog Anda semakin dikenal banyak orang melalui artikel yang mereka share.

http://hendrasuhendra176.blogspot.com/2014/06/cara-memasang-tombol-share-dibawah.html
Tombol Share Dibawah Postingan

Tombol share tersebut dapat dipasang di samping blog maupun di bawah postingan artikel Anda. Lalu bagaimana cara memasang tombol share tersebut dibawah postingan pada blog? Saya akan berbagi tutorial bagaimana cara memasang tombol share dibawah postingan blog. Ikuti saja langkah berikut : 

1. Masuk ke akun Blogger Anda DISINI

2. Klik -> Template

3. Klik -> Edit HTML

4. Cari kode <data:post.body/> di template blog Anda

5. Sebaiknya backup dulu template blog Anda

6. Copy kode script dibawah ini dan letakkan dibawah kode : <data:post.body/>  

7. Klik -> Save Template

8. Selesai

Biasanya terdapat lebih dari satu kode <data:post.body/> pada template blog. Anda dapat mencobanya pada kode <data:post.body/> yang kedua. Silahkan dicoba. Semoga berhasil.

Artikel yang di sharing ke media sosial Facebook, Twitter, LinkedIn dan lainnya tentu akan berdampak positif pada traffic blog Anda secara tidak langsung. Sehingga bukan tidak mungkin akan menaikkan jumlah pengunjung pada blog Anda.

Nah itu tips bagaimana cara memasang tombol share dibawah postingan pada blog. Semoga bermanfaat.

Cara Mengecek Artikel Yang Di Copy Paste

Gambar : thegnomonworkshop.com

Anda penasaran dengan artikel yang Anda buat, apakah di copy orang lain atau tidak? Disini saya mau share bagaimana caranya supaya mengetahui artikel Anda yang di copy orang lain.



Caranya sangat mudah. Cukup berikan tanda petik "..." diantara kalimat dari artikel Anda.

Perhatikan caranya sebagai berikut :

Saya akan cek salah satu artikel saya yang berjudul Cara Menyimpan File Secara Online berikut.

1. Lalu cari kalimat yang akan di beri tanda petik


2. Copy kalimat yang telah Anda blok tadi

3. Paste-kan di google search

4. Selesai

Nanti akan terlihat dari potongan kalimat tadi. Apakah ada di blog yang lain atau tidak. Kalo ada, berarti artikel Anda sukses di copy. Nah demikian artikel singkat saya kali ini mengenai cara mengetahui artikel yang di copy oleh orang lain.

Selamat mencobanya sobat blogger.

Cara Membuat Next Page Di Blog


cara, memasang, next, page, di, blog, mas, hendra

Untuk mempermudah pembaca blog kita dalam mencari artikel berikutnya, maka sudah seharusnya kita pasang "Next Page" atau halaman berikutnya. Pada artikel kali ini saya akan caranya.


Langkah pertama adalah menentukan jumlah artikel yang akan di tampilkan dalam satu halaman.


1. Masuk ke akun Blogger Anda disini

2. Klik -> Setting

3. Klik ->Posts and Comments
4. Klik -> Pilih jumlah postingan yang akan ditampilkan dalam satu halaman pada blog (lihat gambar)



5. Selesai

Kemudian langkah selanjutnya adalah meng-copy kode script "Next Page".

1. Klik -> Layout

2. Klik -> Add Gaddget

3. Klik -> HTML/JavaScript

4. Copy dan paste kode script berikut :
5. klik -> Save arrangement

6. Selesai

Demikian tutorial blog kali ini mengenai cara memasang next page di blog. Selamat mencobanya sobat blogger.

Monday, May 12, 2014

Cara Mendaftarkan Blog ke Google Webmaster Tool


http://sospiriguana.blogspot.com/2014/05/cara-mendaftarkan-blog-ke-google.html


Siapa yang tidak kenal dengan search engine google, Google merupakan situs yang memiliki pengunjung paling banyak di dunia. Hampir semua informasi yang ada di internet, dapat kita akses dari mesin pencari google ini, memang peran google di internet ini sangatlah penting.

Ketika Anda membutuhkan informasi, maka pasti google yang akan Anda gunakan, mungkin sebagian besar pengunjung blog ini juga berasal dari mesin pencari google. Sebagai mesin search engine paling populer di dunia, mendaftarkan blog Anda ke mesin pencari google adalah hal yang harus Anda lakukan. Tujuan dari mendaftarkan blog ke google adalah untuk menambah blog Anda ke dalam daftar index mesin pencari google. Nah silahkan Anda simak langkah - langkah berikut :

Cara Mendaftarkan Blog ke google

1. Setelah Anda memiliki akun google, silahkan anda klik disini.
Lalu Isikan form login yang tersedia, dengan email dan sandi akun google Anda.

2. Setelah berhasil login, Maka Anda sudah bisa mengakses layanan google webmaster tool.

3. Lalu Klik tombol ADD A SITE untuk menambah blog atau website yang akan Anda daftarkan. (lihat gambar)

http://sospiriguana.blogspot.com/2014/05/cara-mendaftarkan-blog-ke-google.html 

4. Setelah itu masukan url blog / website Anda lalu tekan Continue.

5. Berikutnya lakukan verifikasi kepemilikan website atau blog Anda. klik pada tab alternate methods. (lihat pada gambar) 
 
http://sospiriguana.blogspot.com/2014/05/cara-mendaftarkan-blog-ke-google.html
 
6. Ada tiga pilihan verifikasi yang dapat Anda pilih, jika blog Anda memakai layanan blogger, maka pilih opsi pertama yakni, add meta tag to your site's home page.

7. Silahkan Anda copy meta tag yang telah tersedia. (lihat gambar)

http://sospiriguana.blogspot.com/2014/05/cara-mendaftarkan-blog-ke-google.html
 
8. Setelah Anda mendapatkan meta tag, masuk ke akun blogger Anda, lalu masuk ke menu Rancangan > Edit Html .

9. Berikutnya setelah anda masuk ke menu Edit html, maka Anda akan melihat kode - kode html yang ada di blog Anda. Langkah selanjutnya, Anda tekan ctrl + F pada keyboard komputer Anda.

10. Lalu cari kode </head>.

11. Setelah Anda menemukan kode </head>, silahkan anda pastekan meta tag yang Anda dapatkan tadi, tepat di bawah kode </head>. Lalu klik simpan atau save pada pojok kanan rancangan Html Anda.

12. Langkah terakir adalah, kembali ke halaman google webmaster (tempat Anda mendapatkan meta tag), lalu klik tombol verify. Setelah berhasil, akan tampil informasi bahwa proses verifikasi telah sukses. lalu klik tombol continue.(lihat gambar)

http://sospiriguana.blogspot.com/2014/05/cara-mendaftarkan-blog-ke-google.html

 
Cara Mendaftarkan Blog ke google Webmaster Tool telah selesai. Google webmaster tool bisa Anda gunakan untuk menganalisis berbagai data seputar kunjungan blog Anda secara spesifik dan pastinya gratis. Semoga tutorial ini bermanfaat buat Anda semua.
 
 

Monday, March 25, 2013

Cara Membuat Tulisan Berjalan Di Blog

Cara Membuat Tulisan Berjalan Di Blog - Terkadang kita melihat blog sering dihiasi sebuah teks yang dapat berjalan atau sering disebut teks marque. Teks berjalan tersebut dapat bergerak ke kanan, ke kiri, ke atas maupun ke bawah. Efek tulisan semacam ini bisa dibuat dengan mudah, berikut caranya:

  1. Login dahulu ke Blogger
  2. Kemudian klik Tata Letak dan Elemen Halaman
  3. Ketika sudah berada di Elemen Halaman klik Tambah Gadget
  4. Lalu pilih HTML/JavaScript
  5. Langkah selanjutnya masukkan kode marquee yang anda inginkan seperti contoh dibawah ini :
1.Teks berjalan dari kanan ke kiri
kode :<marquee direction="left" scrollamount="2" align="center">Contoh Tulisan Berjalan</marquee>

2.Teks berjalan dari kiri ke kanan
kode :<marquee direction="right" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
3. Teks berjalan bolak balik
kode :<marquee direction="left" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>

4. Teks berjalan dari atas ke bawah
kode : <marquee direction="down" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>

5. Teks berjalan dari bawah ke atas
kode : <marquee direction="up" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>

6. Teks berjalan mondar-mandir
kode : <marquee direction="up" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>

7. Teks berjalan zig-zag nembus
kode : <center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right"> Contoh Tulisan Berjalan </marquee></marquee></center>

            8. Teks berjalan zig-zag mantul
            kode : <center><marquee direction="up" scrollmount="2" align="center"

            behavior="alternate" width="90%"><marquee direction="right"
            behavior="alternate"> Contoh Tulisan Berjalan </marquee></marquee></center>


Cara Membuat Headline News Versi Berjalan

Jika Anda pernah melihat tayangan berita di televisi, biasanya di bagian bawah layar televisi Anda muncul berita terbaru (headline news) atau informasi yang lain.

Pada kesempatan ini, saya akan berbagi tips cara membuat headline news versi berjalan pada blog seperti yang kita lihat pada tayangan berita di televesi, yang terletak di bagian atas atau bawah blog.

Penasaran cara membuat headline news di blog, berikut langkah-langkahnya :
  1. Login akun blogger 
  2. Pilih Tata Letak ---> Tambah Gadget ---> HTML/JavaScript 
  3. Copy-Paste kode di bawah ini pada HTML/JavaScript
    <script type="text/javascript">
    var hn_url_blog = http://sospiriguana.blogspot.com;
    var hn_jumlah_post = 7;
    var hn_warna_latar = "#EEEEEE";
    var hn_warna_garis = "#000000";
    var hn_posisi = "bottom";
    var hn_tampilkan_judul = true;
    var hn_backlink = true;
    </script>
    <script src="http://blogatap.googlecode.com/files/headline-news.txt">
    </script>
    Keterangan :
    http://sospiriguana.blogspot.com : Ganti alamat URL blog Anda
    7 : Jumlah judul posting yang akan ditampilkan
    #EEEEEE : Warna background headline news
    #000000 : Warna bingkai atau border blog
    Bottom : Posisi headline news, jika diatas ganti “top”
    True : Menampilkan tulisan “Headline news of NAMABLOG”, jika tidak ingin ditampilkan “false” 
  4. Kemudian klik Simpan
Semoga bermanfaat bagi kita semua.

Cara Membuat Komentar Blog Dan Facebook Berdampingan

Cara Membuat Komentar Blog Dan Facebook Berdampingan - Sebelum kita masuk ke cara pembuatannya, saya ingin sekali menyampaikan kepada Anda bahwa, komentar facebook yang kita pasang di blog menggunakan trik ini, juga secara tidak langsung merupakan sarana promosi blog yang kita miliki. Artinya jika pengunjung menggunakan komentar facebook untuk berkomentar maka secara otomatis ada pemberitahuan di wall sipengunjung tersebut bahwa dia berkomentar di blog Anda. Agar lebih jelas, silahkan Anda berkomentar di blog sekitarduniaunik ini dengan menggunakan komentar facebook. Kemudian setelah berkomentar coba Anda lihat diwall facebook Anda, disana akan tertera berupa pemberitahuan bahwa Anda berkomentar di blog sekitarduniaunik ini.

Sekarang bagaimana, tertarik untuk membuat komentar blog dan facebook ke dalam blog Anda ? Jika demikian perhatikan tutorial berikut ini :


1. Login ke account blogger Anda

2. Klik rancangan lalu klik Edit HTML

3. Download template Anda dulu untuk berjaga-jaga jika nanti terjadi kesalahan

4. Beri centang atau ceklis pada kotak kecil yang bertuliskan Expand Template Widget

5. Jika sudah, cari kode  ]]></b:skin>  (gunakan ctrl + f untuk mempermudah pencarian)

6. Kalau sudah dapat maka masukkan kode berikut ini di atas kode ]]></b:skin>



.comments-page { background-color: #f2f2f2;}
#blogger-comments-page { padding: 0px 5px; display: none;}
.comments-tab { float: left; padding: 5px; margin-right: 3px;
cursor: pointer; background-color: #f2f2f2;}
.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}


7. Kemudian Anda cari kode </head>

8. Jika sudah dapat, masukkan kode berikut ini tepat diatas kode </head>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='ID FB Anda disini' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script><span style="font-size: 50%">Widget edited by <a href="http://super-bee.blogspot.com/" target="_blank" rel="follow">super-bee</a></span>



Perhatikan tulisan yang berwarna merah di atas, ganti dengan ID facebook Anda, misalkan https://www.facebook.com/nama Anda maka ID Anda berada pada tulisan yang berwana biru. Namun jika Anda belum merubah ID Anda maka yang tertera adalah berupa angka. Udah ngertikan ? jika sudah maka Akan saya lanjut.

8. Kemudian cari kode  <div class='comments' id='comments'>

Keterangan:  Pada umumnya kode tersebut ada 2, copy dan pastekan kode berikut ini dibawah kode
<div class='comments' id='comments'> yang pertama dan kedua.



<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments
</div><div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>



Perhatikan angka yang berwarna merah dan biru diatas, angka 2 merupakan jumlah komentar yang akan ditampilkan pada komentar facebook. Sedangkan angka 400 merupakan lebar kotak komentar facebook. Anda dapat menyesuaikannya sesuka hati, tapi kalu boleh saya kasih saran, sesuaikanlah dengan lebar template Anda agar kelihatan rapi. Dan perhatikan pula kode yang berwarna merah, jika penempatan kode dibawah <div class='comments' id='comments'> yang kedua terdapat kode yang sama, maka hapus salah satu kode tersebut.

contoh :
<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle("#blogger-comments");' title='Comments from Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments
</div><div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
<div class='comments comments-page' id='blogger-comments-page'> ( hapus salah satu)


9. Kemudian klik save, dan lihat hasilnya.

Jika semua langkah-langkah membuat komentar blog dan facebook berdampingan ini Anda ikuti dengan benar, maka seharusnya Anda berhasil melakukannya. Karena langkah diatas sudah saya lakukan dan berhasil seperti yang Anda lihat milik saya. Namun jika Anda memiliki struktur template yang berbeda, Anda dapat meletakkan kode pada poin no.8 dibawah kode <div class='comments' id='comments'> yang kedua saja.

Cara Membuat Auto Hide (spoiler) Di Blog

Cara Membuat Auto Hide (Spoiler) Di Blog - Berhubung ada sebuah pertanyaan tentang bagaimana cara membuat spoiler di blog seperti dalam postingan blog, maka kali ini saya akan mensharenya.  Spoiler atau AutoHide sering kita jumpai jika Anda sering berkunjung di situs-situs forum seperti kaskus yang membuat AutoHide untuk memaksimalkan ruang postingan jika terdapat tulisan, foto, link yang banyak demi menghemat tempat. Atau biasanya ada juga blogger yang jahil dengan bermaksud untuk membuat pembaca menjadi penasaran akan isinya. 

Cara Membuat Spoiler di Postingan Blog sendiri sangat mudah sekali. Yang perlu kita lakukan hanya memasang kode script pada postingan yang ingin dipasang AutoHide. Dari pada penasaran baiknya kita langsung praktekan saja dibawah ini, sebelumnya berikut contoh Spoiler (Buka Tutup) yang saya terapkan pada beberapa tulisan di blog ini :

Berikut caranya :
1. Seperti biasa Login ke akun anda masing-masing
2. Buat Entri Baru/New Post = Membuat postingan
3. Jika sudah, pada menu Entri, Pilih mode penulisan HTML (Bukan Compose) jika ingin menerapkan Spoiler/AutoHide. Jika dipasang pada Mode Compose maka tidak akan berfungsi code scriptnya.
4. Lalu copy dan paste Script dibawah ini pada postingan yang akan dipasang autohide :
<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</b>: <input value="Buka" style="margin: 0px; padding: 0px; width: 55px; 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
Letakkan teks atau kode script (gambar atau video), link di sini 
 <br>
</div>
</div>
</div>
5. Kita dapat merubah Judul Spoiler, Buka, Tutup dengan bahasa kita masing2, dan Letakkan Teks, gambar, video, kode2 script, atau link yang ingin dimasukkan didalam Spoiler
6. Publikasikan ! dan lihat hasilnya.

Saturday, March 9, 2013

Cara Membuat Tombol Up Dan Down

http://sospiriguana.blogspot.com





Cara membuat tombol up dan down - Kali ini saya juga akan kembali berbagi tips, tetapi ada sedikit tambahan yaitu adanya tombol back to down. Jadi pengunjung langsung bisa ke bagian paling bawah dan juga ke atas dengan hanya mengklik icon back to top dan back to down seperti yang ada pada blog saya.


Langsung saja pada intinya, setelah anda Login ke blog. Pilih "Opsi lainya">>Template>>Edit HTML>>Lanjutkan.
Seletah itu cari kode
</body>
Setelah kode diatas ditemukan. Copy paste kode dibawah ini tepat diatas kode </body>




<!-- Back To Top-Back To Down -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:15px;' title='Back to Top'><img onclick='MGJS.goTop();return false;' src='http://i1086.photobucket.com/albums/j454/sudirman10/navigate-up-icthoncopy.png'/></a>
<a href='#gotodown' style='display:scroll;position:fixed;top:5px;right:15px;' title='Back to Down'><img onclick='MGJS.goDown();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTMrRMcu57JM9kLZULfLhL7FpmXwsBpaK2XsxGPhGfdMeRRDx9YvzNVxsVZHDoQSmXbzJ5EYnDvPL37QbAwgQ5xBP_y1Z59QIhhQCTtnPlHZCehh3OA_ixeXmXpawiPedWmx4tItqETW8/s1600/navigate-down-icthoncopy.png'/></a>
<a name='gotodown'/>
Setelah itu Save dan lihat hasilnya.
Sekian artikel Cara Membuat Tombol Back To Top dan Back To Down.
Selamat mencoba.

Saturday, March 2, 2013

Cara Membuat Link Warna Warni Di Blog

Cara membuat link warna warni di blog - Anda tentunya pernah melihat link di blog ketika didekati kursor alias di sorot pake kursor linknya berwarna-warni bukan?. Hal seperti itu sebenarnya adalah cara lama tapi mutakhir untuk membuat tampilan blog lebih berwarna seperti pelangi, caranya mudah kok, kita tinggal pasang kode Java Script.

Cara membuat link warna-warni di Blog
- Cara pertama :
  1. Login ke blogger.com
  2. Pilih rancangan>>Edit HTML.
  3. Letakkan script dibawah ini di bawah tag <head> (sebaiknya di bawah <title><data:blog.pageTitle/></title>), yang letaknya ada di barisan awal script agar lebih optimal.
  4. Save dan lihat hasilnya.
<script src='http://misbahudin-dcaesga.googlecode.com/files/rainbowlink.js'/>

- Cara kedua :

  1. Login ke blogger.com
  2. Pilih tata letak
  3. Pilih Add Gadget
  4. Pilih HTML/Java Script
  5. Copy paste script diatas
  6. Save dan lihat hasilnya.

Demikian cara membuat link warna warni di blog. Semoga bermanfaat.

Tuesday, February 26, 2013

Cara Membuat Next Page Di Blog

Cara Membuat Next Page Di Blog - Saya bingung menyebut ini apa namanya...makanya saya sebut saja widget Next Page / Halaman Berikutnya saja ya ...

Nah Cara memasangnya adalah sebagai berikut :
1. Masuk ke Dashbor,
2. klik rancangan.
3. Tambah Gadget
4. Pilih HTML
5. Lalu Masukkan kode :

<style>
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #ccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #ccc;
background-color:#000000;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #ccc;
background: #ccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #ccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#000000;
}

</style>




<script type="text/javascript">

function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

var pageCount=5;
var displayPageNum=6;
var firstPageWord = 'First';
var endPageWord = 'last';
var upPageWord ='Sebelumnya';
var downPageWord ='Berikutnya';


var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
}//end if(post.category){

itemCount++;
}

}else{
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
itemCount++;
}
}

for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}

fFlag++;
}

if(p==(thisNum-1)){
html += '&nbsp;<span class="showpagePoint"><u>'+thisNum+'</u></span>';
}else{
if(p==0){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
}
}

if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1){
if(!isLablePage){
html = '<span class="showpage"></span>'+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea"><span class="showpage"> Jumlah Halaman '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;

}

if(postNum==1) postNum++;
html += '</div>';

if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}
}

}
</script>

<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>

selanjutnya Save, dan simpan dibawah posting.