"RSS is a popular format for pushing updated headlines and contents from a site to viewers. JavaScript can be used to show RSS content on your site, whether by hosting the feed yourself as seen in RSS Ajax Ticker, or through Google Feeds API, explained in the article Displaying RSS feeds easily using Google Ajax Feed API."

RSS stands for Really Simple Syndication, and is a type of XML file format.

In this tutorial, see how to use JavaScript and PHP to create a live RSS ticker that taps into any RSS feed on the web.

In this tutorial, we show you how to use Google Ajax Feed API to display RSS feeds from other sites on your own easily and without hosting the files on your own server.

Kegunaan Wapsite Khususnya bagi Blogger

Kegunaan wapsite bagi blogger adalah sebagai tempat upload Javascript,Image (png,jpg,gif,dll),sis,sisx,jar,rar,dll.
Kebanyakan dari blogger melupakan hal ini padahal wapsite adalah sebuah situs yang biasa di buat dari hp dan simple.
Tentunya ringan untuk di akses karena di khusus kan untuk pembuat website dari hp.

Berikut tutorial untuk membuat wapsite dan sekaligus mendapatkan tempat uploadnya:

Widget Jam Dengan Tipe Button

Disini saya akan memberikan tutorial membuat Widget Jam Dengan Tipe Button.
Cara membuat Widget Jam Dengan Tipe Button menggunakan teknik dari javascript.

Berikut tutorial membuat Widget Jam Dengan Tipe Button :
- login akun blogger kamu
- pilih rancangan kemudian pilih elemen laman
- pilih tambah gadget kemudian html/javascript
- copy dan paste kode di bawah ini ke dalam box atau kotak html/javascript

<script language="JavaScript"> day = new Date(); miVisit = day.getTime(); function clock() { dayTwo = new Date(); hrNow = dayTwo.getHours(); mnNow = dayTwo.getMinutes(); scNow = dayTwo.getSeconds(); miNow = dayTwo.getTime(); if (hrNow == 0) { hour = 12; ap = " AM"; } else if(hrNow <= 11) { ap = " AM"; hour = hrNow; } else if(hrNow == 12) { ap = " PM"; hour = 12; } else if (hrNow >= 13) { hour = (hrNow - 12); ap = " PM"; } if (hrNow >= 13) { hour = hrNow - 12; } if (mnNow <= 9) { min = "0" + mnNow; } else (min = mnNow) if (scNow <= 9) { secs = "0" + scNow; } else { secs = scNow; } time = hour + ":" + min + ":" + secs + ap; document.form.button.value = time; self.status = time; setTimeout('clock()', 1000); } function timeInfo() { milliSince = miNow; milliNow = miNow - miVisit; secsVisit = Math.round(milliNow / 1000); minsVisit = Math.round((milliNow / 1000) / 60); alert("There have been " + milliSince + " milliseconds since midnight, January 1, 1970. " + "You have spent " + milliNow + " of those milliseconds on this page. " + ".... About " + minsVisit + " minutes, and " + secsVisit + " seconds."); } document.write("<form name=\"form\">" + "<input type=button value=\"Click for info!\"" + " name=button onClick=\"timeInfo()\"></form>"); onError = null; clock(); </script>

Widget Jam Dengan Tipe Button

Membuat Recent Post dengan Efek Marquee

Membuat Recent Post dengan Efek Marquee ini cukup mudah caranya,hanya dengan copy dan paste kode Membuat Recent Post dengan Efek Marquee di bawah ini ke gadget atau html/javascript di blog kamu.

