Napi Blog-g Part 2: 2013

Minggu, 06 Oktober 2013

Cara Mengganti Tulisan Posting Baru, Beranda dan Posting Lama

cara menggganti tulisan posting baru, home, posting lama dengan gambar

Hai sobat blogger, kali ini saya dapat ilmu baru lagi nih. Seperti yang anda tahu semua blog pasti memiliki tulisan posting baru, beranda, dan posting lama atau dalam bahasa inggris, itu sudah wajar dimiliki oleh semua blog kecuali blog untuk bisnis, mungkin anda sangat bosan bukan?? melihat tulisan tersebut, dan tidak ada unik-uniknya, hanya tulisan berarah ke suatu tempat atau yang biasa disebut dengan kata "link" ,

mungkin anda ingin mengganti tulisan tersebut dengan gambar atau semacamnya, semuanya ada di sini, saya membuat cara ini di blog saya agar semua blogger mengetahui cara ini, cara memasangnya pun sangat mudah, hanya perlu sedikit mengganti kode html, mungkin jika anda blogger pemula akan sangat kebingungan, karena itu saya membuat cara ini dengan gambar, gambar hanya untuk mempermudah para blogger pemula untuk lebih jelas, dan widget ini pun hanya untuk memudahkan orang yang buta huruf agar memahaminya, walaupun tidak semuanya bergambar.

Nah sudah jelas kan penjelasan di atas, sekarang kita akan membahas cara memasangnya.

Ikuti langkah-langkah di bawah ini:

1. Masuk ke Dasbor

2. Klik Template

cara mengganti tulisan posting baru, posting lama, dan beranda dengan gambar sendiri

3. Klik Edit HTML

mengganti tulisan posting lama dan posting baru menjadi judul postingan

4. Klik Lanjutkan

cara mengganti tulisan posting lama dan posting baru

5. Centang kotak Expand Widget Templates seperti pada gambar

Mengganti tulisan posting baru
1. Cari kode di bawah ini

<data:newerPageTitle/>

2. Hapus dan ganti dengan

<img src='http://www.iconhot.com/icon/png/hand-drawing/128/left-10.png.png'/>

Mengganti tulisan beranda (home)
1. Cari kode di bawah ini

<data:homeMsg/>

2. Hapus dan ganti dengan

<img src='http://www.iconhot.com/icon/png/hand-drawing/128/home-89.png'/>

Mengganti tulisan posting lama
1. Cari kode di bawah ini

<data:olderPageTitle/>

2. Hapus dan ganti dengan

<img src='http://www.iconhot.com/icon/png/hand-drawing/128/right-9.png'/>

Cara mencarinya adalah menggunakan hotkey ctrl+f

.:Selesai:.

NB:

Bagi yang menemukan 2 kode yang sama hapus dan ganti dua-duanya.

Jangan lupa ya Komentarnyaa....

Cara Memasang Widget Animasi Burung Twitter Terbang Di Blog

Tak sengaja lagi pesbukan, tiba-tiba nemu blog yang ada animasi burug twitter yg sedang beterbangan di blog itu. Jadi tertarik ingin masang di blog sendiri deh, nah langsung aja ku cari tutornya dengan mbah gogel, ketemu deh, terus ko copas, tp tenang, tar aku cantumin sumbernya koq hehe... Kalo sobat novitik ingin pasang juga, silahkan nih kodenya. Tapi caranya udah tau kan? bagi yang belum, caranya begini:

________________________________________

1. Login dulu ke www.blogger.com
2. Setelah login, lalu klik RANCANGAN
3. Lalu klik Elemen halaman
4. Klik Tambah Gadget
5. Pilih dan klik HTML/JAVA SCRIPT
6. Copy Kode di bawah ini, dan paste di gadget HTML/JAVASCRIPT kalian.

<script type="text/javascript" src=" http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="http://i1013.photobucket.com/albums/af252/sleman234/bluetwit.png"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/twitter-mu";var tweetThisText = "Twitter - twitter-mu http://namablog-mu.blogspot.com/";tripleflapInit();</script>

Tapi, sebelum disave. ada beberapa yang harus kamu ganti, yaitu:

namablog-mu
Ganti dengan alamat blog-mu

twitter-mu
Ganti dengan nama/akun twitter-mu

http://i1013.photobucket.com/albums/af252/sleman234/bluetwit.png
Ganti alamat gambar tersebut dengan alamat gambar dengan warna yang kamu suka:

Merah:
http://i1013.photobucket.com/albums/af252/sleman234/red.png

Biru Tua:
http://i1013.photobucket.com/albums/af252/sleman234/Blue.png

Ungu:
http://i1013.photobucket.com/albums/af252/sleman234/purple.png

Cokelat:
http://i1013.photobucket.com/albums/af252/sleman234/brown.png

Hitam:
http://i1013.photobucket.com/albums/af252/sleman234/black.png

