Cara Membuat Daftar Isi Blog Otomatis Berdasarkan Label

Daftar Isi atau yang sering kita sebut Sitemap pada umumnya kita gunakan sebagai petunjuk atau informasi sudah berapa banyak artikel yang selama ini sudah kita buat di dalam blog kita. Kadang kita merasa malas apabila kita harus membuat dan mengisi daftar isi tersebut secara manual setiap kali kita selesai meng update artikel. Maka dari itu kali ini saya akan berbagi informasi tentang bagaimana cara membuat daftar isi atau sitemap berdasarkan label secara otomatis mengisi sendiri setiap kita selesai membuat artikel. Berikut tutorialnya.

Pertama masuk dahulu ke dalam akun Blogger anda. Buka menu Posting atau Posts kemudian kita klik Entri Baru atau New Post. Setelah masuk ke dalam halaman editor posting pilih dalam mode HTML bukan Compose. Lalu copy paste kan kode di bawah ini ke dalam halaman editor posting :

<script src="http://sitemap-kiosbisnis.googlecode.com/files/KiosBisnislabel2.js"></script><script src="http://www.kiosbisnis.com/feeds/posts/default?max-results=999&amp;alt=json-in-script&amp;callback=loadtoc"></script>

Ganti text yang berwarna merah diatas dengan alamat blog anda. Simpan dan Lihat hasilnya. Berikut contoh tampilan daftar isi berdasarkan label dari blog KiosBisnis.com.

Namun misal anda menginginkan menggunakan fungsi scroll karena daftar isi dirasa sudah terlalu banyak dan terlalu banyak memakan tempat (memanjang ke bawah) maka bisa menambahkan kode berwarna biru di bawah ini.

<div style="overflow:auto; border: 1px solid #000000; margin: auto; padding: 3px; width: 100%; height: 500px; background-color: none; text-align: left;"> <script src="http://sitemap-kiosbisnis.googlecode.com/files/KiosBisnislabel2.js"></script><script src="http://www.kiosbisnis.com/feeds/posts/default?max-results=999&amp;alt=json-in-script&amp;callback=loadtoc"></script></div>

Jangan lupa untuk mengganti teks berwarna merah dengan alamat blog anda. Simpan dan Lihat hasilnya. Berikut contoh tampilan daftar isi berdasarkan label menggunakan fungsi scroll dari blog KiosBisnis.com.

Selamat mencoba dan Semoga Bermanfaat. 

 

Sumber : http://www.kiosbisnis.com/2012/06/cara-membuat-daftar-isi-blog-otomatis.html

Cara membuat Related Post

Cara membuat Related Post
Related Post atau yang biasa disebut posting terkait atau artikel terkait sangat besar manfaatnya untuk blog kita,terlebih utama sangat besar manfaatnya untuk para pengunjung karena Artikel yang besangkutan dengan apa yang pengunjung baca ada pada menu Related post ini, dan biasanya Artikel terkait ini di letakan di bagian bawah artikel guna memberitahu pengunjung bahwa artikel yang sama yg sedang di baca ada di bawahnya.
Related Post ini seperti menu navigasi pada sidebar blog, hanya saja menu related post ini terisi secara otomatis berdasarkan Label pada masing-masing artikel.
Misalkan article yang sedang di baca pengunjung tentang ''Cara sukses berbisnis online dengan Blog'' yang di beri Label ''BISNIS ONLINE'', maka artikel terkait secara otomatis akan menampilkan Artikel-artikel yang lainnya tentang BISNIS ONLINE.
Contoh Related Post atau Posting Terkait bisa di lihat pada Blogtegal ini di bagian bawah artikel yang sedang kamu baca ini. BAGAIMANA CARA MEMBUAT RELATED POST INI? Mari kita lakukan penelitian membuat artikel terkait.

• Login ke dashboard blogspot kamu.
  
• pilih Rancangan »» Edit HTML
  