<script type='text/javascript'> //<![CDATA[ function RecentPostsScrollerv2(json) { var sHeadLines; var sPostURL; var objPost; var sMoqueeHTMLStart; var sMoqueeHTMLEnd; var sPoweredBy; var sHeadlineTerminator; var sPostLinkLocation; try { sMoqueeHTMLStart = "\<marquee onmouseover=\"this.stop();\" onmouseout=\"this.start();\" "; if( nWidth) { sMoqueeHTMLStart = sMoqueeHTMLStart + " width = \"" + nWidth + "%\""; } else { sMoqueeHTMLStart = sMoqueeHTMLStart + " width = \"100%\""; } if( nScrollDelay) { sMoqueeHTMLStart = sMoqueeHTMLStart + " scrolldelay = \"" + nScrollDelay + "\""; } if(sDirection) { sMoqueeHTMLStart = sMoqueeHTMLStart + " direction = \"" + sDirection + "\""; if(sDirection == "left" || sDirection =="right") { //For left and right directions seperate the headilnes by two spaces. sHeadlineTerminator = "  "; } else { //For down and up directions seperate headlines by new line sHeadlineTerminator = "\<br/\>"; } } if(sOpenLinkLocation =="N") { sPostLinkLocation = " target= \"_blank\" "; } else { sPostLinkLocation = " "; } sMoqueeHTMLEnd = "\</MARQUEE\>" sHeadLines = ""; for(var nFeedCounter = 0; nFeedCounter < nMaxPosts; nFeedCounter++) { objPost = json.feed.entry[nFeedCounter]; for (var nCounter = 0; nCounter < objPost.link.length; nCounter++) { if (objPost.link[nCounter].rel == 'alternate') { sPostURL = objPost.link[nCounter].href; break; } } sHeadLines = sHeadLines + "\<b\>"+sBulletChar+"\</b\> \<a " + sPostLinkLocation + " href=\"" + sPostURL + "\">" + objPost.title.$t + "\</a\>" + sHeadlineTerminator; } document.write(sMoqueeHTMLStart + sHeadLines + sMoqueeHTMLEnd ) } catch(exception) { alert(exception); } } //]]> </script> <script style="text/javascript"> var nMaxPosts = 20; var sBgColor; var nWidth; var nScrollDelay = 180; var sDirection="left"; var sOpenLinkLocation="Y"; var sBulletChar="*"; </script> <script style="text/javascript" src="http://tutorial-blog-amricow.blogspot.com/feeds/posts/default?alt=json-in-script&callback=RecentPostsScrollerv2"></script>

Setelah kamu copy dan paste kode Membuat Recent Post dengan Efek Marquee di atas maka ganti tulisan http://tutorial-blog-amricow.blogspot.com dengan link blog kamu.
bagaimana?
mudahkan Membuat Recent Post dengan Efek Marquee !!!!
Untuk melihat contoh Membuat Recent Post dengan Efek Marquee ini bisa di lihat di atas postingan ini.

Widget Update Status Facebook Di Blog

Seru juga ya,blogging sambil update status di blog kita sendiri..

Caranya juga mudah,hanya copy dan paste kode di gadget blog kamu..



Berikut tutorial blog cara memasang Widget Update Status Di Blog :



1. Login ke Blogger.com.

2. Klik Rancangan kemudian Elemen Laman.

3. Klik 'Add a Gadget' dan pilih HTML/Javascript.

4. Copy dan paste kode di bawah HTML/Javascript tersebut.

<center><a href="http://www.facebook.com/connect/prompt_feed.php?api_key=109155285834629" onclick="window.open('http://www.facebook.com/connect/prompt_feed.php?api_key=109155285834629','popup','width=1000,height=500,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img style="cursor: pointer;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBwU2jU2hPzgvGqwE0P9PtshI3aqg2Pj3eILoAz_s-8imkTgCUdjkFtMgLjZulyQjLgRo6ZmodWIfLnbAQBe5SbZYtlTx9iJ7lawo2cnAA5SIxsbH8727n4W4MmGoZHnKJ0eD93A0_mDQ/s1600/cooltext534048435.png" alt="tutorial-blog" border="0" /></a></center><center><a href="http://tutorial-blog-amricow.blogspot.com/2011/06/widget-update-status-di-blog.html"><span style="font-weight: bold; color: rgb(153, 153, 153);font-size:78%;" >Grab This Widget!</span></a></center>

Semoga berhasil memasang Widget Update Status Facebook Di Blog

Widget Jam Kotak (Time Box) With JavaScript







Widget Jam Kotak (Time Box) With JavaScript ini sangatlah mudah,hanya dengan copy dan paste kode di bawah ini kedalam box widget kamu.
Dibawah ini kode javascriptnya,bisa juga kamu copy dan paste di atas kode </head>

Dibawah ini kode html yang harus kamu copy dan paste di box widget kamu.

Jika ingin mengganti warna box maka lihat kode ini

<TABLE BGCOLOR="red" cellpadding=3 border=1>

ubah tulisan red dengan warna yang kamu inginkan.


Widget Jam Kotak (Time Box) With JavaScript

Tutorial Mengganti Background Blog dan Membuat Background Transparan di Blog

Kebanyakan blogger sangat senang mengganti background untuk membuat blog dia lebih dinamis tetapi ada juga blogger yang ingin tampilan blog transparan ,katanya lebih keren.
Semua itu tergantung selera sobat blogger.

Berikut Tutorial Mengganti Background Blog dan Membuat Background Transparan di Blog :

1. Carilah kode di bawah ini di template kamu,jangan lupa centang expand template widget

