Tampilkan postingan dengan label Dunia Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Dunia Blog. Tampilkan semua postingan

Selasa, 06 Maret 2012

Mengganti Kursor Pada Blog

Biar blog kalian tambah menarik bisa juga kok di tambahkan accessories yang satu ini biar gak jadi tambah cupu.


  URL : http://downloads.totallyfreecursors.com/thumbnails/aliendance.gif
  URL : http://downloads.totallyfreecursors.com/thumbnails/tail2.gif
  URL : http://downloads.totallyfreecursors.com/thumbnails/banana1.gif
  URL : http://downloads.totallyfreecursors.com/thumbnails/bullseye-ani.gif


Cara penampatannya blognya tinggal kita utak atik sedikit di bagian edit template nya, dan berikut adalah Cara Mengganti Kursor di Blog :

1.    Login akun blogger sobat
2.    Pilih Rancangan > Edit HTML, centang Expand widget template.
3.    Carilah kode </head> pada template (cara cepat : ctrl+f )
4.    Copy kode dibawah ini dan letakkan tepat diatas kode </head> .

<style type='text/css'>
HTML,BODY{cursor: url(&quot; http://downloads.totallyfreecursors.com/thumbnails/sweden.gif &quot;), auto;}
</style>

Jangan lupa di save dahulu ya kawan.!
Selamat mencoba ya sahabat VIE

Kamis, 01 Maret 2012

Cara Membuat Tombol Next Page pada Blog

Mungkin kadang anda menginginkan agar blog anda simpel dan tidak menghabiskan layar begitu banyak. Kini saya berbagi pembuatan next page pada blog anda agar lebih singkat dan menarik untuk di lihat.
langkah-langkah Cara Membuat Next Page Pada Blog Anda:
1. login blog
2. masuk ke template edit HTML jangan lupa  Expand Template Widged di centang.
3. cari kode ]]></b:skin<
4. lalu copy kan kode dibawah ini tepat diatas kode ]]></b:skin<

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

5. lalu cari kode </body>
6. lalu copy kan kode dibawah ini tepat diatas kode </body>

<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord=&#39;Previous&#39;;
var downPageWord=&#39;Next&#39;;
</script>
<script src='http://rumbiadalam.googlecode.com/files/pag3.js' type='text/javascript'/>

7. simpan dan lihat hasilnya.....


NB : kode yang berwarna merah bisa anda rubah sesuai keinginan.

Jumat, 17 Februari 2012

Membuat Menu Tampilan pada New Tab

Widget ini adalah salah satu cara untuk membuat link menu dan menu tersebut akan tampil di halaman yang baru ketika kita membuka menu yang ada dihalaman blog tersebut, dan ini dapat juga menghindari tertimpanya halaman yang sedang kita muat. Silahkan anda mencobanya.


Cara Membuatnya Adalah :

1. Log in ke account blogger anda.
2. Click tata letak---tambah halaman ----pilih HTML/JAVA SCRIPT.
3. Copy pastekan kode di bawah ini.

<h2 class="title">ISI JUDUL ANDA DISINI</h2>
<div class="widget-content">
<div style="border: 0px solid rgb(153, 153, 153); overflow: auto; width: 310px; height: 150px; text-align: left;">

<li> <a href="http://davotmarbun.blogspot.com/2012/01/testing1.html" target="new'">Testing 1</a></li>

<li> <a href="http://davotmarbun.blogspot.com/2012/01/testing2.html" target="new'">Testing 2</a></li>

</div>

Ket:
* Tulisan yang berwarna biru adalah judul yang akan ditampilkan.
* Tulisan yang berwarna hijau silahkan anda ganti sesuai alamat  link anda sendiri.
* Tulisan yang berwarna merah adalah tampilan yang akan muncul,dan ganti sesuai selera anda.


Senin, 09 Januari 2012

Membuat Efek Gelembung Pada Blog

Membuat Efek Gelembung Pada Blog. Mungkin artikel ini sudah di bahas di blog para blogger yaitu kalo ngga salah yaitu Tentang cara membuat efek hujan di blog,efek hujan salju atau daun yang jatuh berguguran, tapi kali ini saya berbagi sebuah tips tentang cara membuat efek gelembung yang bertaburan di blog,wuihhh...! keren kaya acara pesta atau konser hi..hi...hi....,oke langsung saja saya tidak akan banyak bicara lagi, jika kamu ingin mencobanya silakan ikuti langkah berikut ini :

  1. Pertama masuk dulu ke akun blogger kamu
  2. Masuk ke Desian yang ada di pojok kanan blog kamu
  3. Pilih Template, Edit HTML 
  4. Cari kode  
     
    <body>
     
  5. Lalu copy script di bawah ini lalu pastekan di bawah kode <body>
     
    <script src="http://clief.googlecode.com/files/bubble.js"></script>
     
  6. Setelah itu jangan lupa kamu save ya
  7. Dan sekarang lihat blog kamu ada gelembung yg betaburan di blog kamu.