• download template lengkap dulu untuk jaga-jaga kalau ada kesalahan.
  
• Beri tanda centang pada Expand Widget Template.
  
• tempatkan script berikut di bawah kode <data:post.body/>
  

  <b:if cond='data:blog.pageType == &quot;item&quot;'>
  <div class='similiar'>
  <div class='widget-content'>
  <h3>Related Posts by Categories</h3> <div id='data2007'/>
  
  <script type='text/javascript'> var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;; var maxNumberOfPostsPerLabel = 4; var maxNumberOfLabels = 10; maxNumberOfPostsPerLabel = 100; maxNumberOfLabels = 3; function listEntries10(json) { var ul = document.createElement(&#39;ul&#39;); var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ? json.feed.entry.length : maxNumberOfPostsPerLabel; for (var i = 0; i &lt; maxPosts; i++) { var entry = json.feed.entry[i]; var alturl; for (var k = 0; k &lt; entry.link.length; k++) { if (entry.link[k].rel == &#39;alternate&#39;) { alturl = entry.link[k].href; break; } } var li = document.createElement(&#39;li&#39;); var a = document.createElement(&#39;a&#39;); a.href = alturl; if(a.href!=location.href) { var txt = document.createTextNode(entry.title.$t); a.appendChild(txt); li.appendChild(a); ul.appendChild(li); } } for (var l = 0; l &lt; json.feed.link.length; l++) { if (json.feed.link[l].rel == &#39;alternate&#39;) { var raw = json.feed.link[l].href; var label = raw.substr(homeUrl3.length+13); var k; for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;); var txt = document.createTextNode(label); var h = document.createElement(&#39;b&#39;); h.appendChild(txt); var div1 = document.createElement(&#39;div&#39;); div1.appendChild(h); div1.appendChild(ul); document.getElementById(&#39;data2007&#39;).appendChild(div1); } } } function search10(query, label) { var script = document.createElement(&#39;script&#39;); script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39; + label + &#39;?alt=json-in-script&amp;callback=listEntries10&#39;); script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;); document.documentElement.firstChild.appendChild(script); } var labelArray = new Array(); var numLabel = 0; <b:loop values='data:posts' var='post'> <b:loop values='data:post.labels' var='label'> textLabel = &quot;<data:label.name/>&quot;; var test = 0; for (var i = 0; i &lt; labelArray.length; i++) if (labelArray[i] == textLabel) test = 1; if (test == 0) { labelArray.push(textLabel); var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ? labelArray.length : maxNumberOfLabels; if (numLabel &lt; maxLabels) { search10(homeUrl3, textLabel); numLabel++; } } </b:loop> </b:loop> </script> </div> </div> </b:if>

• yang terakhir klik SIMPAN

CATATAN!!:

• Jika kamu sudah memasang 'Readmore Otomatis' maka kamu harus menempatkan script related post di bawah kode
  <data:post.body/>
  </b:if>
  
• Jika kamu memasang iklan di bawah posting, maka tempatkan script related post di bawah kode iklan tersebut.

Sumber : http://www.blogtegal.com/2011/02/cara-membuat-related-post.html

Membuat Postingan Selalu Berada Paling Atas

Tips Membuat Postingan Selalu Berada Paling Atas : Pernahkah kita berangan-berangan atau berpikiran ingin menjadikan postingan tertentu selalu berada di atas? Jika, ya, jangan kuatir, karena kita dapat “mengakalinya” dengan trik yang akan kita bahas berikut ini. Dengan trik tersebut, kita dapat menempatkan postingan tertentu (yang kita anggap sangat penting) akan selalu berada di atas dari postingan-postingan yang lain yang kita terbitkan sesudahnya. Jika tertarik, silakan ikuti tipsnya bersama Tips dan Trik Blog berikut ini.

Langkah-langkahnya, seperti di bawah ini.

Pertama, login ke account blogger >> Dasbor >> Entri Baru

Kedua, buatlah postingan yang ingin kita tempatkan di posisi paling atas.

Ketiga, kemudian terbitkan postingan tersebut seperti biasa.

Keempat, kemudian lakukan edit entri atas postingan yang baru saja kita terbitkan tersebut.

Kelima, setelah terbuka post editor kemudian menujulah ke bagian kiri bawah, klik “opsi entri” (post option) hingga akan muncul beberapa opsi, yaitu “komentar pembaca”, “Link balik”, dan “tanggal dan jam entri”, seperti screenshot di bawah ini.

Keenam, kemudian pada opsi “tanggal dan jam entri”, gantilah tahunnya menjadi tahun yang akan datang, misalkan saja menjadi tahun 2020.

Ketujuh, kemudian terbitkan lagi postingan tersebut.

Kedelapan, selesai

Sekarang, cobalah untuk membuat dua atau beberapa postingan lagi dan pastikan postingan yang telah kita ubah tahunnya menjadi 2020 tersebut selalu berada di posisi paling atas.

Catatan

Misalkan sudah sampai tahun yang kita isikan (yaitu tahun 2020), maka kita harus mengubah nya lagi menjadi tahun yang akan datang, misalnya 2030 atau 2040.

Selamat Mencoba!!

Sumber : http://tips-trik-blog.blogspot.com/2009/06/membuat-postingan-selalu-berada-paling.html

Cara Membuat Smooth Back To Top dengan jQuery

Oleh N Muhammad Hafiz jam Jumat, Mei 04, 2012.

Scroll to top, Istilah lain dalam blogger yang artinya sama dengan Back to Top yaitu, Sebuah Link yang menuju ke bagian atas halaman atau blog atau website. dan di kesempatan kali ini saya akan memberikan sebuah tutorial tentang membuat Smooth Back to top atau Scroll to top dengan menggunakan jQuery. seperti yang kita ketahui, jika kita membuat back to top dengan kode HTML biasa, seperti contoh, Klik disini jika ingin melihat hasil back top top biasa. dan bedakan dengan back to top yang akan kita buat nanti.

Langkahnya sangat mudah,
1. Masuk ke blogger, Rancangan, Edit HTML Template.
2. Cari kode </head>
3. Paste Kode berikut tepat diatasnya

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

<script src='//myhavies.jw.lt/js/ke_atas.js' type='text/javascript'/>

4. Cek, apakah kode yang berwarna merah ada dalam template sobat, jika ada tidak perlu ditambahkan lagi kode berwarna merah tersebut.
5. Simpan Template, dan lihat hasilnya
Bedakan hasilnya?....

Hasil : Lihat di pojok kanan bawah blog ini untuk hasilnya...
 Back to top biasa

Cara Membuat Smooth Back To Top dengan jQuery
Oleh haviedzs pada Mei 2012.
Cara Mudah Membuat Smooth Back to Top dengan jQuery di Blogger
Rating: 4

 

Sumber : http://myhavies.blogspot.com/2012/05/smooth-back-to-top-jquery.html

Cara Membuat Menu Drop Down Di Atas Header Atau Di Bawah Header

 

Salam blogger, Kali ini saya sedikit berbagi tentang Cara Membuat Menu Drop Down Di Atas Header Atau Di Bawah Header yang telah di request oleh sahaba-sahabat Zuaz'Z Creator pada halaman Facebook.

Menu drop down dapat kita pasang di atas maupun di bawah nama blog, dengan memasang menu semacam ini tampilan blog kita semakin tampak bagus dan pastinya akan mempermudah pengunjung untuk mencari apa yang dibutuhkan dari blog kita. 

Untuk demonya silakan sobat blogger klik link berikut ini DEMO . Bagi sobat blogger yang berminat memasang menu semacam ini silakan ikutu langkah-langkah berikut ini:

Cara Membuat Menu Drop Down Di Atas Header Atau Di Bawah Header:

1. Seperti biasa sobat harus login dulu di akun blog sobat
2. Pilih rancangan / desing dan klik edit HTML dan lanjutkan
3. Centang "Expand Template Widget" untuk menghindari apabila terjadi kesalahan
4. Sobat cari kode ]]></b:skin> dan letakkan kode berikut tepat di atas kode ]]></b:skin>