body {

atau

body{

2. Jika sudah ketemu maka akan terlihat seperti ini

body {
font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
font-size: 15px; font-weight: bold;
background: #fff url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8Y4j-KKa1c6-A9o9QlXNY8HOBXtQLszy2lqC-yRNQ3Fn7AXg9RlmhuqUTvcPHgpuerEl3MRP-_4QB3wkAEm3gk1dJ0F5DkVMUQseSoaPmgikWqdngl9ztjMSFomnUJX_XgJhlQ2QVb0o/s1600/Bleach.jpg") center fixed;
}

3. Pada tulisan kode background di atas merupakan warna dan gambar background blog saya.
background saya memiliki warna background putih yang tertuliskan di atas dengan kode html #fff

4. Jika Membuat background blog kamu menjadi transparan maka kodenya seperti ini

body {
font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
font-size: 15px; font-weight: bold;
background:transparent;
}

5. Jika ingin mengganti background blog kamu maka kodenya seperti ini

body {
font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
font-size: 15px; font-weight: bold;
background:#fff url("masukkan background kamu") center fixed;
}

== ganti tulisan masukkan background kamu dengan link atau url background kamu ==

Jika masih tidak mengerti,silahkan beri komentar di bawah ini.

Cara Membuat Judul Posting Berjalan

Berikut tutorial blog ini mengenai Cara Membuat Judul Posting Berjalan :

1. Login akun blogger kamu
2. Pilih rancangan kemudian edit html
3. Centeng expand template widget
4. Cari kode di bawah ini di dalam template kamu dengan menggunakan Ctrl + f
5. Back up template kamu untuk mengamankan apabila ada kesalahan

<b:if cond='data:post.title'> <h3 class='post-title entry-title'><b:if cond='data:post.link'> <a expr:href='data:post.link'><data:post.title/></a> <b:else/> <b:if cond='data:post.url'><a expr:href='data:post.url'><data:post.title/></a> <b:else/> <data:post.title/> </b:if> </b:if> </h3></b:if>

6. Jika sudah ketemu,ganti dengan kode yang di bawah ini

<b:if cond='data:post.title'> <h3 class='post-title entry-title'><marquee behavior='alternate' onmouseout='this.start()' onmouseover='this.stop()'> <b:if cond='data:post.link'> <a expr:href='data:post.link'><data:post.title/></a> <b:else/> <b:if cond='data:post.url'><a expr:href='data:post.url'><data:post.title/></a><b:else/> <data:post.title/> </b:if> </b:if> </marquee> </h3></b:if>

7. Klik pratinjau dan lihat hasilnya,jika gagal pilih bersihkan edit dan jika berhasil pilih simpan template .

Good Luck !!!

Converter Unit Length

Converter Unit Length
First, type the number you wish converted here: Then, click radio buttons for desired conversion:
From:	Square Meters	Square Inches	Square Feet	Square Yards	Square Rods	Square Chains	Roods	Acres	Square Miles
To:	Square Meters	Square Inches	Square Feet	Square Yards	Square Rods	Square Chains	Roods	Acres	Square Miles

Yang dimaksud dengan Converter Unit Length adalah sebagai konversi satuan panjang yang biasa di gunakan dalam pengkuran suatu benda.

Border di atas tidak kelihatan di karenakan warna border tabel di template saya berwarna putih

Karena belum ada yang komentar di blog aku yang ini maka script code aku berikan kepada yang komentar.

=== Terima Kasih ===

Drop Down List

Cara Membuat Drop Down List di Blog ini tidak lah susah. Cukup Membuat form dan mengisikan nama list dan url tujuan. Hal ini banyak di lakukan pada arsip dalam blog atau daftar isi blog. Kegunaan ini untuk tidak memakan widget atau tidak semak atau lagi memakan tempat. Bisa juga untuk sebagai list translator kamu dengan menggunakan cara Drop Down List ini.
Berikut tutorial Cara Membuat Drop Down List di Blog :

1. Copy dan Paste kode di bawah ini di widget yang kamu inginkan ( sudah tahu kan arti widget?)

<form name="jump"> <select name="menu"> <option value="http://ulil-amri.com">my blog1</option> <option value="http://ulil-amri.com">my blog2</option> <option value="http://ulil-amri.com">my blog3</option> <option value="http://ulil-amri.com">my blog4</option> <option value="http://ulil-amri.com">my blog5</option> <option value="http://ulil-amri.com">my blog6</option> <option value="http://ulil-amri.com">my blog7</option> <option value="http://ulil-amri.com">my blog8</option> <option value="http://ulil-amri.com">my blog9</option> <option value="http://ulil-amri.com">my blog10</option> </select> <input type="button" onClick="location=document.jump.menu.options[document.jump.menu.selectedIndex].value;" value="GO"> </form>

2. Edit aja teks my blog1 dan seterusnya dengan yang kamu inginkan. Begitu juga dengan link nya.

Gampang kan?
Di bawah ini contoh Membuat Drop Down List di Blog

my blog1 my blog2 my blog3 my blog4 my blog5 my blog6 my blog7 my blog8 my blog9 my blog10

Kode Warna Html Di Blog Dan Website Lainnya

Kamu bingung dan tidak hafal kode warna di css kamu ya?
Jangan khawatir,disini saya menyediaka Kode Warna Html di css kamu.
Pilih warna yang kamu inginkan dan copy kode warnanya yang ada di kotak Hex.

Hex:

Hue:		Red:
Saturation:		Green:
Value:		Blue:

Merubah Tulisan ReadMore dengan Gambar

Merubah Tulisan ReadMore dengan Gambar ini hanyalah menambah kode menampilkan gambar sebagai pengganti tulisan readmore kalian sebelumnya.




Tutorial :



- Login akun blogger kamu
- Pilih rancangan kemudian edit html kemudian centang expand template widget
- Cari kode di bawah di template kamu

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

- Jika sudah ketemu maka ganti tulisan readmore kamu dengan kode di bawah ini

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXbDLzX-b_gWkLF704EVSR1olA3-2_JMSgLE5uKbpqh9V5r8z3L-Sj0v-1pbmN7qljOXuYBQA2PPcHUC9LfKkm_jrJdWhqjlmi86j4PBkFaHChIOJe2gWeilNN0tA5JDjreaCZQWZZPsQ/s1600/read_more%25281%2529.jpg'"/>

- Save dan lihat hasilnya

Pasang Musik atau Mp3 di Blog

Seru juga ya jika ada musik atau mp3 di blog kita.Sambil membuat postingan bisa dengarin lagu kesayangan kita di blog.
Cukup menyenangkan hati sambil berkata la la la la...

Berikut Musik atau Mp3 Online Di blog

MIXPOD

MUSIK-LIVE

PLAYLIST-MP3

VIDEOKEMAN

Disini aku tidak memberitahu caranya karena cukup mudah.Hanya mengikuti perintah dari penyedia mp3 online saja.
Jika sudah mendapatkan kode embed mp3 online tesebut maka
- copy dan paste di widget kamu dengan cara copy kodenya kemudian beralih ke blog kamu
- Pilih rancangan kemudian elemen laman.
- Setelah itu pilih tamba gadeget kemudian html/javascript
- Paste kode embed yang telah kamu copy tadi
- Simpan dan liha blog kamu
- Selamat berdendang ria !!!

Membuat Navigasi Breadcrumd di Blog

Kegunaan dari Membuat Navigasi Breadcrumd di Blog adalah sebagai navigasi yang mempermudah pengunjung untuk membaca artikel blog kita dan Navigasi Breadcrumd berada tepat di atas postingan kita. Contohnya bisa di lihat dari screenshoot di atas.

Berikut tutorial Membuat Navigasi Breadcrumd di Blog :

1. Login akun blogger kamu
2. Pilih rancangan kemudian edit html dan centang expand template widget akan tetapi backup terlebih dahulu template kamu untuk mengamankan template blog kamu apabila adalah kesalahan
3. Cari kode ]]></b:skin> di template kamu dengan cara menggunakan Ctrl+f
4. Copy dan paste kode di bawah ini di atas kode ]]></b:skin>