cara membuat blog

Panduan membuat Blog di Blogspot

1. Apa itu Blog ?

Blog merupakan sigkatan dari “Web log” adalah salah satu aplikasi web berupa tulisan-tulisan yang umum disebut sebagai posting pada halaman web. Tulisan-tulisan tersebut seringkali diurut dari yang terbaru dan diikuti oleh yang lama.
Awalnya, blog dibuat adalah sebagai catatan pribadi yang disimpan secara online, namun kini isi dari sebuah blog sangat bervariatif ada yang berisi tutorial ( contoh blog ini ), curhat, bisnis dan lain sebagainya. Secara umum, blog tidak ada bedanya dengan situs yang ada di internet. makeityourring diamond engagement rings
Flatform blog atau seringkali disebut juga dengan mesin blog dibuat sedemikian rupa oleh para designer blog agar mudah untuk digunakan. Dulu, untuk membuat aplikasi web diperlukan pengetahuan tentang pemrograman HTML, PHP, CSS dan lain sebagainya, dengan blog semuanya menjadi mudah semudah menyebut angka 1 2 3.

2. Cara membuat blog di blogspot

Salah satu penyedia blog gratis yang cukup populer saat ini adalah  blogspot atau blogger, dimana ketika mendaptar adalah melalui situs blogger.com namun nama domain yang akan anda dapatkan adalah sub domain dari blogspot, contoh : contohsaja.blogspot.com
Kenapa harus membuat blog di blogger.com bukan pada situs penyedia blog lainnya? Sebenarnya tidak ada keharusan untuk membuat blog di blogger, namun ada banyak kelebihan yang dimiliki blogger di banding dengan penyedia blog lain. Beberapa contoh kelebihan blogspot di banding yang lain yaitu mudah dalam pengoperasian sehingga cocok untuk pemula, lebih leluasa dalam mengganti serta mengedit template sehingga tampilan blog anda akan lebih fresh karena hasil kreasi sendiri, custom domain atau anda dapat mengubah nama blog anda dengan nama domain sendiri misalkan contohsaja.blogspot.com di ubah menjadi contohsaja.com,sedangkan hosting tetap menggunakan blogspot dan masih tetap gratis.
Perlu ditekankan dari awal bahwa internet itu sifatnya sangat dinamis, sehingga mungkin saja dalam beberapa waktu kedepan panduan membuat blog di blogspot ini akan sedikit berbeda dengan apa yang anda lihat di blogger.com
Untuk mengurangi hal yang tidak perlu di tulis, berikut cara membuat blogger di blogger.com

Membuat Email

Salah satu syarat yang harus dipenuhi dalam membuat blog adalah anda memiliki alamat email yang masih aktif atau di gunakan. Jika anda belum mempunyai alamat email, silahkan daftar terlebih dahulu di gmail karena blogger adalah salah satu layanan dari Google maka ketika mendaftar ke blogger sebaiknya gunakan email gmail. Jika anda belum paham bagaimana cara membuat email, silahkan gunakan mesin pencari google untuk mencari panduannya.