Hijau:
http://i1013.photobucket.com/albums/af252/sleman234/Green.png

Kuning:
http://i1013.photobucket.com/albums/af252/sleman234/yellow.png

Putih:
http://i1013.photobucket.com/albums/af252/sleman234/white.png

Biru Muda (Standard):
http://i1013.photobucket.com/albums/af252/sleman234/bluetwit.png

7. Nah setelah kamu ganti gambar animasi burung twitternya
8. Klik Simpan/Save yang ada di kanan atas
9. Silahkan buka di browser anda.
10. Selamat mencoba

NB : Ganti tulisan berwarna Hijau dengan URL warna diatas

Atau klik Di Sini

NEW!!! Animasi Widget Twitter di Blog

Siang - siang gini enaknya minum Es Kelapa Muda dengan atau tanpa gula jawa :D HEHEHE... Okeh kali ini ane bakal ngasih tau cara minum es kelapa muda *lho?* maksud ane ngasih tau pengganti animasi burung terbang di Blog menjadi berbagai macam animasi mau tau? Cekidott...

Bagi kalian yang belom tau cara untuk memasangnya liat DISINI
Selanjutnya kalian tau kan harus bagaimana? karena ane sudah cape nulis :D
Okeh bagi Kalian yang udah ga sabar silahkan sedoott...

Pilihan Animasi

Burung Twitter

Gunakan Kode :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBoXIQRZa-F2Pn1zMmBY2sVYrzStTgo4-HjRtukGpCUh3FN9sa9jqcUQw-6wrXm7wZrWwTDU9ieaoPf1RDI1z9jPurgRtkNY8tHphJYt_HfHeb-9jQ7CU9z23TP5jsVVzvfzyTODnuH9c/s1600/birdsprite.png

Stickman Twitter

Gunakan Kode :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMt8Si1RiqlZCVUMfis5ViTXMF3mLmAorX6P7t3G7tZ-fYFCQpzZu55YoXygpeWUSGQ2quXUzpLdbot5Yr55kJWprPwz6bxdFQ8sexT0DSEMnUzyRYxE604JlqgGCFHVxcAkzHKHp_UXE/s1600/birdsprite_MonozCore_Stickman.png

Star Scream Twitter

Gunakan Kode :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiESXPUKJ8-bCo9hWHewa8Cxt98NJ4YXNi7IS9sUgEZw0lJFIbTyP_dBK1Svt2wCcQTV4THOjCiCv5SD_4VEni8Z9_P1mwgteCcEs_rl3EAkAJITU0wvk9aSaec3pxTMI6jXWgYGgJYw5Q/s1600/StarScream.png

Bat Twitter

Gunakan Kode :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJFx08kCEYwtacKTLlBuMidnX98KRxJQck_qiI_20W25dnanF7pAqEYxXDucN6buRpAYrnHg9OujHXCxGIKON7k5CMyD-rVRnch_imACkbeI-ZyrvS7yi0FTQ-MuPQubjTqLgJ323docQ/s800/MonozCore.blogspot.com_BatTwitter.png

SantaBird Twitter

Gunakan Kode :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixH8OfZFz3LNujYXs5RAmHfP3MQE1JaDIfAd5KjWanD6oXcQlbIgyahyphenhyphenjksxDhwlMN6xj0fiKGtfdlSzw5CEJZK0o67QnQXY_TRvam2__-pm1F_xaFFWh1vixXWLwbVO2650Zee0KLpFQ/s800/MonozCore.blogspot.com_SantaBirdTwitter.png

Dragon Twitter

Gunakan Kode :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJQKjf_x7utZhI-VOq_P2_-n5yAaIkT4i0xZNjOPJUSzgcpWoGOQ1ZeOr4OP12ZKt0HjfjOchsiZE0HgOF3ooeFGJbA8n9bpTalPjLyJ0g8DGi3MauhH73EfqGddcSakp4B5AbgM3dlTI/s800/MonozCore.blogspot.com_Dragon_Twitter.png

DBZ Twitter

Gunakan Kode :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxU4IHubHTrrk5AONs2LVGPgTluoFqZC2IVI7K6Twepo_UY-T8dB2djk8jgucqjsf7KyqMDVqhIlGPoC1mhTJs6iPGc-BUvyIkUiZy2awYTztcQKAg5_CTsVDsgJKZdS7VGiHNsKcR_Yw/s800/MonozCore.blogspot.com_DBZ_Twitter.png

Dracula Twitter

Gunakan Kode :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqRkmsc1gibbu8uEO9PpVNqlb-jirFt6-aDE1Lcri-ikIvfuuA75H0qZO6uKPpH-zjoeoz91DGfQUlaPragE3jHHLG0mFf168v5xGf1MdcEcZR69a3KfBbf5gxX6nkEkwnbFBtu-0DT8dZ/s800/Drakula.png