.breadcrumbs { padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:95%; line-height: 1.4em; border-bottom:4px double #cadaef; }

5. Cari kode <div class='post hentry'> yang di atasnya ada kode seperti ini <b:includable id='post' var='post'> maka akan terlihat seperti di bawah ini

<b:includable id='post' var='post'> <div class='post hentry'>

6. Copy dan paste kode di bawah ini di bawah kode <div class='post hentry'>

<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == "item"'> <div class='breadcrumbs'> Browse » <a expr:href='data:blog.homepageUrl'>Home</a> » <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != "true"'> , </b:if> </b:loop> </b:if> » <data:post.title/> </div> </b:if> </b:if>

7. Save dan lihat blog kamu

** Berikut adalah kumplan marquee ** 

Marquee Kanan Ke Kiri :

TUTORIAL-BLOG-AMRICOW-ULIL AMRI

Marquee Kiri Ke Kanan :

TUTORIAL-BLOG-AMRICOW-ULIL AMRI

Marquee Bolak balik kiri kanan :

TUTORIAL-BLOG-AMRICOW-ULIL AMRI

Marquee Ke Atas :

TUTORIAL-BLOG-AMRICOW-ULIL AMRI

Marquee Ke Bawah :

TUTORIAL-BLOG-AMRICOW-ULIL AMRI

Marquee Ke Atas Bawah bolak-balik :

TUTORIAL-BLOG-AMRICOW-ULIL AMRI

Marquee Zigzag kiri ke kanan:

TUTORIAL-BLOG-AMRICOW-ULIL AMRI

Marquee Zigzag kanan ke kiri:

TUTORIAL-BLOG-AMRICOW-ULIL AMRI

Marquee Zigzag kanan kiri bolak-balik :

TUTORIAL-BLOG-AMRICOW-ULIL AMRI

Marquee Zigzag kiri kanan bolak-balik :

TUTORIAL-BLOG-AMRICOW-ULIL AMRI

Hahahhah...
Jadi ingin punya marquee seperti itu ya???
Ada di bawah ini Kode Kumpulan Marquee ..

1. Marquee Kanan Ke Kiri

<marquee><span style="color: blue; font-family: Arial;">TUTORIAL-BLOG-AMRICOW-ULIL AMRI</span></marquee>

2. Marquee Kiri Ke Kanan

<marquee direction="right"><span style="color: blue; font-family: Arial;">TUTORIAL-BLOG-AMRICOW-ULIL AMRI</span></marquee>

3. Marquee Bolak balik kiri kanan

<marquee behavior="alternate"><span style="color: blue; font-family: Arial;">TUTORIAL-BLOG-AMRICOW-ULIL AMRI</span></marquee>

4. Marquee Ke Atas

<marquee direction="up"><span style="color: blue; font-family: Arial;">TUTORIAL-BLOG-AMRICOW-ULIL AMRI</span></marquee>

5. Marquee Ke Bawah

<marquee direction="down"><span style="color: blue; font-family: Arial;">TUTORIAL-BLOG-AMRICOW-ULIL AMRI</span></marquee>

6. Marquee Ke Atas Bawah bolak-balik

<marquee direction="up" behavior="alternate"><span style="color: blue; font-family: Arial;">TUTORIAL-BLOG-AMRICOW-ULIL AMRI</span></marquee>

7. Marquee Zigzag ke kanan

<marquee behavior="alternate" direction="up" width="100%"><marquee direction="right"><span style="color: blue; font-family: Arial;">TUTORIAL-BLOG-AMRICOW-ULIL AMRI</span></marquee></marquee>

8. Marquee Zigzag ke kiri

<marquee behavior="alternate" direction="up" width="100%"><marquee direction="left"><span style="color: blue; font-family: Arial;">TUTORIAL-BLOG-AMRICOW-ULIL AMRI</span></marquee></marquee>

9. Marquee Zigzag kanan kiri bolak-balik

<marquee behavior="alternate" direction="up" width="100%"><marquee behavior="alternate" direction="right"><span style="color: blue; font-family: Arial;">TUTORIAL-BLOG-AMRICOW-ULIL AMRI</span></marquee></marquee>

10. Marquee Zigzag kanan kiri bolak-balik

m

Membuat Widget atau Gambar Berada di Pojok

Berikut adalah tutorial blog mengenai Membuat Widget atau Gambar Berada di Pojok bawah kanan , Membuat Widget atau Gambar Berada di Pojok bawah kiri , Membuat Widget atau Gambar Berada di Pojok atas kanan , Membuat Widget atau Gambar Berada di Pojok atas kiri .

1. Kode Css Membuat Widget atau Gambar Berada di Pojok atas kanan

#amricow_pojok { position:fixed;_position:absolute;top:0px; right:0px; clip:inherit; _top:expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

2. Kode Css Membuat Widget atau Gambar Berada di Pojok atas kiri

#amricow_pojok { position:fixed;_position:absolute;top:0px; left:0px; clip:inherit; _top:expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

3. Kode Css Membuat Widget atau Gambar Berada di Pojok bawah kiri

#amricow_pojok { position:fixed;_position:absolute;bottom:0px; left:0px; clip:inherit; _top:expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

4. Kode Css Membuat Widget atau Gambar Berada di Pojok bawah kanan

#amricow_pojok { position:fixed;_position:absolute;bottom:0px; right:0px; clip:inherit; _top:expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

5. Cara penggunaan Membuat Widget atau Gambar Berada di Pojok sebagai berikut :

- Login akun blogger kamu
- Pilih rancangan kemudian edit html dan centang expand template widget
- Copy dan paste kode css yang kamu inginkan di bawah kode ]]></b:skin>
- Setelah itu copy dan paste kode html di bawah ini sebelum kode </body> atau bisa juga kamu copy dan paste kode html di bawah ini di gadget atau widget (html/javascript)