Klik show untuk melihat 

/* Menu Horizontal Dropdown ----------------------------------------------- */ #menuwrapperpic{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsU29iYyBtJib7PUcvDI3ykp3rbRlZHg8xyQn4SBb-eOBGjc8CbfUk_-rNeQXw5fqV2wYymh5kf6vJyb1NTUiaYSKcf9CwYma3zoekSv7RoXh4RW2tVlkhGcKgVEcQr-3yCpxqJpYpuqE/s1600/menubar.png) repeat-x;width:960px;margin:0 auto;padding:0 auto} #menuwrapper{width:960px;height:35px;margin:0 auto} .menusearch{width:300px;float:right;margin:0 auto;padding:0 auto} .clearit{clear:both;height:0;line-height:0.0;font-size:0} #menubar{width:100%} #menubar,#menubar ul{list-style:none;font-family:Arial, serif;margin:0;padding:0} #menubar a{display:block;text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase;color:#CECECF;border-right:1px solid #191919;padding:12px 10px 8px} #menubar a.trigger{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCOA9bySFMzE0TMzPgui5aGc8BISfBQ4B44_yEaUfAR3TGVvBe0-VssVAraHi1OuIqNUjRm4XI0XKQAHt5Xw8TlumPUIbjZkmA8tqjrFIuXg9orGs5H6QXpy_mOll-vhg0ntujbNkJBhE/s1600/arrow_white.gif);background-repeat:no-repeat;background-position:right center;padding:12px 24px 8px 10px} #menubar li{float:left;position:static;width:auto} #menubar li ul,#menubar ul li{width:170px} #menubar ul li a{text-align:left;color:#fff;font-size:12px;font-weight:400;text-transform:none;font-family:Arial;border:none;padding:5px 10px} #menubar li ul{z-index:100;position:absolute;display:none;background:#222;padding-bottom:5px;-moz-box-shadow:0 2px 2px rgba(0,0,0,0.6);-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.6)} #menubar li:hover a,#menubar a:active,#menubar a:focus,#menubar li.hvr a{background-color:#222;color:#E98C0A} #menubar li:hover ul,#menubar li.hvr ul{display:block} #menubar li:hover ul a,#menubar li.hvr ul a{color:#edfdfd;background-color:transparent;text-decoration:none} #menubar li ul li.hr{border-bottom:1px solid #444;border-top:1px solid #000;display:block;font-size:1px;height:0;line-height:0;margin:4px 0} #menubar ul a:hover{background-color:#555!important;color:#fff!important;text-decoration:none}