Bagi yang ingin memberikan saran, kritik dan komentarnya ane persilakan, ga perlu malu sebab ane sudah siapkan kolom khusus di bawah postingan ini.

:: Semoga Bermanfaat ::

Cara Menambahkan Animasi Hewan Mengikuti Kursor/Mouse di BLOG

Akhirnya setelah susah payah mencari kesana kemari akhirnya dapet juga yang saya cari yaitu Animasi Hewan Mengikuti Kursor/Mouse di Blog langsung aja ke TeeeKaPee...

Step :
1. Log In ke Blog
2. Klik Tata Letak
2. Lalu klik tambah Tambah gadget / add gadget , setelah di klik akan muncul banyak pilihan ..

pilih HTML/JAVA SCRIPT

lalu copy pastekan script-script berikut ini ( sebaiknya jangan di beri judul )

Silahkan COPAST HTML dibawah ini

1. Hamster

2. Laba - Laba

3. Anjing

4. Pinguin

5. Pinball

6. Ikan Pari

7. Bandul

8. Kura - Kura

.: SELESAI :.

JANGAN LUPA KOMENTARNYA YAA..

Angry Birds Template untuk Blog!!

Name : Angry Birds Template

Author : AllBlogTools.com

DOWNLOAD TEMPLATES

Kumpulan Animasi Sponge Bob Di Pojok Blog!!!

Kali ini ane bakal posting dan nge-share animasi di pojok blog terbaru buat kalian hehe :D
Langsung aja cekidott..

Caranya :
1. Buka Tata Letak
2. Tambah Gadget
3. Copy Link

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://bukanakgo.blogspot.com/" target="_blank"><img border="0" src="
http://animationsa2z.com/attachments/Image/spongebob/spongebob10.gif" title="lihat lebih banyak animasi naruto bergerak". alt="kumpulan animasi naruto bergerak gif" /></a><small><center><a href="http://bukanakgo.blogspot.com/2012/09/kumpulan-animasi-sponge-bob-di-pojok.html" target="_blank" title="Cara Memasang Widget Animasi Sponge bob di Pojok Blog">Animasi SpongeBob</a></center></small></div>

Link yang berwarna merah bisa anda ganti dengan kode dibawah ini

http://animationsa2z.com/attachments/Image/spongebob/spongebob13.gif

http://animationsa2z.com/attachments/Image/spongebob/spongebob8.gif

http://animationsa2z.com/attachments/Image/spongebob/spongebob10.gif

http://animationsa2z.com/attachments/Image/spongebob/spongebob9.gif

http://animationsa2z.com/attachments/Image/spongebob/spongebob4.gif

http://animationsa2z.com/attachments/Image/spongebob/spongebob5.gif

http://animationsa2z.com/attachments/Image/spongebob/spongebob6.gif

http://animationsa2z.com/attachments/Image/spongebob/spongebob1.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6SKZyTs8rtlPn_AP5xylF9THZAFBJMZ3AJ3LdLfqDuHR_md3bpFkbtOlLCET6MZsXzA-WrhrmQaQ_0aRWzyP-rOuOYlPTVMzw00ITLq4wbeP_MHQy8IvTwYVcLwjqSvB6YTPzrqCC-mje/ .:JANGAN LUPA KOMENTARNYA:.

Mau LIKE box melayang

Mau LIKE box melayang ? Itu Mah Masalah Kecil Mau Tau Caranya ? Langsung Aja Ke TKPEEE!

1.cara login dulu ke BLOGGER
2.lalu kepos ===:> tekan Buat entri baru
3. masukan kode di bawah ini:
<style type="text/css">
/* Message Box */
#box-message {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#fff;
font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#box-message a.close {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}
#twitterx {
background: #EEF9FD;
padding: 10px;
text-align:center;
border: 1px solid #C7DBE2;
border-top: 0;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"50px"}, 1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<br />
<div id="box-message">


<br />
<center>
<a class="murub" href="http://www.blogger.com/blogger.g?blogID=118481095838686026">Jangan Lupa Like ya</a></center>
<center>
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Ostsagblogspotcom/566380840078098?hc_location=stream&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&appId=371524026202784" style="border: none; height: 258px; overflow: hidden; width: 292px;"></iframe>
</center>


<br />
<div class="twitter">
 <iframe class="twitterx-follow-button" frameborder="0" scrolling="no" src="http://platform.twitter.com/widgets/follow_button.html#_=1319978796351&%20align=&button=blue&id=twitter_tweet_button_0&%20lang=ID&link_color=&screen_name=carahanapi&show_count=&%20show_screen_name=&text_color=" style="height: 20px; width: 250px;" title=""></iframe> </div>
<a class="close" href="http://www.blogger.com/blogger.g?blogID=118481095838686026#">×</a>
</div>
yang warna merah ganti dengan nama twitter anda
yang warna biru ganti dengan URL halaman facebook anda