Daftar Blog di blogger


  1. Silahkan kunjungi situs http://www.blogger.com
  2. Setelah halaman pendaftaran terbuka, alihkan perhatian ke sebelah kanan atas, ubah bahasa ke Indonesia agar lebih mudah difahami. Silahkan langsung login dengan menggunakan username serta password gmail anda ( akun email anda bisa untuk login ke blogger). login blogger
  3. Klik tombol bertuliskan CIPTAKAN BLOG ANDA. ciptakan blog anda
  4. Isilah nama judul blog serta alamat blog yang di inginkan. Ingat! dalam membuat alamat blog harus benar-benar serius karena itu permanen tidak dapat digantikan lagi (kecuali nanti ganti dengan custom domain). Jika alamat yang diinginkan ternyata tidak bisa digunakan, masukkan kembali alamat lain yang masih tersedia. Jika alamat blog yang diinginkan masih tersedia, silahkan klik anak panah bertuliskan LANJUTKAN. nama-blog
  5. Silahkan pilih template yang anda sukai ( template ini nanti bisa diubah lagi kapan saja anda mau), kemudian klik LANJUTKAN. pilih template di blogger
  6. Akan ada tulisan “Blog Anda Sudah Jadi!”. Silahkan lanjutkan dengan klik tombol MULAI BLOGGING. mulai blogging
  7. Setelah masuk post editor, silahkan isi apa saja ( disarankan untuk langsung mengisi posting, biasanya jika tidak langsung posting akan terjaring robot anti spam milik blogger, dan blog anda akan di lock). Contoh : hello world. Klik Tombol PRATINJAU untuk melihat tampilan yang nanti akan muncul di blog, klik tombol TERBITKAN ENTRI jika posting anda mau dipublikasikan ke publik. terbitkan entri
  8. Klik “Lihat Entri” untuk melihat blog anda. Berikut contoh tampilan blog yang tadi di buat. tampilan-blog
  9. Selesai.
Untuk tahap awal, blog anda sudah jadi dan bisa diakses dimana saja. Untuk pembahasan lebih dalam tentang bagaimana blogging dengan blogger, akan di bahas pada posting berikutnya.

Membuat Readmore.... Pada Blog

Ini yang paling utama setiap awal membuat blog agar blog kita terlihat rapih sahabat vie. Silahkan d coba ya walaupun agak sulit tapi kalian pasti bisa kok !
.^_^.
Nah, mari kita mulai sekarang.
  1. Seperti biasa masuk ke www.blogger.com.
  2. Pilih Desain yang ada di pojok kanan blog kamu kemudian Pilih Template.
  3. Klik edit HTML.
  4. Sebelum melangkah ke pemasangan kode, silahkan download template anda, klik download template lengkap.
  5. Kemudian cheklist Expand widget template.
  6. Cari kode </head>  (gunakan ctrl+F untuk memudahkan pencarian)
  7. Harus ketemu, kalau sudah ketemu berarti langkah selanjutnya akan sangat mudah. .^_^.
Jika kode diatas sudah ketemu maka silahkan ikuti pemasangan kode dibawah ini.
Cari kode , dan simpan kode dibawah ini tepat diatas kode
Langsung copy paste aja

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://script-bamz-us.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/> 

Jika sudah, Sekarang tahap terakhir, cari kode <data:post.body/> atau <p><data:post.body/></p>   dan silahkan hapus, dan ganti dengan kode dibawah ini.


<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'><img src="http://lh3.ggpht.com/_kTaFrEr_318/SkKGIoU-oPI/AAAAAAAAA9g/5A_nTHvFgiI/readmore_thumb%5B2%5D.gif"></img></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if> 
Read more sangat dibutuhkan dalam hal tampilan supaya lebih menarik. Trik ini akan menghemat tampilan blog tapi memberikan informasi dari sebagian posting kita.

Mengatur Tampilan Widget Blog

Mengatur Tampilan Widget Blog

Mengatur tampilan widget aku pernah menemukan 3 macam yaitu :
 
1. Tampil dihalaman depan saja
2. Tampil di semua posting tapi tidak di halaman depan
3. Tampil hanya pada posting tertentu

Berikut langkah-langkahnya :

1. Masuk ke blogger
2. Pilih widget yang sudah ada atau buat widget baru (terserah anda dan beri nama widget tersebut agar nanti bisa mudah pencarian kodenya)
3. Pilih Desain kemudian Cari Template
4. Masuk ke "Edit HTML" klik/tandai "Expand Template Widget"
5. Kemudian cari kode widget tersebut  (pake CTRL+F biar cepet) unutuk kode widget biasanya seperti dibawah ini
<b:widget id='HTML3' locked='false' title='JUDUL WIDGET' type='HTML'> <b:includable id='main'>
<!-- only display title if it's non-empty --> <b:if cond='data:title != &quot;&quot;'> <h2 class='title'><data:title/></h2> </b:if> <div class='widget-content'> <data:content/> </div> <b:include name='quickedit'/> </b:includable> </b:widget>

Nah, untuk mengatur tampilannya kodenya seperti berikut :
a) Untuk menampilkannya di halaman depan perhatikan kode dibawah ini :