Selanjutnya sobat blogger cari kode berikut:

• <header>  : untuk menempatkan menu di atas nama blog
• </header> : untuk menempatkan menu di bawah nama blog

Copy kode di bawah ini dan letakkan tepat di atas kode <header> atau di bawah kode </header>

Klik show untuk melihat 

<div id='menuwrapperpic'>
<div id='menuwrapper'>
<ul id='menubar'>
<li><a href='/'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic8fL9IJAWid8wrRHyloxa8aN_u7LjcqLO3KWjqjJ5cCLXmzIpEj_odt74gbrWJni3od5TgcePyigSWajNlvuL1LfuD-KOPO4hlRp4zjHTYh5OaukMEfVIO0szqXbLvZPC_H1LTk9V3WE/s1600/home_white.png' style='padding:0px;'/>Home</a></li>
<li><a href='http://www.blogger.com/profile/06961337061354681028' target='new'>Tentang Admin</a></li>
<li><a class='trigger'>Contact Us</a>
<ul>
<li><a href='https://plus.google.com/u/0/106997202037581570725' target='new'>Goggle +</a></li>
<li class='hr'/>
<li><a href='http://twitter.com/den_zuaz' target='new'>Contact on Twitter</a></li>
<li><a href='http://www.myspace.com/denzuaz' target='new'>Contact on Myspace</a></li>
<li><a href='http://www.facebook.com/zuazTama' target='new'>Zuaz&#39;Z on Facebook</a></li>
</ul>
</li>
<li><a href='http://zuazz.blogspot.com' target='new'>Zuaz&#39;Z Creator</a></li>
<li><a class='trigger'>Tips dan Trik</a>
<ul>
<li><a href='http://zuazz.blogspot.com/search/label/tips%20dan%20trik%20komputer'>Komputer</a></li>
<li class='hr'/>
<li><a href='http://zuazz.blogspot.com/search/label/tips%20dan%20trik%20blog'>Blogspot</a></li>
<li class='hr'/>
<li><a href='http://zuazz.blogspot.com/search/label/facebook'>Facebook</a></li>
<li class='hr'/>
</ul>
</li>
<li><a class='trigger'>Kategori</a>
<ul>
<li><a href='http://zuazz.blogspot.com/2012/01/tv-online.html'>TV Online</a></li>
<li class='hr'/>
<li><a href='http://zuazz.blogspot.com/search/label/computer'>Komputer</a></li>
<li class='hr'/>
<li><a href='http://zuazz.blogspot.com/search/label/desain%20grafis'>Desain Grafis</a></li>
<li class='hr'/>
<li><a href='http://zuazz.blogspot.com/search/label/game'>Game</a></li>
<li class='hr'/>
<li><a href='http://zuazz.blogspot.com/search/label/microsoft'>Microsoft</a></li>
<li class='hr'/>
<li><a href='http://zuazz.blogspot.com/search/label/software%20aplikasi'>Software APP</a></li>
<li class='hr'/>
<li><a href='http://zuazz.blogspot.com/search/label/software%20program'>Software Program</a></li>
</ul>
</li>
</ul> <div class='menusearch'>
<div style='float:right;padding:8px 8px 0 0;'>
<form action='http://zuazz.blogspot.com/search' method='get' target=''>
<input name='sitesearch' style='display:none;' value='http://zuazz.blogspot.com'/>
<input id='search-box' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;;' style='width:170px;border:none;padding:4px 10px; font:italic 12px Georgia;color:#666; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbhFh5dIfJxaDLNwuJFHmOkM2I46aemINQX02jzu0Yu8UujKXtSUCWYO9opbr-yNsLAKKiO01ls7o0bxOGMCYRgfAKILBRqjf1gWtAx4dgRQUsrtpZLTtBwFQtomV_02-bcI6MoLGLLFA/s1600/field-bg.gif) no-repeat;' type='text' value='Cari disini ya sob...'/><input align='top' id='search-btn' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxSmLLxo9ZnEHocDcjeD_W0xQOoKwh2PPc604GIsVe2tWK-zat12cu-Pf2B6ynHhwKRX3I8t8dLe2aABUy464InKpVo4R13NtrToJZK51aubfoREEMVAFgQQ30ZkOC58xvxFaKHpfS9Xk/s1600/bg_search.gif' type='image' value='Search'/>
</form></div></div><br class='clearit'/></div><div style='clear:both;'/></div>