Sabtu, 05 Oktober 2013

Modifikasi 3 Template Valid HTML5

ertama saya akan jelaskan dulu apa itu HTML5 dan kenapa kita harus memakai HTML versi terbaru? HTML sendiri adalah singkatan dari Hyper Text Markup Language. HTML bukanlah termasuk bahasa pemrograman, karena struktur yang dimilikinya dianggap terlalu sederhana, kode-kode yang dibaca oleh browser baris per baris, dari atas ke bawah. HTML juga tidak mempunyai struktur pemrograman yang umum ada pada sebuah bahasa pemrograman standar. HTML hanyalah kumpulan dari beberapa instruksi yang dapat dipakai untuk merubah format suatu naskah atau dokumen.

Saat ini HTML telah menjadi standar yang banyak digunakan secara luas untuk menampilkan halaman web atau situs. HTML juga bisa diartikan sebagai kumpulan simbol-simbol atau tag-tag yang dituliskan dalam sebuah file yang dimaksudkan untuk menampilkan halaman pada web browser. Oleh karena itu, untuk dapat membuka dokumen yang ditulis dalam format HTML maka kita perlu sebuah tool yaitu berupa browser seperti Opera, Mozilla, Google Chrome, Internet Explorer dan lain-lain.

Tentang HTML5 dan Fungsinya

Dengan semakin berkembangnya teknologi saat ini, format HTML pun dituntut mampu memberikan informasi yang akurat untuk setiap dokumen yang dibaca. W3C atau Word Wide Web Consortium sebagai pengembang XHTML 2.0 dan WHATWG sepakat untuk bekerja sama membuat HTML versi terbaru, yaitu HTML5. Pengembangan format HTML menjadi HTML5 bertujuan untuk memperbaiki teknologi HTML agar dapat mendukung teknologi multimedia terbaru. Selain itu HTML5 dapat mengurangi penggunaan plugin-plugin third party pada HTML sehingga dapat mempercepat kinerja sebuah web atau situs. Plugin-plugin tersebut misalnya Microsoft Silverlight, Adobe Flash, Java dan sebagainya.

Bagi pengembangan website atau blog, format HTML5 juga memberikan beberapa kemudahan, misalnya pada bagian awal file HTML sebelumnya kita harus menulis coding DOCTYPE yang panjang, seperti ini :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Pada HTML5, DOCTYPE dapat ditulis lebih ringkas

<!DOCTYPE html>

Kemudian pada baris berikutnya HTML lama biasanya seperti ini

<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

Versi HTML5 bisa lebih simple menjadi

<html expr:dir='data:blog.languageDirection'>

Validitas HTML sebuah Blog

Sekarang kita menuju ke validasi HTML, validitas sebuah situs atau web bukanlah merupakan suatu keharusan. Awalnya saya bingung, kenapa sih blog mesti valid struktur HTML nya? Kenyataan memang dari beberapa situs besar, bahkan Google sendiri mempunyai sekian puluh error dalam halamannya. Tetapi mempunyai Page Rank tinggi, lalu kenapa kita harus memikirkan Validasi HTML? Apakah Validasi HTML yang biasa ditest melalui validator W3C itu berpengaruh pada Search Engine Google?

Silahkan cari sendiri alasannya di internet ya, soalnya sampai saat ini masih terjadi pro kontra, apakah validitas sebuah blog perlu atau tidak. Kalau saya sih perlu, coba sekarang silahkan cek di Google Analytics, ada bermacam-macam jenis browser yang telah mengakses blog anda. Disitu Anda akan kehilangan beberapa persen pembaca yang kesulitan melihat blog anda dari browser mereka. Maka validasi HTML akan menjamin tampilan blog akan sama di semua browser. Melalui validasi html, semua browser, bahkan yang paling tua sekalipun akan bisa membaca dokumen blog yang Anda kelola dengan mudah

Wah artikel ini bakalan panjang, saya cut sampai disini penjelasan tentang HTML5 dan validasi HTML. Bagi yang masih percaya kalau validitas HTML sebuah blog sangat berpengaruh pada artikel kita di mata SERPs atau SEO, yah silahkan dibuat se-minimal mungkin error margin pada kode HTML Anda. Bagi yang tidak begitu peduli dengan validitas ya silahkan saja, tidak apa-apa. Sebagai kesimpulan, adalah sebuah gagasan yang bagus untuk memiliki validasi HTML pada situs Anda untuk memeriksa kesalahan dan membersihkan coding yang tidak perlu. Dan bagi Anda yang ingin mencoba keberuntungan apakah blog yang Anda kelola Valid HTML atau tidak, silahkan menuju link dibawah ini :

http://validator.w3.org/

Modifikasi Template Tipe Magazine Valid HTML5

