Natures' Bizarre Phenomena.
Showing posts with label blogger tutorial. Show all posts
Showing posts with label blogger tutorial. Show all posts

Menambah pengunjung blog



Kadang-kadang kita jadi malas nge-blog gara2 blog yang kita buat dengan susah payah sepi pengunjung. Tapi jangan menyerah dulu. Saya mempunyai beberapa tips yang saya dapatkan dari beberapa blog dan sesama rekan blogger, beberapa memang efektif dan ada juga yang sedikit extrim...



  1. Berikan komentar di blog lain: Telah terbukti bahwa memberi komentar pada blog orang lain dapat menambah pembaca blog anda. Tinggalkan komentar yang baik, campurkan dengan humor. Ketika anda menemukan post yang mengundang kontroversi, tinggalkan komentar anda dengan kesan bahwa anda sudah dewasa, kontroversi adalah cara yang paling efektif untuk menjadi terkenal dengan usaha yang minimal tapi jangan buat orang menjadi marah pada anda.
  2. Masukan artikel anda pada website Social Networking: Website Social Networking adalah tempat terbaik dimana anda dapat memasukan artikel anda dan mendapat lonjakan pengunjung pada blog anda. Jika orang suka, otomatis mereka akan membuat link tersebut.
  3. Berikan komentar anda pada komunitas online: Bergabung dan ambil bagian pada forum dan komunitas online. Jangan lupa untuk menggunakan signature dengan alamat blog anda. Komentar anda pada komunitas dan forum akan menjadikan anda salah satu yang dihormati di komunitas.
  4. Tandai artikel: Tanyai pengunjung anda untuk menandai artikel anda. Website seperti StumbleUpon, deLicio.us, Google Bookmarks dan deLirio.us dapat menyediakan dengan tambahan pengunjung.
  5. Berinteraksi dengan pemberi komentar: Buatlah hubungan yang harmonis dengan pengomentar blog anda. Buat mereka merasa seperti di rumah dan mereka juga akan membuat anda merasa di rumah. Selalu bantu pengomentar anda dengan sumber yang berguna, jika itu tidak memungkinkan, arahkanlah mereka ke tempat yang dapat menyelesaikan masalah.
  6. Tulis dengan konsisten: Tulislah pada tingkat minimal 3-5 artikel yang berguna dalam seminggu. Melakukan ini akan membuat pengunjung anda mengerti bahwa anda blogger yang berdedikasi, yang peduli untuk membantu. Jika anda tidak konsisten untuk menulis, lalu mengapa pengunjung anda harus juga konsisten.
  7. Masukan blog anda pada Blog Directories: Masukan blog anda pada Technorati, Techmeme, Blogcatalog, dan blog directories lainnya. Blog directories juga merupakan sebuah tempat dimana anda dapat memasukan blog anda dan mendapatkan pengunjung.
  8. Hubungkan dengan artikel lain: Hubungan ke dalam dan ke luar sangatlah membantu.Pertama, itu membantu anda dalam menyediakan bukti mengenai pemikiran anda dan juga membantu pembaca terhubung dengan artikel yang berguna.
  9. RSS Feeds: Selalu sindikasikan RSS melalui feedburner, mengapa?. Karena mereka yang terbaik.
  10. Buat stiker yang tertulis situs web anda dan tempelkan di helm maupun motor anda, anda akan seperti iklan berjalan
  11. Bila stiker website yang anda tempelkan di motor dan helm anda masih sisa, tempelkan di angkutan umum secara diam-diam.
  12. Bila anda ke warnet, siapkan spidol marker dan jangan pasang wajah mencurigakan. Tuliskan nama website anda di meja warnet. Orang yang duduk di situ kemungkinan besar akan membuka site anda, karena internet sudah ada di depan mata. Atau bila di warnet tsb tidak dipasang deepfreeze, ganti wallpapernya dengan nama website anda
  13. Tuliskan nama website anda di uang kertas. kalo bisa bayarkan uang yang sudah anda coret2 itu ke warnet. Intinya edarkan uang yang anda coret2 tadi ke kawasan orang yang melek teknologi
  14. Promosikan website anda di facebook dengan cara bertubi-tubi. kenalan anda pasti melihatnya dan akan iseng-iseng membuka website anda
  15. Masukkan link program populer di blog anda beserta crack atau serial number-nya sekalian. Soalnya orang indonesia suka yang gratis dan bajakan.
  16. Sertakan sedikit (atau banyak) bumbu 'hot' ke dalam website anda seperti miyabi, asia carera dan sebangsanya. Bila situs anda adalah situs religius dan belum terlalu terkenal, masukkan tag porno ke dalamnya. Dijamin akan membuat geger dan menjadi kontroversial, yang artinya menambah jumlah pengunjung (ini ilmiah)
  17. Buat aksi kriminal di kampung anda dan tinggalkan nama website anda di TKP. pasti website anda akan terkenal dalam sekejap dan kebanjiran pengunjung terutama dari pihak kepolisian
  18. Atau anda mau pengunjung bohongan? buat aja iframe 1 x 1 pixel lalu ditumpuk banner/link anda yang asli. Pengunjung yang mampir ke blog yang pasang banner anda otomatis akan mejadi pengunjung anda juga ,..untuk script iframe lihat di google sendiri ya ... (saya lagi males njelasin hehehe).