6. Kode Html Membuat Widget atau Gambar Berada di Pojok

<div id="amricow_pojok"> <a href="http://tutorial-blog-amricow.blogspot.com/"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIN_TZl_pVNTsSa1oGvcsogWUpm4lZ2hpn-yz0FS-GLQ6NHccctc0bPxoAfSM8m1rmqtV06rUHcP7kK_qnRQmqtXyi8ODXDK5RYX1yejtQqLne6nhhqoMKobhwoyU-OSOO50A-lnTiVlY/s1600/PasangGambardiPojokBlog.jpg" border="0" /></a> Letakkan kode html kamu disini </div>

7. Save dan lihat hasilnya.

Cara Membuat Title Blog di Addres Bar Bergerak dengan Cepat

Berikut tutorial blog ini mengenai Cara Membuat Title Blog di Addres Bar Bergerak dengan Cepat yang tidak begitu susah,hanya copy dan paste kode di bawah ini di widget kamu.
Contohnya bisa kamu lihat di addres bar browser kamu terlihat tulisan Tutorial | Blog | Amricow yang bergerak.

<script language="JavaScript"> <!-- // //Scrolling Status Bar putmsg="Tutorial | Blog | Amricow"; letchar2="***^_^***"; letchar1="***^_^***";ultimo1=letchar1.length-1; ultimo2=letchar2.length-1; ultimo2=letchar2.length-1; tiempo=setTimeout("stat_scroll()",.1); function stat_scroll() { aux1=letchar1.charAt(ultimo1-1); letchar1=aux1+letchar1.substring(0,ultimo1-1); aux2=letchar2.charAt(0); letchar2=letchar2.substring(1,ultimo2+1)+aux2; window.status="(" + letchar2 + putmsg + letchar1 + ")"; tiempo=setTimeout("stat_scroll()",.1); return true; } // --> </script> <script language="JavaScript"> <!-- // putmsg="Tutorial | Blog | Amricow"; letchar2="***^_^***"; letchar1="***^_^***"; ultimo2=letchar2.length-4; ultimo2=letchar2.length-4; tiempo=setTimeout("tit_scroll()",.1); function tit_scroll() { aux1=letchar1.charAt(ultimo1-1); letchar1=aux1+letchar1.substring(0,ultimo1-1); aux2=letchar2.charAt(0); letchar2=letchar2.substring(1,ultimo2+1)+aux2; document.title="" + letchar2 + putmsg + letchar1 + ""; tiempo=setTimeout("tit_scroll()",.1); return true; } // --> </script>