Keterangan:

1. Kode berwarna merah adalah Url tujuan, silakan sobat ganti dengan Url pada blog sobat
2. Kode berwarna kuning adalah kalimat yang tampil pada menu dropdown, Silakan sobat sesuaikan.

Demikianlah Cara Membuat Menu Drop Down Di Atas Header Atau Di Bawah Header, semoga bermanfaat bagi sobat blogger.

Selamat mencoba sobat... 

 sumber : http://zuazz.blogspot.com/2012/04/cara-membuat-menu-drop-down-di-atas.html

Cara Membuat Drop Cap pada Postingan Blog

Ada beberapa cara untuk membuat tampilan sebuah postingan terlihat cantik, selain dengan menggunakan optimasi gambar, widget table/ border atau dengan related post bergambar. Salah satu tips yang akan TBP share kali ini adalah CaraMembuat Teks Drop Caps dalam Postingan Blog.

DropCaps adalah sebuah format teks dimana salah satu huruf dibuat lebih besar dan menonjol daripada teks lain dalam sebuah kalimat/ paragraph postingan. Berikut ini adalah salah satu tampilan postingan dengan teks drop caps.


Donkeymails adalah sebuah situs berbasis GPT yang telah berdiri sejak 3 Februari 2005. Selama ini situs ini sudah sangat terkenal sebagai situs yang membayar ( bukan scam ) dan memberikan penghasilan tambahan yang lumayan.