Read More..

Membuat kursor "ular"

Pertama kali saya tahu  kursor "ular", yaitu saat saya blogwalking ke situs teman. Saat kursor bergeser, ada serangkaian tulisan yang selalu mengikuti mouse, jadi seakan-akan seperti ular. Setelah surfing di internet, akhirnya dapat juga skripnya. Nah, gini caranya:
1. Login ke blogger
2. masuk ke layout-->edit html
3. cari kode </head> (sebaiknya sebelum langkah selanjutnya, template di-backup dulu)
4. Copy paste kode di bawah ini di atas </head>





<style type='text/css'>

/* Circle Text Styles */

#outerCircleText {

/* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */

font-style: italic;

font-weight: bold;

font-family: 'comic sans ms', verdana, arial;

color: #000;

/* End Optional */



/* Start Required - Do Not Edit */

position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}

#outerCircleText div {position: relative;}

#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}

/* End Required */

/* End Circle Text Styles */

</style>

<script type='text/javascript'>

//<![CDATA[

/* Circling text trail- Tim Tilton

Website: http://www.tempermedia.com/

Visit: http://www.dynamicdrive.com/ for Original Source and tons of scripts

Modified Here for more flexibility and modern browser support

Modifications as first seen in http://www.dynamicdrive.com/forums/

username:jscheuer1 - This notice must remain for legal use

*/



;(function(){



// Your message here (QUOTED STRING)

var msg = "
Teks Anda di sini";



/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */



// Set font's style size for calculating dimensions

// Set to number of desired pixels font size (decimal and negative numbers not allowed)

var size = 
24;



// Set both to 1 for plain circle, set one of them to 2 for oval

// Other numbers & decimals can have interesting effects, keep these low (0 to 3)

var circleY = 0.75; var circleX = 2;



// The larger this divisor, the smaller the spaces between letters

// (decimals allowed, not negative numbers)

var letter_spacing = 5;



// The larger this multiplier, the bigger the circle/oval

// (decimals allowed, not negative numbers, some rounding is applied)

var diameter = 10;



// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)

var rotation = 0.4;



// This is not the rotation speed, its the reaction speed, keep low!

// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)

var speed = 0.3;



////////////////////// Stop Editing //////////////////////



if (!window.addEventListener && !window.attachEvent || !document.createElement) return;



msg = msg.split('');

var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,

ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],

o = document.createElement('div'), oi = document.createElement('div'),

b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement :



document.body,



mouse = function(e){

e = e || window.event;

ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position

xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position

},



makecircle = function(){ // rotation/positioning

if(init.nopy){

o.style.top = (b || document.body).scrollTop + 'px';

o.style.left = (b || document.body).scrollLeft + 'px';

};

currStep -= rotation;

for (var d, i = n; i > -1; --i){ // makes the circle

d = document.getElementById('iemsg' + i).style;

d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) +



'px';

d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';

};

},



drag = function(){ // makes the resistance

y[0] = Y[0] += (ymouse - Y[0]) * speed;

x[0] = X[0] += (xmouse - 20 - X[0]) * speed;

for (var i = n; i > 0; --i){

y[i] = Y[i] += (y[i-1] - Y[i]) * speed;

x[i] = X[i] += (x[i-1] - X[i]) * speed;

};

makecircle();

},



init = function(){ // appends message divs, & sets initial values for positioning arrays

if(!isNaN(window.pageYOffset)){

ymouse += window.pageYOffset;

xmouse += window.pageXOffset;

} else init.nopy = true;

for (var d, i = n; i > -1; --i){

d = document.createElement('div'); d.id = 'iemsg' + i;

d.style.height = d.style.width = a + 'px';

d.appendChild(document.createTextNode(msg[i]));

oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;

};

o.appendChild(oi); document.body.appendChild(o);

setInterval(drag, 25);

},