<b:widget id='HTML3' locked='false' title='JDUL WIDGET' type='HTML'> <b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty --> <b:if cond='data:title != &quot;&quot;'> <h2 class='title'><data:title/></h2> </b:if> <div class='widget-content'> <data:content/> </div> <b:include name='quickedit'/>
</b:if>
</b:includable> </b:widget>

b) Untuk menampilkannya pada seluruh postingan tapi tidak di halaman depan lihat kode ini:

<b:widget id='HTML3' locked='false' title='JUDUL WIDGET' type='HTML'> <b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<!-- only display title if it's non-empty --> <b:if cond='data:title != &quot;&quot;'> <h2 class='title'><data:title/></h2> </b:if> <div class='widget-content'> <data:content/> </div> <b:include name='quickedit'/>
</b:if>
</b:includable> </b:widget>

c) Uuntuk menampilkannya hanya pada postingan tertentu kodenya seperti ini :

<b:widget id='HTML3' locked='false' title='JUDUL WIDGET' type='HTML'> <b:includable id='main'>
<b:if cond='data:blog.url == "Alamat_URL_postingan_yang_hanya_ada_widget_ini"'>
<!-- only display title if it's non-empty --> <b:if cond='data:title != &quot;&quot;'> <h2 class='title'><data:title/></h2> </b:if> <div class='widget-content'> <data:content/> </div> <b:include name='quickedit'/>
</b:if>
</b:includable> </b:widget>
terus mencari tutorial membuat blog agar blog sahabat vie bagus dan minat pembaca banyak !

membuat scroll pada blog

Membuat Arsip Blog dengan Scroll

Aku juga termasuk pengguna baru di bloger tapi aku ingin berbagi pembuatan untuk kalian yang baru buat. Dulu aku juga bingung pbuat scroll seperti kaka yang sudah senior mempunyai blog yang begitu indah. Yang penting itu scroll biar pembaca mudah melihat arsip yang kita miliki sahabat.
contoh nya dapat di lihat sendiri di blog saya ini,yuk langsung aja ikuti langkah - langkah yang ada di bawah ini :

Membuat Arsip Blog Fungsi Scroll
  • Klik Desain pada pojok kanan blog kamu
  • Pilih Template
  • Setelah itu, klik Edit Html
  • Beri tanda centang pada tulisan Expand Widget Template
Kawan cari kode seperti ini
<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>
Kamu akan menemukan kode lengkapnya seperti ini :
<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div style='overflow:auto; width:ancho; height:100px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
<b:if cond='data:style == &quot;HIERARCHY&quot;'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == &quot;FLAT&quot;'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>
<b:include name='quickedit'/>
</div>
</b:includable>
<b:includable id='flat' var='data'>
<ul>
<b:loop values='data:data' var='i'>
<li class='archivedate'>
<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
</li>
</b:loop>
</ul>
</b:includable>
<b:includable id='menu' var='data'>
<select expr:id='data:widget.instanceId + &quot;_ArchiveMenu&quot;'>
<option value=''><data:title/></option>
<b:loop values='data:data' var='i'>
<option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
</b:loop>
</select>
</b:includable>
<b:includable id='interval' var='intervalData'>
<b:loop values='data:intervalData' var='i'>
<ul>
<li expr:class='&quot;archivedate &quot; + data:i.expclass'>
<b:include data='i' name='toggle'/>
<a class='post-count-link' expr:href='data:i.url'><data:i.name/></a>
<span class='post-count' dir='ltr'>(<data:i.post-count/>)</span>
<b:if cond='data:i.data'>
<b:include data='i.data' name='interval'/>
</b:if>
<b:if cond='data:i.posts'>
<b:include data='i.posts' name='posts'/>
</b:if>
</li>
</ul>
</b:loop>
</b:includable>
<b:includable id='toggle' var='interval'>
<b:if cond='data:interval.toggleId'>
<b:if cond='data:interval.expclass == &quot;expanded&quot;'>
<a class='toggle' expr:href='data:widget.actionUrl + &quot;&amp;action=toggle&quot; + &quot;&amp;dir=close&amp;toggle=&quot; + data:interval.toggleId + &quot;&amp;toggleopen=&quot; + data:toggleopen'>
<span class='zippy toggle-open'>&#9660; </span>
</a>
<b:else/>
<a class='toggle' expr:href='data:widget.actionUrl + &quot;&amp;action=toggle&quot; + &quot;&amp;dir=open&amp;toggle=&quot; + data:interval.toggleId + &quot;&amp;toggleopen=&quot; + data:toggleopen'>
<span class='zippy'>
<b:if cond='data:blog.languageDirection == &quot;rtl&quot;'>
&#9668;
<b:else/>
&#9658;
</b:if>
</span>
</a>
</b:if>
</b:if>
</b:includable>
<b:includable id='posts' var='posts'>
<ul class='posts'>
<b:loop values='data:posts' var='i'>
<li><a expr:href='data:i.url'><data:i.title/></a></li>
</b:loop>
</ul>
</b:includable>
</b:widget>