Setelah nulis muter-muter tidak ada ujung pangkalnya, sekarang saya akan bagikan kepada Anda disini, 3 buah template lama dari Creating Website yang tadinya masih memakai format HTML lama, saya ganti menjadi HTML5 dan yang pasti validitasnya bisa dicek nanti. Bentuk dan model template ini sama persis dengan yang sudah saya bagikan tidak ada yang berubah, tapi codingnya yang berbeda, silahkan langsung saja :

Johny Sompret Banget

Demo | Download

Test Vallidasi HTML5 W3C

Cuztomisation Template

Johny Kena Banned

Demo | Download

Test Vallidasi HTML5 W3C

Cuztomisation Template

Johny Sompret

Demo | Download

Test Vallidasi HTML5 W3C

Cuztomisation Template

Ketiga template diatas, sudah saya modifikasi sehingga valid secara HTML5. Bukan jaminan 100% jika Anda memakai ketiga template diatas, blog Anda juga akan mempunyai validasi HTML, semuanya tergantung pengguna. Paling tidak saya sudah membuang kode-kode error yang ada pada template-template diatas, Anda tinggal menyesuaikan jika ada penambahan kode di Edit HTML maupun pada widget. Silahkan dicoba bagi yang tertarik dan semoga bermanfaat.

Membuat Domain Dot Com dengan Blogspot

Pernahkah terbayang oleh teman-teman blogger semua kita punya domain nama dot com? Itu yang sangat diharapkan oleh semua orang yang bergelut di dunia blogger dan internet umumnya. Maklum selama ini kita masih pakai domain dengan embel-embel blogspot, atau co.cc, yang kelihatan nggak mentereng. Pada malam hari ini walaupun hujan saya akan pergi juga ke warnet untuk memberikan sedikit penjelasan kepada teman-teman semua tentang bagaimana kita dapat merubah nama domaian kita menjadi nama dot com. Disamping itu mempunyai domain sendiri lebih menguntungkan dari segi bisnis online dibandingkan memakai domain kedua atau blogspot. Kenapa saya bilang begitu, karena memang banyak broker dari situs bisnis online yang menghedaki para blogger dengan domain pertama, seperti dot com, dot info, dot org, dot net, atau dot yang lainnya.

Malam hari ini saya akan mencoba memberikan penjelasan sekaligus masukkan untuk teman-teman blogger yang ingin beralih domain dari http://www.contohdomain.blogspot.com ke http://www.contoh domain.com. Dan hosting yang akan kita gunakan adalah blogger, karena sangat mudah dan effisien (gratis) sampai kapasitas yang tidak terbatas, kecepatan loading dari blogger pun tidak bisa dipungkiri lagi. Jadi buat apa beli yang mahal tapi belum tentu bagus, lebih baik gunakan saja yang gratisan dan sudah terbukti bagus.

Tentunya untuk mengganti domain, temen-temen harus mengeluarkan sedikit uang tabungan yang anda miliki. Untuk membeli domain, saya sarankan membelinya di GoDaddy, selain murah GoDaddy juga memberikan fasilitas setting dns gratis. Tidak seperti beberapa situs jualan domain yang ada di Indonesia, kebannyakkan ada tambahan biaya untuk setting dns-nya. Untuk lebih jelasnya perhatikan langkah-langkahnya di bawah ini::

Masuk ke GoDaddy dan account dulu di GoDaddy, isikan data-data anda dengan lengkap.
Kemudian login menggunakan username yang tadi anda daftarkan.
Untuk membeli domain, temen-temen harus masukkan nama domain yang di inginkan pada kotak search domain yang tersedia.
Kemudian anda akan dibawa ke halaman yang menjelaskan apakah domain yang ingin anda beli tersedia atau tidak, misalnya :
Jika sudah oke, silahkan anda centang salah satu pilihan yang ada, lalu klik tombol Continue to Registration. (Sekedar informasi, domain dengan akhiran dot info adalah yang termurah, bahkan terbilang sangat murah)
JIka ada tawaran seperti dibawah ini, klik saja No Thanks
Kemudian akan muncul halaman yang agak membuat pusing kepala, tidak usah diperhatikan, langsung saja lihat pada bagian paling bawah, kemudian klik radio button No Thanks, I’m ready to checkout, setelah itu klik Continue
Halaman berikutnya yang akan muncul adalah isian mengenai lama sewa domain dan cara pembayarannya.

Pilih saja 1 Year saja dulu, dan pilih cara pembayaran yang anda inginkan, apakah akan memakai kartu kredit, paypal, melalui cek, atau dengan gift card