Bagaimana cara membuat format teks Drop Caps dalam sebuah postingan blog. Secara sederhana kodenya untuk teks di atas adalah sebagai berikut :

<span style="float: left; color: black; font-size: 50px; line-height: 30px; padding-top: 5px; padding-right: 5px; font-family: century gothic;">D</span>onkeymails adalah sebuah situs berbasis GPT yang telah berdiri sejak 3 Februari 2005. Selama ini situs ini sudah sangat terkenal sebagai situs yang membayar ( bukan scam ) dan memberikan penghasilan tambahan yang lumayan.

*yang berwarna biru monggo sobat sesuaikan dengan selera sobat :D

Wah cukup sederhana ya sobat?? Bisa langsung praktek dong?? Monggo, sekali- kali kita terapkan caramembuat drop caps dalam postingan lumayan juga buat membuat postingan kita menjadi lebih yahuuddd sobat :D.

Happy Blogging!!

tambahan: yang merah-merah itu ditulisnya di mode html bukan compose.

Sumber : http://blogpemula-tutorial.blogspot.com/2012/07/membuat-drop-cap-postingan-blog.html

Cara Membuat Slideshow Album Picasa di Blog

M

 

Gb.1 Tampilan Slideshow di Blog

empercantik tampilan Blog adalah wajib yang harus dilakukan oleh blogger supaya terkesan menarik oleh pengunjung. Salah satunya adalah membuat Slideshow atau gambar berjalan. Jika anda sudah mempunyai album gambar/foto di Picasa maka bisa langsung dipraktekin di blog anda. Tapi jika belum maka anda buat dulu album di Picasa, biasanya kalau anda sudah punya akun Google maka bisa langsung terintegrasi ke Gmail, Blogger (blogspot), dan juga Picasa. Saya akan uraikan caranya yang mudah dan simpel.




1.  logg in ke http://picasa.google.com/  dengan meng-klick Picasa Web Albums

 

Gb.2 Loggin Picasa

2.  Masukkan akun google dan passwor,tekan enter [sign in]3.  Upload/unggah foto atau klik langsung album di Picasa kalau sudah tersedia
4.  Setelah membuka album, klik Tautkan dengan album ini (link to this album). Liiat gambar,

 

Gb3. Tautan link album

5.  Kemudian klik Sematkan Rangkai (Embed Slideshow), Sebuah konfigurasi slideshow  ditampilkan dan preview akan muncul.

 

Gb.4 Penyematan link

6.  Ubah ukuran slideshow agar sesuai dengan lebar posting blog Anda. Ada juga pilihan untukAutoplay dan  Tampilkan keterangan.

 

Gb.5 Konfigurasi Slideshow

7.  Langkah selanjutnya adalah penyematan Slideshow di Blog, caranya:
     Buka Dasbor > Rancangan/tata letak/layout> tambah gadget> pilih mode HTML/JavaScript

 

 

8.  Copy seluruh kode  di jendela kuning (lihat gambar 5) dan Paste-kan ke dalam konten konfigurasi HTML/Javascrift dan simpan. Judul boleh diisi apa saja, misal: Slideshow album.
9.  Sekarang bisa dilihat hasilnya, Slideshow berjalan otomatis di page blog.
10. Sekian, semoga bermanfaat :)