Kode warna merah dan hijau adalah kode yang ditambahkan kedalam script tersebut
Kode warna hijau yang dicetak tebal adalah tinggi dari elemen tadi, silahkan kamu ganti agar sesuai dengan blog sahabat vie

Don't forget sahabat vie sebelum di close Klik Simpan dahulu

Sabtu, 17 Desember 2011

Cara Membuat Favicon

Cara membuat Favicon (2)

Pada zaman dahulu kala, kang rohman pernah membahas bagaimana cara menganti Favicon yang saya posting di sini. Karena zaman selalu berubah, maka postingan tersebut sudah tidak relevan lagi untuk di baca atau dengan kata lain sudah kadaluarsa. Walaupun begitu sebenarnya kang rohman sudah memposting artikel terbaru yang saya posting di sini, namun karena tidak semua orang suka berkunjung ke blog saya yang satu ini, maka artikel tersebut luput untuk di baca. Oleh karenanya, kali ini kang rohman coba posting saja di blog ini.

Bagi anda yang masih bingung apa sih Favicon itu? Favicon (favourite icon) adalah icon kecil yang berada di samping alamat blog atau website anda. Apabila anda membuat blog di Blogger.com alias blogspot, maka favicon yang berada di samping alamat URL anda adalah berupa favicon blogger. Berikut screenshot nya :


blogger favicon

Apakah favicon tersebut bisa di ganti dengan favicon milik anda? jawabannya adalah bisa. Berikut adalah contoh favicon blogger yang sudah di ganti :
favicon anda

Untuk mengganti favicon tersebut, anda bisa melakukan langkah-langkah seperti berikut :

  1. Pertama buatlah sebuah gambar yang akan di jadikan sebagai favicon, contoh seperti gambar di bawah ini :

    favicon ku

  2. Setelah itu anda harus mengubah gambar tersebut kedalam bentuk gambar icon. Untuk hal tersebut, anda bisa menggunakan tool Favicon Generator, silahkan kunjungi situs http://www.favicongenerator.com
  3. Klik pada tombol Browse...
  4. Masukan gambar yang tadi dibuat untuk di ubah menjadi format icon
  5. Klik pada tombol Generate Favicon.
  6. Setelah proses selesai, klik pada Click Here to Download your favicon.
  7. Save ke komputer anda.
  8. Langkah selanjutnya adalah anda harus meng upload Favicon yang tadi ke tempat hosting gamabar, contoh adalah ke Yahoo! Geocities. Belum tahu bagaimana cara meng upload gambar ke Yahoo! Geocities? heuheuheu... sok atuh di baca dulu postingan kang rohman yang ini!
  9. Sekarang saya asumsikan bahwa anda sudah mempunyai alamat URL dari favicon anda. sebagai contoh, saya mempunyai sebuah alamat URL seperti ini :

    http://www.geocities.com/amn_tea/favicon.ico
  10. Anda harus mengubah alamat URL favicon anda menjadi seperti ini :

    <link rel="shortcut icon" href="http://www.geocities.com/amn_tea/favicon.ico"/>

  11. Langkah selanjutnya adalah silahkan login ke blogger dengan ID anda.
  12. Klik pada Tata Letak.
  13. Klik Edit HTML.
  14. Silahkan cari kode </head> (posisinya hampir paling atas, jadi jangan jauh-jauh nyari ke bawah dhenk).
  15. Simpan kode favicon yang tadi persis di atas kode </head> . Contoh :


  16. <link rel="shortcut icon" href="http://www.geocities.com/amn_tea/favicon.ico"/>

  17. Klik tombol Simpan Template.
  18. Selesai. Sekarang anda sudah mempunyai favicon di alamat URL blog anda.



Bagi anda yang masih menggunakan browser IE6, favicon anda tidak akan langsung terlihat, coba di bookmark dulu alamatnya. Berbeda jika anda menggunakan browser firefox, opera dan yang lainnya, favicon anda sudah langsung dapat di nikmati.

Template by:

Free Blog Templates