Jangan lupa contreng 2 kotak radio button yang ada dibawah, lalu klik Continue with Checkout.
Setelah selesai melakukan pembayaran, tunggu konfirmasi selanjutnya dari pihak GoDaddy, biasanya tidak sampai memakan waktu 1 hari anda akan menerima email yang berisikan bahwa domain sudah teregistrasi dan siap untuk digunakan. Jika sudah ada email pemberitahuan tersebut, silahkan andalogin ke GoDaddy dengan username anda.
Kemudian pada bagian dashboard, klik domain yang sudah anda registrasi.
Setelah itu anda akan dibawa ke halaman dasboard, lalu klik Manage pada Total DNS/MX
Selanjutnya adalah mengganti settingan dns-nya, pada panel Cname yang ada dibagian atas, anda contreng yang ada tulisan @ dan www-nya, lalu klik gambar pensil yang ada disebelah kanan. Isikan pada enter alias name dengan “www” dan points to host name diganti dengan “ghs.google.com”
Kemudian cari tulisan Forward, isikan domain yang sudah di daftarkan tadi lengkap dengan www, misalnya http://www.contohdomain.com
Sampai disini selesai setting domain di GoDaddy.

Setting di Blogger

Login ke Blogger dengan account anda.
Buat blog baru dengan nama sembarang, misal sembarang.blogspot.com
Kemudian tuju halaman Pengaturan (Setting)
Klik tab Publikasikan
Kemudian klik Domain Ubahsesuaian (Custom Domain)
Klik Beralih ke Pengaturan Lanjut.
Isi domain anda lengkap dengan www
Selesai

Selesai sudah proses untuk merubah nama domain anda menjadi nama dot com. Selamat mencoba domain baru, mudah-mudahan dengan domain sendiri, bisnis online jadi tambah lancar. Dan jangan lupa kalau udah sukses jangan lupa sama saya.

Template Creating Website 2 Kolom

emplate Creating Website 2 kolom seperti yang saya pakai ternyata banyak juga yang berminat. Buat Anda yang menginginkan template ini sudah saya sediakan, Anda tinggal download, terus habis itu di upload. Template ini saya peringkas sehingga tidak seberat punya saya sendiri, karena template yang saya pakai sekarang ini memakai syntax highlighter yang banyak menggunakan kode javascript, yang mungkin untuk blog yang isinya berita tidak perlu dipasang Tapi dari tampilan sama persis, nggak ada bedanya. Bedanya cuma mungkin fitur blockquote, sama kolom komentar yang sengaja tidak saya sembunyikan. Karena dari template Creating Website modifikasi yang terdahulu banyak juga yang meminta kotak komentarnya nggak usah di modifikasi memakai spoiler.

Gambar tampilannya ya seperti blog saya ini, sama kan?

Sekarang untuk pemasangan widgetnya :

Untuk memasang translate bendera, tabber sidebar dan artikel terbaru sama caranya dengan artikel template creating website modifikasi.
Memasang Artikel Terkait
Masukkan kode di bawah ini pada kotak HTML/Javascript template Anda

<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script>

Untuk menampilkan Artikel Terkait ini hanya tampil pada post page baca tutorialnya disini.
Mengganti URL Feedburner

Anda tinggal mencari kode blogspot/offH pada template, setelah ketemu ganti dengan feed anda. Atau kalau kurang jelas selengkapnya bisa dibaca disini.
Membuat Drop Cap atau tulisan huruf awal postingan menjadi besar.

Sengaja template ini tidak dimasukkan fitur Drop Cap, karena selera setiap orang pasti beda. Bagi Anda yang menginginkan setiap huruf awal pada postingan menjadi besar langsung saja baca tutorialnya disini.
Mengganti kotak pencarian (search) adsense

Anda harus membuat kotak pencarian Google Adsense terlebih dahulu di akun Adsense anda. Kemudian setelah membuatnya, cari kode di bawah ini (dibawah kode <div style='float:right;padding:1px 8px 0 0;'> )

Ganti dengan kotak pencarian Adsense dengan yang sudah Anda buat, jangan lupa kodenya di parse dulu.
Untuk tampilan blockquote anda bisa modifikasi sendiri sesuai selera. Dan jika ada yang menginginkan kotak komentar disembunyikan menggunakan spoiler, langsung saja menuju pada tutorial Kang Damar disini.

Untuk mas Hanif bocah Tulungagung khususnya semoga terpenuhi keinginan Anda, dan buat temen-temen yang lain juga silahkan kalau mau mencoba memakai template ini. Di bawah ini sudah saya sediakan link untuk melihat demo dan downloadnya.

Demo | Download

3 Template Modifikasi Amburadul Banget

enjelang sahur (bagi yang sudah menunaikan puasa besok), dini hari ini saya akan bagi lagi tiga buah template sekaligus hasil modifikasi dari template saya sebelumnya. Template ini saya buat berdasarkan permintaan teman-teman blogger, dua template hasil modifikasi dari template Johny Joss Banget dan satu template hasil modifikasi dari Johny Kenthir.

Johny Kenthir Banget

Demo | Download