Edit sendiri ya terutama yang tulisan Tutorial | Blog | Amricow

• TUTORIAL BLOG
• TUTORIAL BLOG
• TUTORIAL BLOG
• TUTORIAL BLOG
• TUTORIAL BLOG
• TUTORIAL BLOG

Berikut adalah tutorial Cara Membuat Horizontal List di postingan blog kamu atau di widget.

- Copy dan paste kode css di bawah ini di tempat yang kamu inginkan
- Jika kamu ingin pasang css ini di template kamu,maka cari kode ]]></b:skin> di template kamu dan copy css di bawah ini dan paste di template kamu.
Bisa juga di paste di atas kode </head>

<style type="text/css"> #horzlist li { display: inline; list-style-type: none; text-decoration: none; font-size: 14px; font-family: Verdana; font-weight: bolder; padding: 0 20px 0 5px; color: #000099; } #horzlist li a, #horzlist li a:visited { color: #000000; text-decoration: none; } #horzlist li a:hover { color: #ffffff; } </style>

- Di bawah ini kode html Horizontal List ,copy dan paste di widget atau di postingan kamu.

<div id="horzlistcontainer"><ul id="horzlist"><li id="active"><a href="http://tutorial-blog-amricow.blogspot.com/" id="current">TUTORIAL BLOG</a></li> <li><a href="http://tutorial-blog-amricow.blogspot.com/">TUTORIAL BLOG</a></li> <li><a href="http://tutorial-blog-amricow.blogspot.com/">TUTORIAL BLOG</a></li> <li><a href="http://tutorial-blog-amricow.blogspot.com/">TUTORIAL BLOG</a></li> <li><a href="http://tutorial-blog-amricow.blogspot.com/">TUTORIAL BLOG</a></li> <li><a href="http://tutorial-blog-amricow.blogspot.com/">TUTORIAL BLOG</a></li> </ul></div>

- Edit sendiri ya html dan kode css warnanya.

Membuat Link Berkedip Warna Warni

Tutorial blog kali ini adalah mengenai cara Membuat Link Berkedip Warna Warni

Caranya :

1. Login akun blogger kamu
2. Pilih rancangan kemudian edit html
3. Cari kode </head> di template kamu
4. Copy dan paste kode di bawah ini di bawah kode </head>

<script src='http://amricow-file.googlecode.com/files/colorful.js'></script>

Pasang atau Merubah Kursor di Blog