ascroll = function(){

ymouse += window.pageYOffset;

xmouse += window.pageXOffset;

window.removeEventListener('scroll', ascroll, false);

};



o.id = 'outerCircleText'; o.style.fontSize = size + 'px';



if (window.addEventListener){

window.addEventListener('load', init, false);

document.addEventListener('mouseover', mouse, false);

document.addEventListener('mousemove', mouse, false);

if (/Apple/.test(navigator.vendor))

window.addEventListener('scroll', ascroll, false);

}

else if (window.attachEvent){

window.attachEvent('onload', init);

document.attachEvent('onmousemove', mouse);

};



})();

//]]>

</script>

5.  Ganti tulisan berwarna biru dengan teks yang nantinya jadi "ular-ularan"
6. Tulisan berwarna hijau adalah ukuran text, bisa diubah bisa tidak
7. save..dan lihat hasilnya




Read More..

Memasang "expand post"

Berikut ini adalah cara untuk menunjukkan ataupun menyembunyikan full post anda dari halaman utama blog. Cara ini berbeda dengan read more. Jika dengan metode read more, akan ada link read more di bawah post. Jika anda click link tersebut, maka browser anda akan membuka page baru untuk artikel anda. Tapi dengan metode ini, jika anda click link-nya, maka akan terlihat full post di page yang sama, dan tidak perlu load page lagi. Jadi cuma memperluas post anda

1. Login blogger layout-->Template-->edit HTML
2. Klik "Download full template" untuk Back-up data
3. Centang "expand widget template" checkbox
4. Salin kode di bawah ini di atas kode </head>
    <script src='http://www.fileden.com/files/2009/6/7/2468759/expand-post.txt' type='text/javascript'/>
5. Temukan kode <div class='post-header-line-1'/>
6. Jika anda menemukannya, anda akan melihat kode seperti ini
<div class='post-body entry-content'>
atau
<div class='post body'>

7. Langkah selanjutnya adalah mengganti kodenya (hanya kode yang ditunjukkan di no 6) menjadi seperti ini:
<div class='post-body entry-content' expr:id='"post-" + data:post.id'> <b:if cond='data:blog.pageType == "item"'>
atau menjadi seperti ini
<div class='post body' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>

8. di bawahnya anda akan lihat kode seperti ini <p><data:post.body/></p>
9. Letakkan kode ini di bawahnya
<b:else/> <style>#fullpost {display:none;}</style> <p><data:post.body/></p> <span id='showlink'> <p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Show Full Post...</a></p> </span> <span id='hidelink' style='display:none'> <p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-]Hide Full Post...</a></p> </span> <script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script> </b:if>

11. Simpan hasil edit-an anda
12. Ke menu Setting --> Formatting
13. Di halaman bagian bawah, ada "Post Template", copy paste kode di bawah ini ke box

<span id="fullpost"> </span>

14. Simpan setting anda
15. Jika anda hendak menulis artikel, tulis bagian artikel yang akan ditampilkan di atas kode <span id="fullpost"> dan sisanya di  <span id="fullpost">kelanjutan artikel</span>
Read More..

Memasang "Recent comment"

Fungsi dari "Recent Comment" sebenarnya agak mirip dengan recent post, cuma bedanya kalau recent comment menampilkan komentar-komentar terbaru pada blog anda, untuk lebih jelasnya, mari kita lihat cara membuat recent comment di bawah ini:

  • Login dulu ke account blogger kamu.
  • Pilih tab Tata Letak --> Elemen Halaman.
  • Tambah Gadget dalam elemen blog kamu (rekomendasi : Di bawah atau di samping gadget Posting Terbaru)
  • Dalam "Tambahkan Gadget", pilih HTML/JavaScript
  • Copy dan pastekan kode di bawah ini dan jangan lupa diberi judul (ex : Komentar terbaru)

<script style="text/javascript" src="http://www.fileden.com/files/2009/6/7/2468759/recent-comment.txt"></script><script style="text/javascript">var numcomments = 5;var showcommentdate = true;var showposttitle = true;var numchars = 100;var standardstyling = true;</script><script src="http://johnthor.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

Catatan :
Ganti kode yang berwarna merah dengan alamat penyimpanan file "komentarterbaru.txt" kamu sendiri (ex : Geocities). Kalau tidak biarkan apa adanya.

  • Ganti kode yang berwarna hijau dengan alamat blog kamu.

Read More..

Memasang "Recent Post"