Sumber : http://arif-muhajirin.blogspot.com/2011/03/cara-membuat-slideshow-album-picasa-di.html

Membuat favicon pada Blog spot

Membuat favicon untuk Blog 

Pertama kita harus mempunyai icon boleh gambar ico, png, atau gif untuk icon bergerak. Kemudian upload gambar kalian ke imagekiss.com karena disana gratis tanpa registrasi loh....

Cara upload gambar ke Imagekiss.com

Ketik imagekiss.com di browser maka akan tampil ssb:

Tekan tombol select picture, maka kalian akan disuruh mencari gambar untuk favicon di komputer. Bila tidak punya googleng aja banyak gmbar gratis disana....hahaha

Setelah memiih gambar tekan tombol upload

 

Setelah proses upload gambar selesai akan tampil gambar kalian, disini contohnya gambar syaringgan... kalo gak tau yang bunder merah ada bintik-bintik hitam tiga itu loh...

Setelah itu perhatika dibawah, itu adalah link gambar kalian...

Selesai sudah uploadnya sekarang tinggal memasukkan favicon kedalam blog.

Cara memasukkan favicon kedalam blog adalah sebagai berikut

1. Masuklah ke dashbord blog anda
2. Pilih template
3. Klik edit HTML
4. Masukkan kode berikut : <link href=’gambarmu’ rel='icon' type='image/gif'/> dibawah kode <b:include data='blog' name='all-head-content'/>
5. Jangan lupa ganti gambarmu dengan url dari DIRECT LINK gambar yang kamu upload tadi.

Cara Membuat Efek Daun Berjatuhan Di Blog

Cara Membuat Efek Daun Berjatuhan Di Blog – Efek daun berjatuhan di blog sepertinya juga banyak diminati oleh sobat blogger, dan menurut saya efek daun berjatuhan ini loadingnya lebih ringan dan cepat ketimbang efek bintang bertaburan yang saya posting sebelum ini. Trik membuat efek daun berjatuhan ini juga masih menggunakan javascript, cara membuatnya simak lebih lanjut dibawah ini.

Cara Membuat Efek Daun Berjatuhan :

1.       Seperti biasa login dulu ke dashboard blogger anda.

2.       Pilih Rancangan > Edit HTML, centang Expand widget template.

3.       Cari kode </head>  pada template dengan menggunakan Ctrl+F.

4.       Copy kode javascript dibawah ini dan letakkan tepat diatas kode </head> .

<script src='http://arti.master.irhamna.googlepages.com/daun.js'/>

5.       Save / simpan template anda dan lihat hasilnya muantaaap bro !!

Nah itu tadi langkah-langkah bagaimana cara membuat efek daun berjatuhan di blog, cukup mudah bukan ? Jangan lupa daun-daunnya kalo sudah kebanyakan yang jatuh sambil di sapu ya he he…

Sumber : http://www.rayhanzhampiet.com/2011/08/cara-membuat-efek-daun-berjatuhan-di.html

Cara Memasang /Membuat Efek Hujan Salju di Blog Anda

Cara Membuat Efek Hujan Salju di Blog Anda  - Efek hujan salju yang saya posting ini sangat bagus ditampilkan jika blog sobat mempunyai background/latar belakang berwarna gelap atau hitam. Karena kalo efek hujan salju ini dipasang di blog yang background pada bagian posting warna terang atau putih seperti blog saya ini, maka pemasangan efek hujan saljunya jadi sia-sia karena tidak akan terlihat. Apalagi kalo hujan saljunya kecil-kecil kayak hujan gerimis gitu wah tambah ngga keliatan jadinya. Kalau efek hujan daun  berjatuhan yang saya posting sebelum ini karena daunnya berwarna hijau malah lebih terlihat jika backgroundnya putih. Langsung aja nih sobat ikuti langkah pembuatannya disini ya.