Tutorial Blog yang saya post ini adalah mengenai cara memasang atau merubah kursor di blog kamu.
Ini cukup menarik di pasang di dalam blog kamu.

Jika kamu ingin merubah kursor di blog kamu,silahkan kesini

Caranya :

1. Pilih category kursor yang kamu inginkan
2. Pilih kursor yang ingin kamu pasang di blog
3. Setelah kamu pilih kursor maka akan di tampilkan kode. Copy dan paste kode tersebut di widget (html/javascript) kamu
4. Lihat blog kamu

Nb: Jangan pilih kursor animasi atau yang bergerak karena hanya bekerja di browser internet explorer

Konversi px, em, pt dan % dalam CSS

Berikut adalah tutorial blog mengenai konversi em, px, pt dan %.Tidak ada penjelasan khusus mengenai konversi px, em, pt dan % dalam CSS.Hanya saja pemahaman saja dari kamu.

pt	px	em	%
6	8	0.5	50
7	9	0.55	55
7.5	10	0.625	62.5
8	11	0.7	70
9	12	0.75	75
10	13	0.8	80
10.5	14	0.875	87.5
11	15	0.95	95
12	16	1	100
13	17	1.05	105
13.5	18	1.125	112.5
14	19	1.2	120
14.5	20	1.25	125
15	21	1.3	130
16	22	1.4	140
17	23	1.45	145
18	24	1.5	150
20	26	1.6	160

Membuat Link Daftar Isi atau Arsip Open In New Tab

Berikut adalah tutorial Membuat Link Daftar Isi atau Arsip Open In New Tab

1. Login akun blogger
2. Rancangan kemudian edit html dan centang expand template widget
3. Cari kode html dibawah ini di template blog kamu

<b:loop values='data:posts' var='i'>

4. Kode html yang terlihat akan seperti ini

<b:loop values='data:posts' var='i'> <li><a expr:href='data:i.url'><data:i.title/></a></li>

5. Ganti kode di atas tersebut dengan kode di bawah ini

<b:loop values='data:posts' var='i'> <li> <a expr:href='data:i.url' target='_blank'><data:i.title/></a> </li>

6. Simpan dan buka blog kamu kemudian klik link arsip kamu

Cara Membuat Spoiler di Blog

Postingan ini berisikan Tutorial Cara Membuat Spoiler di Blog.
Jika ada diantara kamu yang tidak tahu arti dari spoiler,bisa di lihat screenshot tutorial blog ini.
Spoiler ini kamu letakkan di widget yang ingin kamu pasang spoiler atau bisa juga di letakkan di dalam postingan kamu.