Pemasangan fitur yang ada pada template ini sama dengan Johny Kenthir template, bagi yang belum jelas silahkan tutorial Johny Kenthir template dibuka lagi. Yang perlu diperhatikan disini dalam pemasangan tab view widget per kategori yang ada di bawah video kategori, cara pemasangannya sebagai berikut :

Perhatikan gambar diatas, untuk merubah judul tab (diary, jazz dan sebagainya) cari kode berikut ini di Edit HTML :

Title1="DIARY";Title2="JAZZ";Title3="HEALTH";Title4="SPORT";Title5="COMEDY"

Setelah ketemu ganti tulisan berwarna biru diatas dengan judul yang ingin Anda tampilkan pada tabber kategori.

Sedangkan untuk mengisi widget tersebut dengan label, masih pada Edit HTML cari kode berikut ini (jangan lupa untuk mencentang expand widget template) :
Tulisan warna merah diatas adalah kelima label yang saya masukkan pada widget tabber kategori ini, silahkan Anda ganti dengan label Anda dan sesuaikan dengan judul tabber yang sudah dibuat.

Johny Light Banget

Demo | Download

Karena template ini tampilannya sama cuma beda warna saja dengan Johny Joss Banget, maka cara pemasangannya pun juga sama. Jika masih kurang jelas silahkan buka lagi tutorial pemasangan template Johny Joss banget. Untuk mengaktifkan fungsi reply pada kotak komentar, masuk ke Edit HTML jangan lupa untuk mencentang kotak Expand Widgets Templates kemudian cari kode di bawah ini :

<a expr:href='"https://www.blogger.com/comment.g?blogID=4145715786152726201&postID=" + data:post.id + "&isPopup=true&postBody=%40%3C%61%20%68%72%65%66%3D%22%23" + data:comment.anchorName + "%22%3E" + data:comment.author + "%3C%2F%61%3E#form"' onclick='javascript:window.open(this.href, "bloggerPopup", "toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=600,height=500"); return false;'>Reply</a>

Ganti blog ID warna merah diatas dengan ID blog anda yang terletak pada browser jika anda masuk ke dashbord, seperti gambar di bawah ini :

Johny Ember

Demo | Download

Blog ID untuk template ini : 7709675643058616170 cari pada Edit HTML, kemudian ganti dengan blog ID Anda untuk mengaktifkan fungsi reply. Bagi yang belum jelas mengenai cara pemasangan widget movie category pada kedua template diatas, saya akan ulangi lagi caranya disini.

Pada kedua template diatas terdapat 5 buah widget untuk category, Anda tinggal memasukkan atau ketik nama label yang ingin Anda tampilkan pada kelima widget tersebut, seperti tampak pada gambar di bawah ini :

Dari gambar diatas saya memasukkan label atau kategori "best seller" pada widget "Movie Categoy 1", silahkan Anda ganti dengan label Anda. Demikian juga untuk widget movie category lainnya, Anda tinggal ketik nama label pada kotak tersebut dan label anda akan tampil secara otomatis.

Selamat mencoba semoga bermanfaat, dan selamat menjalankan ibadah puasa.

Update Templates

My Google Code was banned, there's so many script that I put in there can't be opened. But I already fixed it with the updates ones, you can re-download this template or you can change some script below

Johny Kenthir Banget
Click this link and read subtitle "Update Template" in that post for the latest updates of Javascript

Johny Light Banget
Click this link and read subtitle "Update Template" in that post for the latest updates of Javascript

Johny Ember
Click this link and read subtitle "Update Template" in that post for the latest updates of Javascript

2 Template Kurang Kerjaan

Malam ini saya akan bagi lagi dua buah template untuk teman-teman blogger semua. Template ini sudah lama saya buat, waktu bulan puasa kemarin, pas waktu itu lagi sibuk ngurus kerjaan ya jadinya baru sekarang sempat di publish. Sudah agak lama, ya kira-kira satu bulan kalau tidak salah saya tidak berbagi template untuk teman-teman blogger. Saya rencana mau membuat template blogger sampai jumlahnya sekitar seratus, setelah itu saya berpikir untuk memutuskan mencoba membuat theme untuk Wordpress, ya itu sih hanya rencana saja realisasinya tergantung bagaimana nanti, karena membuat theme untuk Wordpress di samping butuh pengetahuan tentang kode script yang lebih, juga dibutuhkan banyak biaya, seperti mesti punya domain dan hosting sendiri dengan kapasitas yang besar.

Kedua template ini mempunyai header dan navigasi yang sama hanya berbeda warna, untuk template yang satu bertipe magazine dan satunya lagi template dua kolom, lebih sederhana dan tidak terlalu sulit untuk memasangnya. Baiklah langsung saja, berikut ini kedua template tersebut :

Johny Sompret Banget

Demo | Download

Jika Anda ingin menyimpan semua javascript yang ada pada template ini silahkan klik link download di bawah ini :