"Recent post" merupakan sejumlah daftar posting yang terbaru dalam suatu blog dan berisi informasi singkat mengenai posting tersebut yang tersusun secara sistematis. Biasanya menghiasi dalam elemen sidebar untuk memberikan keterangan kepada pengunjung tentang terbitnya suatu posting. Fungsinya bersifat otomatis, dimana postingan yang sudah lama dalam urutan daftar posting akan langsung digantikan dengan yang terbaru. Ingin tahu cara memasangnya di blog kamu? langsung kita review triknya :

  • Login dulu ke account blogger kamu.
  • Pilih tab Tata Letak --> Elemen Halaman.
  • Tambah Gadget dalam elemen blog kamu (rekomendasi : Sidebar).
  • Dalam "Tambahkan Gadget", pilih HTML/JavaScript.
  • Copy dan pastekan kode di bawah ini dan jangan lupa diberi judul (ex : Posting terbaru).

<script style="text/javascript" src="http://www.fileden.com/files/2009/6/7/2468759/recent-post.txt"></script><script style="text/javascript">var numposts = 5;var showpostdate = true;var showpostsummary = true;var numchars = 100;var standardstyling = true;</script><script src="http://johnthor.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script>

Catatan :
Ganti kode yang berwarna hijau dengan alamat penyimpanan file "postingterbaru.txt" kamu sendiri (ex : Geocities). Kalau tidak biarkan apa adanya.

  • Ganti kode yang berwarna merah dengan alamat blog kamu.

Read More..

Membuat Tab view pada blog

Menambahkan tab view pada blog


Setelah blogwalking ke blog teman2, saya menemukan sebuah topik menarik yaitu tentang Tabview. Tab view sangat efektif untuk meringkas posting-posting blog anda ke dalam 1 tabel. Tidak hanya untuk postingan anda, tab view juga efektif untuk memasukkan link teman-teman anda. Berikut saya jelaskan cara menambahkannya....



Tambahkan kode berikut di atas kode ]]></b:skin>



div.TabView div.Tabs
{
height: 24px;
overflow: hidden;
}

div.TabView div.Tabs a
{
float: left;
display: block;

width: 90px;
text-align: center;

height: 24px;

padding-top: 3px;
vertical-align: middle;
border: 1px solid #000000;
border-bottom-width: 0;

text-decoration: none;
font-family: "Arial", Times New Roman, Serif;
font-weight: 900;
color: #000080;
}

div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #BDBDBD;

}

div.TabView div.Pages
{
clear: both;
background-color: #FFFFFF;

border: 1px solid #000000;
overflow: hidden;
}

div.TabView div.Pages div.Page
{
height: 100%;
padding: 0px;
overflow: hidden;
}

div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}




Tambahkan Kode di bawah ini di atas kode </head>

<script type='text/javascript'>
function tabview_aux(TabViewId, id)
{
var TabView = document.getElementById(TabViewId);

// ----- Tabs -----

var Tabs = TabView.firstChild;
while (Tabs.className != "Tabs" ) Tabs = Tabs.nextSibling;

var Tab = Tabs.firstChild;
var i = 0;

do
{
if (Tab.tagName == "A")
{
i++;
Tab.href = "javascript:tabview_switch('"+TabViewId+"', "+i+");";
Tab.className = (i == id) ? "Active" : "";
Tab.blur();
}
}
while (Tab = Tab.nextSibling);

// ----- Pages -----

var Pages = TabView.firstChild;
while (Pages.className != 'Pages') Pages = Pages.nextSibling;

var Page = Pages.firstChild;
var i = 0;

do
{
if (Page.className == 'Page')
{
i++;
if (Pages.offsetHeight) Page.style.height = (Pages.offsetHeight-2)+"px";
Page.style.overflow = "auto";
Page.style.display = (i == id) ? 'block' : 'none';
}
}
while (Page = Page.nextSibling);
}

// ----- Functions -------------------------------------------------------------

function tabview_switch(TabViewId, id) { tabview_aux(TabViewId, id); }

function tabview_initialize(TabViewId) { tabview_aux(TabViewId, 1); }
</script>


Simpan template anda
Lalu masuk ke Page element dan add gadget HTML/Java script
Copy paste kode di bawah ini

<form action="tabview.html" method="get">
<div class="TabView" id="TabView">

<div class="Tabs" style="width: 350px;">
<a>Tab 1</a>
<a>Tab 2</a>
<a>Tab 3</a>
</div>

<div class="Pages" style="width: 
350px; height: 250px;">

<div class="Page">
<div class="Pad">

Tab1.1<br/>
Tab1.2<br/>
Tab1.3<br/>

</div>
</div>


<div class="Page">
<div class="Pad">

Tab2.1<br/>
Tab2.2<br/>
Tab2.3<br/>

</div>
</div>