<div><div style="margin: 5px;"> <div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Spoiler for : BlaBlaBla...</span></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName ('div')[1].getElementsByTagName('div') [0].style.display != '') { this.parentNode.parentNode.getElementsByTagName ('div')[1].getElementsByTagName('div') [0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName ('div')[1].getElementsByTagName('div') [0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"/> </div> <div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;"> <div style="display: none;"> isi spoiler kamu disini </div></div></div></div>

Postingan selanjutnya akan saya hadirkan Cara Membuat Spoiler di Blog dengan border dan warna.

Javascript No Rght Click (tidak bisa klik kanan di blog)

Postingan ini mengenai sebuah blog yang tidak bisa klik kanan atau anti klik kanan dan memberikan notice atau pesan. Biasanya blogger menggunakan ini untuk memperkecil kemungkinan agar script blog dia tidak di ambil oleh orang lain. Caranya sangat mudah,hanya tambahkan gadget atau widget kemudian copy dan paste kode yang dibawah ini.

<script> var message="Upss!!! Dont Right Click"; /////////////////////////////////// function clickIE4(){if (event.button==2){alert(message);return false;}} function clickNS4(e){if (document.layers||document.getElementById&&!document.all){if (e.which==2||e.which==3){alert(message);return false;}}} if (document.layers){document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS4;} else if (document.all&&!document.getElementById){document.onmousedown=clickIE4;} document.oncontextmenu=new Function("alert(message);return false") </script>

Tutorial Javascript No Rght Click (tidak bisa klik kanan di blog) ini tidak sepenuhnya mengamankan template atau script anda dari orang yang tidak bertanggung jawab.

Cara Membuat Blog Berputar Saat di buka

Berikut adalah Tutorial Cara Membuat Blog Berputar saat di buka



1. Login akun blogger kamu


2. Pilih rancangan kemudian edit html


3. Copy dan Paste di kode dibawah ini di atas <head>

<script> //<![CDATA[ window.scrollBy(0,0) window.resizeTo(0,0) window.moveTo(0,0) //setInterval("move()",10); setTimeout("move()", 1); var mxm=100000 var mym=100000 var mx=100000 var my=100000 var sv=70 var status=1 var szx=0 var szy=0 var c=25 var n=0 var sm=10 var cycle=2 var done=2 function move() { if (status == 1) { mxm=mxm/1.01 mym=mym/1.01 mx=mx+mxm my=my-mym mxm=mxm+(500-mx)/5 mym=mym-(400-my)/5 window.moveTo(mx,my) rmxm=Math.round(mxm/1) rmym=Math.round(mym/2) if (rmxm == 0) { if (rmym == 0) { status=2 } } } if (status == 2) { sv=sv/1.1 scrratio=1+1/3 mx=mx-sv*scrratio/2 my=my-sv/2 szx=szx+sv*scrratio szy=szy+sv window.moveTo(mx,my) window.resizeTo(szx,szy) if (sv < 0.1) { status=3 } } if (status == 3) { document.fgColor=0xffffFF c=c-16 if (c<0) {status=8} } if (status == 4) { c=c+16 document.bgColor=c*65536 document.fgColor=(255-c)*65536 if (c > 239) {status=5} } if (status == 5) { c=c-16 document.bgColor=c*65536 document.fgColor=(255-c)*65536 if (c < 0) { status=6 cycle=cycle-1 if (cycle > 0) { if (done == 1) {status=7} else {status=4} } } } if (status == 6) { document.title = "Cljck" alert("Cljck") cycle=2 status=4 done=1 } if (status == 7) { c=c+4 document.bgColor=c*65536 document.fgColor=(255-c)*65536 if (c > 128) {status=8} } if (status == 8) { window.moveTo(0,0) sx=screen.availWidth sy=screen.availHeight window.resizeTo(sx,sy) status=9 } var timer=setTimeout("move()",0) } //]]> </script>

Nb: Sebenarnya tutorial blog Cara Membuat Blog Berputar ini tidak perlu di pasang di blog karena tidak ada nilai elegant yang di tampilkan.

Membuat atau Menambahkan Teks di Bagian Komentar

Tutorial blog kali ini cukup mudah.kita hanya menuliskan pesan-pesan kamu di atas bagian kotak komentar.

Berikut tutorial blog cara Membuat atau Menambahkan Teks di Bagian Komentar :

1. Wajib Login akun blogger kamu
2. Pilih Pengaturan kemudian pilih komentar

Hasilnya akan menjadi seperti ini

Submit Blog atau Website di www.Alexa.com

www.Alexa.com adalah sebuah website yang mengaudit tingkat popularitas atau statistik web atau blog yang dilansir oleh www.alexa.com berdasarkan traffic atau jumlah kunjungan setiap halaman blog.
www.Alexa.com ini juga sangat berpengaruh dalam kegunaan search engine optimasization.
Jika di tanya pagerank blog ini di alexa.com ada di peringkat berapa?
hihihiihh...
masih sangat di bawah pagerank alexa.com blog ini.

Berikut tutorial Submit Blog atau Web di www.Alexa.com

1. Register dan Login dulu di www.alexa.com (saran aku adalah login lewat facebook aja biar ga repot)

2. Pilih Site Tools kemudian lihat di bagian bawah pilih claim your site

3. Kemudian Masukkan url atau alamat website atau blog kamu yang ingin kamu submit di www.alexa.com di bagian kotak claim your site

4. Setelah url kamu di masukkan,lakukan verifikasi meta tag

5. Kemudian www.alexa.com akan melihat verifikasi meta tag di blog kamu.Jika terjadi error maka lakukan verifikasi ulang meta tag

Setelah berhasil verifikasi meta tag di blog kamu,maka www.alexa.com akan selalu mengaudit website atau blog kamu.
Nb: Jika ada yang tidak bisa verifikasi meta tag di blog kamu,silahkan komentar.

Cara menambah Elemen atau Widget Baru di Header Blog

1. Login ke akun blog kamu
2. Pilih Rancangan,edit html dan centang kolom expand template widget (backup template kamu terlebih dahulu
3. Carilah Kode di bawah ini
4. Pencarian cepat menggunakan Ctrl + F

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

5. Ubah kode diatas dengan kode yang dibawah ini

<b:section class='header' id='header' maxwidgets='2' showaddelement='yes'>

6. Save template
7. Buka Elemen Laman untuk melihat hasilnya.

Nb: Jika kamu tidak berhasil menambah Elemen atau Widget Baru di Header Blog ini mungkin disebabkan di template tidak tertuliskan header.
Bisa aja di template tertuliskan title logo.
Hal yang terpenting cari di template kamu seperti kode ini maxwidgets='1'
Jika sudah ketemu,lakukan seperti langkah di atas yang hanya merubah menjadi maxwidgets='2' showaddelement='yes'