Download Javascript

Template ini bertipe magazine, banyak sekali fitur yang saya pasang pada template ini. Tidak terlalu susah untuk memasangnya, apalagi jika Anda sudah tebiasa dengan template buatan saya akan sangat mudah untuk memahaminya. Untuk lebih memudahkan dalam pemasangan widget pada template ini perhatikan screenshot layout di bawah ini :

Saya sengaja menggunakan layout Old Blogger Interface untuk memudahkan semua tampilan, soalnya kalau layout blogger baru ada fitur scroll-nya jadi tidak bisa sampai ke bawah. Berikut ini cara pemasangan fitur-fitur yang ada pada template ini :

Slider

Slider pada template ini bekerja otomatis menampilkan postingan terbaru, Cara memasangnya, perhatikan kolom pada layout diatas yang sudah saya beri tulisan slider. Setelah itu masukkan kode berikut ini ke dalamnya :
Tab View Widget per Label

Perhatikan gambar diatas, untuk merubah judul tab (diary, jazz dan sebagainya) cari kode berikut ini di Edit HTML :

Title1="DIARY";Title2="JAZZ";Title3="HEALTH";Title4="SPORT";Title5="COMEDY"

Setelah ketemu ganti tulisan berwarna biru diatas dengan judul yang ingin Anda tampilkan pada tab view widget kategori.

Sedangkan untuk mengisi widget tersebut dengan label, masih pada Edit HTML cari kode berikut ini (jangan lupa untuk mencentang expand widget template) :

Tulisan warna merah diatas adalah kelima label yang saya masukkan pada widget tabber kategori ini, silahkan Anda ganti dengan label Anda dan sesuaikan dengan judul tab view yang sudah dibuat.
Widget Label

Yang termasuk dalam widget label pada layout template ini adalah : Label 1, Label 2, Label 4, Label 4, Label 5 dan Video Category. Anda tinggal memasukkan atau ketik nama label yang sudah Anda buat pada kotak tersebut. Seperti contoh gambar di bawah :
Widget Subscribe me

Letaknya pada sidebar sebelah kanan paling atas, masih di layout kemudian pilih kotak HTML/Javascript kemudian masukkan kode berikut ini di dalamnya :
Reply Comment

Untuk mengaktifkan fungsi reply pada komantar pada template ini, ganti Blog ID pada template ini pada Edit HTML (jangan lupa centang expand widget template) : 6056708173853814595 setelah ketemu ganti dengan blog ID anda

Johny Ganteng Banget

Demo | Download

Download Javascript

Bagi Anda yang menginginkan tampilan seperti template Johny Sompret Banget tapi dengan bentuk lebih sederhana dan lebih ringan yang pasti, saya juga menyiapkan satu lagi template yang bisa anda gunakan. Template ini dinamakan demikian karena disesuaikan dengan yang bikin.... hehehehehe. Pada template ini hanya ada dua fitur yang Anda perlu diperhatikan, yaitu :

Recent Post

Terdapat pada sidebar kanan paling atas, cara pasanganya, masuk ke layout kemudian pilih HTML/Javascript kemudian masukkan kode berikut ini ke dalamnya :
Reply Comment

Untuk mengaktifkan fungsi reply pada komantar pada template ini, ganti Blog ID pada template ini pada Edit HTML (jangan lupa centang expand widget template) : 149656394876047094 setelah ketemu ganti dengan blog ID anda.

Itu tadi dua template kurang kerjaan yang saya bagikan malam ini sambil sesekali ngantuk, saya bagikan kepada semua teman blogger di seluruh dunia secara gratis, silahkan dipakai atau di download jika Anda berminat. Jika ada hal lain tentang kedua template diatas yang kurang jelas, silahkan tinggalkan komentar, saya berusaha sebisa mungkin untuk menjawab. Akhir kata selamat mencoba semoga bermanfaat

Pages

Napi Blog-g Part 2

Ads 468x60px

Labels

Minggu, 06 Oktober 2013

Cara Mengganti Tulisan Posting Baru, Beranda dan Posting Lama

Cara Memasang Widget Animasi Burung Twitter Terbang Di Blog

NEW!!! Animasi Widget Twitter di Blog

Cara Menambahkan Animasi Hewan Mengikuti Kursor/Mouse di BLOG

Angry Birds Template untuk Blog!!

Angry Birds Template untuk Blog!!

Kumpulan Animasi Sponge Bob Di Pojok Blog!!!

Mau LIKE box melayang

Sabtu, 05 Oktober 2013

Modifikasi 3 Template Valid HTML5

Membuat Domain Dot Com dengan Blogspot

Template Creating Website 2 Kolom

3 Template Modifikasi Amburadul Banget

2 Template Kurang Kerjaan

Popular Posts

Sample text

About Me

Blog Archive

Followers