Cara membuat/memasang efek hujan salju di blog :

1.    Login ke dashboard blogger anda.

2.    Pilih Rancangan > Elemen Halaman > Add gadget (HTML/JavaScript).

3.    Letakkan script efek hujan salju dibawah ini pada gadget.

<script src='http://hbhost.googlecode.com/files/snow.js' type='text/javascript'> </script>

4.    Simpan dan lihat hasilnya.

Nah hujan saljunya sudah terlihat turun kan he he.., kapan ya kita bisa merasakan musim dingin beneran kayak di Amrik sono ? OK sobat sekian dulu aja tips/trik cara membuat/pasang efek hujan salju pada blog ini. Semoga bermanfaat dan salam blogger.

 

Sumber : www.rayhanzhampiet.com/2011/08/cara-membuatpasang-efek-hujan-salju-di.html

Membuat share artikel melayang (floating button)

Cara Membuat Floating Share Button  - Membuat share artikel melayang (floating button) ini merupakan kelanjutan dari posting saya sebelumnya Cara Memasang Button Share Artikel di Blog. Bedanya kalau tombol share melayang ini hanya untuk berbagi artikel ke 4 layanan social bookmark saja yaitu share artikel ke Facebook, Twitter, Google Buzz dan Google Plus One ( +1 ). Yang penting bisa berbagi artikel postingan lah.

Baik sobat langsung saja nih cara memasang share button melayang di blog :

1.       Login ke dashboard blogger anda.

2.       Pilih Rancangan > Elemen Laman > Add gadget (HTML/JavaScript).

3.       Copy script dibawah ini dan paste kedalam gadget baru tadi.

 

<style>

#pageshare {display:scroll;position:fixed;top:165px;left:30px; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;}

#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}

.fb_share_count_top {width:48px !important;}

.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}

.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}

.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}

</style>

<div id="pageshare" title="Get this code from rayhanzhampiet.blogspot.com">

<div class="sbutton" id="fb">

<a href="http://www.facebook.com/sharer.php" name="fb_share" type="box_count"></a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript">

</script></div>

<div class="sbutton" id="rt">

<script src="http://tweetmeme.com/i/scripts/button.js" type="text/javascript">

</script></div>

<div class="sbutton" id="gb">

<a class="google-buzz-button" data-button-style="normal-count" href="http://www.google.com/buzz/post" title="post on google buzz">

<script src="http://www.google.com/buzz/api/button.js" type="text/javascript">

</script>

</a></div>

<div class="sbutton" id="gplusone">

<script src="http://apis.google.com/js/plusone.js" type="text/javascript">

</script>

<g:plusone size="tall"></g:plusone></div>

</div>

Cukup singkat bukan ternyata cara pasang share artikel melayang di blogspot ini ? Selamat mencoba cara membuat share artikel blog ini dan semoga sobat puas dengan hasilnya.

Sumber : http://www.rayhanzhampiet.com/2011/09/cara-membuat-floating-share-button.html

cara membuat blog spot

www.namadomain.blogspot.com adalah sebuah web blog yang disediakan oleh google secara gratis, seperti halnya buku harian blog dapat kita manfatkan untuk mencurahkan semua isi hati kita *seperti diary  aja hahaha... :D
namun walaupun gratis tak semua orang tau bagaimana cara membuatnya, jadi disini saya mau share bagaimana cara membuat blok mulai dari awal dulu...

Persyaratan utama membuat blog

• memiliki niat, jangan lupa baca bismillah
• mau berpikir sedikit *gak susah kok hahaha....
• suka menulis eh' mengetik artikel buat isi blog, kan aneh kalau blog gak ada isinya....
• memiliki e-mail, entah gmail, yahoo, telkom.net yang penting emailnya aktif.
• dll

sementara persiapkan itu dulu
baca juga cara buat email di google alias gmail