<div class="Page">
<div class="Pad">

Tab3.1<br/>
Tab3.2<br/>
Tab3.3<br/>

</div>
</div>

</div>
</div>
</form>

<script type="text/javascript">
tabview_initialize('TabView');
</script>

 
Catatan: 
  1. Kode berwarna merah adalah judul tab
  2. Kode berwarna hijau adalah link anda ,ganti tulisan berwarna hijau dengan <li><a href="link anda">Judul link</a></li> (contoh: <li><a href="http://johnthor.blogspot.com/asyik.htm>ASYIK</a></li>
  3. kode berwarna oranye adalah ukuran lebar dan tinggi tabel tab view

Selamat mencoba...


Read More..

Cara memasang google custom search engine

Google custom search engine memiliki kelebihan dibanding search biasa, karena bisa searching di situs lain yang punya tema mirip dengan situs kita. sangat cocok bagi anda yang punya situs banyak
Klik  http://www.google.co.id/coop/cse/, lalu pilih create a custom search engine lalu login dengan google account anda. Setelah itu ikuti petunjuk dan isi form yang disediakan. setelah mengisi form, buka email anda dan dapatkan kodenya. pilih option yang disediakan lalu copy kodenya di add gadget-->HTML/java script
Khusus untuk option "meng-host hasil di situs web anda" pada pilihan "iframe", akan ada dua kode yang harus anda letakkan, langkah meletakkannya adalah:
  1. copy kode pertama di page element-->add gadget-->HTML/java script
  2. lalu copy code yang kedua di new posting setelah itu klik publish post dengan judul terserah anda seperti search, hasil pencarian, result,dsb
  3. kembali pada kode pertama di page element-->edit gadget. cari kode <form action="http://bloganda.blogspot.com" id="cse-search-box">
  4. ganti url blog anda dengan url tempat anda meletakkan postingan tadi, sehingga menjadi seperti contoh berikut ini <form action="http://bloganda.blogspot.com/2009/05/search.html" id="cse-search-box">
  5. selamat mencoba

Read More..

Menambahkan Music search engine

Bila melihat di blog tetangga, kadang2 ada mp3 search engine di pojok. Bila anda berniat memasang music search engine, saya bisa membantu anda dengan berbagi script di bawah ini...tapi yang satu ini adalah music search engine yang advanced alias banyak kolomnya,..tidak seperti music search engine biasa yang cuma satu kolom. jadi sediakan space yang agak lebar untuk gadget ini.

berikut cara memasangnya.
  1. masuk ke layout
  2. pilih page element
  3. klik add gadget
  4. pilih HTML/java script
  5. lalu copy script di bawah ini ke HTML/javascript


<form action="http://skreemr.com/advanced_results.jsp" name="searchForm" method="get" onsubmit="return checkform()"> <input value="true" name="advanced" type="hidden"/> <table> <tbody><tr> <td>Title:</td> <td> <input id="song" name="song" size="23" type="text"/></td> </tr> <tr> <td>Artist: </td> <td> <input name="artist" size="23" type="text"/></td> </tr> <tr><td>Album:</td> <td> <input id="album" name="album" size="23" type="text"/></td> </tr> <tr><td>Genre:</td> <td> <input id="genre" name="genre" size="23" type="text"/></td> </tr> </tbody></table> <table border="0" width="100"> <tbody><tr> <td><table width="100"> <tbody><tr> </tr><tr> <td>Bitrate:</td> </tr> <tr><td><input id="bitrate_0" checked="" value="0" name="bitrate" type="radio"/> any</td> </tr> <tr> <td> <input id="bitrate_1" value="128000" name="bitrate" type="radio"/> >128</td> </tr> <tr> <td> <input id="bitrate_2" value="192000" name="bitrate" type="radio"/> >192</td> </tr> <tr> <td> <input id="bitrate_4" value="320000" name="bitrate" type="radio"/> >320</td> </tr> </tbody></table></td> <td><table width="200"> <tbody><tr> </tr><tr> <td>Length</td> </tr> <tr><td> <input id="length_0" checked="" value="00:00:00" name="length" type="radio"/> any</td> </tr> <tr> <td> <input id="length_2" value="00:00:30" name="length" type="radio"/> >30 sec.</td> </tr> <tr> <td> <input id="length_3" value="00:00:60" name="length" type="radio"/> >1 min.</td> </tr> <tr> <td> <input id="length_3" value="00:05:00" name="length" type="radio"/> >5 min.</td> </tr> </tbody></table></td> </tr> </tbody></table> 
<input id="button" value="Search" name="button" type="submit"/> </form>

selamat mencoba...
Read More..