Menggunakan border image dengan efek radius menampilkan kesan yang bagus dan keren, selain itu akan memberi kesan rapi pada postingan dengan ditambahi gambar yang dihiasi border image radius (sisi kanan, kiri, atas, dan bawah pada image akan terdapat boder berwarna abu-abu dan dengan bingkai melengkung setiap sudutnya). Jika kalian ingin menambahkan kode border image kedalam blog Anda silahkan simak tutorial di bawah ini.

Lagkah-langkah memasang Border Image Radius Otomatis

--> Login ke blogger,
--> Pilih Template » Edit HTML
--> Silahkan cari kode di bawah ini,

]]></b:skin>

--> Selanjutnya, letakan CSS di bawah ini sebelum kode di atas,

.post-body img{background-color:#F0EFEF;border:2px solid #CACECF;margin:0 4px 2px 0;padding:4px;border-radius:5px;}

--> Terakhir, Simpan Template.

Cukup mudah bukan, hanya 2 menit sudah selesai membuat border image radius kedalam blog kalian.

Read More →

Feedjit adalah tool yang mempunyai fungsi untuk melihat pengunjung yang berkunjung ke blog kalian secara lengkap dan detail. Feedjit akan memperlihatkan pengunjung yang datang dari mesin pencari seperti Google, Yahoo, Bing, Msn, dan lain-lain dengan kata kunci / keywords yang berbeda-beda.

Widget blog keren ini sangat membantu kalian untuk melihat artikel / postingan mana yang paling banyak dibaca dan dikunjungi dari mesin pencari. Feedjit juga memiliki tampilan yang keren dan dapat dirubah sesuai dengan warna blog kalian.

Cara Memasang Feedjit Pada Blog

Langkah Pertama
--> kunjungi web Feedjit resmi disini
--> Pilih Choose Your Feedjit » Sign Up for Free,
--> Isi formulir yang masih kosong dengan data lengkap Anda (Tips, agar lebih baik jangan mengisi data Anonim)

Keterangan: Your first and last name : Isikan nama depan dan nama belakang Anda. What country are you in : Negara mana yang kamu tempati. Enter your email address : Isikan alamat email Anda.

--> Jika sudah pilih »Get your Traffic Feed!»
Selanjutnya kalian diminta untuk menyesuaikan tampilan Traffic Feedjit tersebut agar sesuai dengan tampilan blog kalian.

--> Lalu pilih » Other blog or website » GO
Kalian akan mendapatkan kode dari Feedjit tersebut, silahkan copas kode tersebut pada notepad.

Langkah kedua
(meletalkan kode Feedjit tersebut kedalam blog agar Feedjit dapat tampil pada blog kalian).

--> Login pada blogger Anda,
--> Pilih Tata Letak » Tambah Widget » HTML/Javascript,
Masukan kode yang sudah Anda copas tadi kedalam HTML/Javascript tersebut,
--> Terakhir, Simpan.

Sekarang Kalian dapat melihat berapa banyak pengunjung yang datang pada blog kalian dari mesin pencari dengan Cara Memasang widget Feedjit keren ini.

Read More →

Widget Recent Post Dengan Thumbnail/Gambar Keren ini bisa menjadi pertimbangaan untuk melengkapi widget keren pada blog kalian, dengan tampilan keren dilengkapi dengan gambar dan jumlah komentar serta judul artikel terbaru. Widget ini sangat cocok buat blog yang mengusung tema elegant, simple, dan web 2.0.

Ayo langsung saya ikuti langkah berikut:

--> Login dulu ke blogger sobat,
--> Pada Dasboard blogspot sobat pilih Tata Letak,
--> Pilih Tambah Widget => HTML/Javascript, Lalu, copas dan masukan kode script di bawah ini,

<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://i725.photobucket.com/albums/ww258/anasceria/Tutorial-jitu/no-image1.gif";
imgr[1] = "http://i725.photobucket.com/albums/ww258/anasceria/Tutorial-jitu/no-image2.gif";
imgr[2] = "http://i725.photobucket.com/albums/ww258/anasceria/Tutorial-jitu/no-image3.gif";
imgr[3] = "http://i725.photobucket.com/albums/ww258/anasceria/Tutorial-jitu/no-image4.gif";
imgr[4] = "http://i725.photobucket.com/albums/ww258/anasceria/Tutorial-jitu/no-image5.gif";

showRandomImg = true;
boxwidth = 230;
cellspacing = 8;
borderColor = "#ffffff";
bgTD = "transparent";
thumbwidth = 40;
thumbheight = 40;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://widgetblogkeren.blogspot.com/";
</script>
<script src="https://sites.google.com/site/anasceria/recentposts_thumbnail.js" type="text/javascript"></script>

--> Terakhir, Simpan deh.

Catatan : untuk tulisan yang bercetak tebal alias bold, silakanuntuk diganti dengan alamat blog sobat.

Read More →

Ternyata banyak juga dari para blogger yang bingung bagaimana cara membuat reply pada kotak komentar di blogspot, kali ini Widget blog keren akan mebahas bagaimana cara membuat reply pada kotak komentar di blog kalian.

Langsung Saja Lihat Tutorialnya Cara Membuat Reply Pada Kotak Komentar Blog :

Cara Memasang Reply pada Komentar Blog :

1. Login blog

2. Rancangan --> edit HTML (centang "Expand Widget Template")

3. Cari kode (Ctrl + F) <data:commentpostedbymsg> atau kode

<data:comment.timestamp>

4. Letakkan kode dibawah ini diatas kode diatas

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

Ganti tulisan BloggerIdSobat dengan id blog sobat bila sobat belum mengetahuinya, coba sobat buka menu rancangan lalu perhatikan digit angka pada address bar sobat, dan jangan lupa ganti dengan id blog sobat.

Langkah terakhir save template dan sobat bisa langsung melihat hasilnya, bila sobat ingin tampilannya lebih menarik sobat bisa ganti tulisan [Reply Comment] dengan icon gambar, caranya cukup ganti tulisan [Reply Comment] diatas dengan kode gambar dibawah ini .

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjWVdN9manCifoUx9O9CWRtXWg4W0UoHZ8ZxG_hqO5cnfJFsIbUMXh1WIYTLCFD3UG0aY2_mUK5ml4CjwmXr_qi3ATscTYIuxOCEIMJzrw17SsgXYY3avzDg13mgtjGET7vpXU0_soAAyx/'/>

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6lKEsf34RgTHZ98xsUIDcavWSfvRhMD4ybI-d0v9to_kYyriHx-vVd1P5CIRHMPDU_SPtFTXQZYF7o32vro6rbTu4pUx0uKAI_RTHO3l5R_IizohYrUl5iRpHJ0NXwyXbdVpJaaI9mOjx/'/>

<img src=' https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiv-laS2JtF1TzKo0kh2GGbOV7M-zCbnf1LflLINJD01IkMbds2IuWNvzNJGrYkzAImCYEJZvENzgXvpfkUzQPQ-5bbGAP6Vmh334YdrynCskz_jLweB620kF7edYOTHVHoFFigph46b3mS/ '/>

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGoM83O12_X09pbJIS7lkxd0ytLsdrQ5X5PGGBbY27jd7HG6-nkiUNPXyF3KF2YxDLZxVlYjPhBb4vBR04Mr_PRNmsp_GFbcSdnUf8uwQ1t1cnALxtlyluCIUdr_D5IinC0tLsHU952z3c/'/&gt;

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiARv99FtYI370euOYbg2FGfakWD6V3kk5TTbFhHQnCgN-qz44ueLsuvN64QrGaCzYkotBYjhLoYqd63KnLkcJwf2QmfiQTsCY-2NwAz1M_YVyPnfbJQKpTPguJgWP3Z8dQUys15u79Ebcg/'/>

Read More →

Hai sobat setelah saya posting artikel tentang bagaimana caranya memproteksi gambar posting dari copy paste para blogger yang tidak bertanggung jawab, widget blog keren kembali akan memposting bagaimana cara agar artikel dalam postingan di blog kita tidak akan bisa di copy paste, cara ini cukup sederhana hanya dengan memasang kode pada widget HTML di blog kalian.

Ayo langsung saya pasang widget Anti copy paste artikel plus icon camera keren tersebut dan ini dia caranya:

--> Login ke blogger Anda
--> pilih Tata Letak dan klik Tambah Widget
--> Pilih HTML/Javascript, selanjutnya masukan masukan (copy paste) kode di bawah ini

<script type="text/javascript"> if (typeof document.onselectstart!="undefined") { document.onselectstart=new Function ("return false"); } else{ document.onmousedown=new Function ("return false"); document.onmouseup=new Function ("return true"); } </script><br /> <br /> <br /> <div style="position: fixed; top: 0px; right:0px;width:110px;height:140px;"><a href="http://x-atributespc.blogspot.com/2012/02/cara-agar-blog-tidak-dapat-di-copy.html" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAKWg8eUzPx7jgJ1JFRnX6Vys-cOwRODWafJQknH1BKoB5RIL_R3L9z7brYxpedIIrAZvIWWszNceH7CepmpasTaH5JHr-QLj_NfVXNDoggkMURYAj-dbbqgtA-uGyP-Hh5uofs2uRew4/s1600/cctv.gif" title="Copy and Paste guard" /></a></div>

--> Langkah selanjutnya Save, dah akhirnya selesai sudah cara pasang kode/widget Anti copy paste isi artikel plus icon camerakeren ini.

Read More →

Kode Warna sangat berperan penting dalam kegiatan mengedit blog, dalam dunia blogger pasti membutuhkan kode warna yang berguna untuk mengedit warna pada Css, mengubah warna, dll.

Membuat kode warna di blogspot ini bertujuan agar kita tidak kebingungan mencari kode warna di search engine karena kode warna sudah ada di blog kita.

Dengan menggunakan kode warna ini memudahkan author atau pemilik blog berkreasi sesuai dengan pikiran dan kreativitasnya.

Cara Membuat kode warna di blogspot:

Langkah Pertama:

--> Login terlebih dahulu ke blogger kalian,
--> Pilih Rancangan - Elemen Edit - Tambah Gadget - HTML/Javascript,kemudian copas script di bawah ini dan taruh pada blog kalian,

<script language='javascript'>
function Barva(koda)
{
document.getElementById("vzorec").bgColor=koda;
document.hcc.barva.value=koda.toUpperCase();
document.hcc.barva.select();
}
function BarvaDruga(koda)
{
document.getElementById("vzorec2").bgColor=koda;
document.hcc.Barva2.value=koda.toUpperCase();
document.hcc.Barva2.select();
}
</script>

<script type='text/javascript'>

var hue;
var picker;
//var gLogger;
var dd1, dd2;
var r, g, b;

function init() {
if (typeof(ygLogger) != "undefined")
ygLogger.init(document.getElementById("logDiv"));
pickerInit();
//ddcolorposter.fillcolorbox("colorfield1", "colorbox1") //PREFILL "colorbox1" with hex value from "colorfield1"
//ddcolorposter.fillcolorbox("colorfield2", "colorbox2") //PREFILL "colorbox1" with hex value from "colorfield1"
}

// Picker ---------------------------------------------------------

function pickerInit() {
hue = YAHOO.widget.Slider.getVertSlider("hueBg", "hueThumb", 0, 180);
hue.onChange = function(newVal) { hueUpdate(newVal); };

picker = YAHOO.widget.Slider.getSliderRegion("pickerDiv", "selector", 0, 180, 0, 180);
picker.onChange = function(newX, newY) { pickerUpdate(newX, newY); };

hueUpdate();

dd1 = new YAHOO.util.DD("pickerPanel");
dd1.setHandleElId("pickerHandle");
dd1.endDrag = function(e) {
// picker.thumb.resetConstraints();
// hue.thumb.resetConstraints();
};
}

executeonload(init);

function pickerUpdate(newX, newY) {
pickerSwatchUpdate();
}


function hueUpdate(newVal) {

var h = (180 - hue.getValue()) / 180;
if (h == 1) { h = 0; }

var a = YAHOO.util.Color.hsv2rgb( h, 1, 1);

document.getElementById("pickerDiv").style.backgroundColor =
"rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";

pickerSwatchUpdate();
}

function pickerSwatchUpdate() {
var h = (180 - hue.getValue());
if (h == 180) { h = 0; }
document.getElementById("pickerhval").value = (h*2);

h = h / 180;

var s = picker.getXValue() / 180;
document.getElementById("pickersval").value = Math.round(s * 100);

var v = (180 - picker.getYValue()) / 180;
document.getElementById("pickervval").value = Math.round(v * 100);

var a = YAHOO.util.Color.hsv2rgb( h, s, v );

document.getElementById("pickerSwatch").style.backgroundColor =
"rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";

document.getElementById("pickerrval").value = a[0];
document.getElementById("pickergval").value = a[1];
document.getElementById("pickerbval").value = a[2];
var hexvalue = document.getElementById("pickerhexval").value ='#'+
YAHOO.util.Color.rgb2hex(a[0], a[1], a[2]);
ddcolorposter.initialize(a[0], a[1], a[2], hexvalue)
if (hexvalue!="#FFFFFF") document.getElementById("pickerhexval").select();
}

</script><!--[if gte IE 5.5000]>
<script type="text/javascript">

function correctPNG() // correctly handle PNG transparency in Win IE 5.5 or higher.
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
img.outerHTML = strNewHTML
i = i-1
}
}
}

YAHOO.util.Event.addListener(window, "load", correctPNG);

</script>
<![endif]-->

--> Kemudian di Save .

Langkah Kedua:

--> Buatlah entri baru atau artikel baru
--> Pada entri tersebut ada dua pilihan Edit HTML dan Compose
--> Pilih Edit HTML pada artikel tersebut dan copas script di bawah ini pada artikel baru kalian.

<center><form name="hcc" id="hcc">
<table style="border-collapse: collapse;" align="center" border="1" bordercolor="#cccccc" cellpadding="0" cellspacing="0"><tbody><tr><td><table align="center" border="0" cellpadding="0" cellspacing="1" width="375"><tbody><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#190707">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a0808">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b40404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df0101">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff0000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2e2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa5858">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f78181">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cece">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbefef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#191007">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a1b0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b240b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#61380b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a4b08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b45f04">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df7401">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff8000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe9a2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#faac58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7be81">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5d0a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6e3ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8ece0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbf5ef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#181907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#292a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#393b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5e610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#868a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#aeb404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d7df01">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ffff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7fe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f4fa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f3f781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f2f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5f6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7f8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbfbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#101907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1b2a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#243b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#38610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#4b8a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5fb404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#74df00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#80ff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#9afe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#acfa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#bef781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d0f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e3f6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ecf8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5fbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01df01">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58fa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071910">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a1b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b24">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b6138">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a4b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b45f">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01df74">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ff80">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efe9a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58faac">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f7be">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5d0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6e3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8ec">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbf5">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071918">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a29">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b39">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b615e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a85">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b4ae">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01dfd7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ffff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58faf4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f7f3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbfb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071019">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a1b2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b243b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3861">
</td><td onclick="Barva(this.bgColor)" bgcolor="#084b8a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#045fb4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0174df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0080ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e9afe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58acfa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81bef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9d0f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cee3f6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0ecf8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#eff5fb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#070719">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a0a2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b3b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b61">
</td><td onclick="Barva(this.bgColor)" bgcolor="#08088a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0404b4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0101df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0000ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e2efe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5858fa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8181f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9a9f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cecef6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0e0f8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#efeffb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#100719">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1b0a2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#240b3b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#380b61">
</td><td onclick="Barva(this.bgColor)" bgcolor="#4b088a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5f04b4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#7401df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8000ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#9a2efe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ac58fa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#be81f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d0a9f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e3cef6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ece0f8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5effb">
</td></tr><tr height="24"> <td onclick="Barva(this.bgColor)" bgcolor="#190718">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a29">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b39">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b5e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a0886">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b404ae">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df01d7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff00ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2ef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa58f4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f781f3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cef5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbeffb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#190710">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a1b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b24">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b38">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a084b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b4045f">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df0174">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff0080">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2e9a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa58ac">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f781be">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9d0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cee3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0ec">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbeff5">
</td></tr><tr height="10"><td>
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#000000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#151515">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1c1c1c">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e2e2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#424242">
</td><td onclick="Barva(this.bgColor)" bgcolor="#585858">
</td><td onclick="Barva(this.bgColor)" bgcolor="#6e6e6e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#848484">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a4a4a4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#bdbdbd">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d8d8d8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e6e6e6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f2f2f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ffffff">
</td></tr></tbody></table></td></tr></tbody></table>
<table align="center" border="0" cellpadding="0" cellspacing="2"><tbody><tr height="24"><td id="vzorec" width="24" height="24">
</td><td valign="bottom"><p>Kode warna yang terpilih : <input name="barva" id="barva" style="font-weight: bold; font-family: Verdana; height: 16px; width: 74px; font-size: 12px;" maxlength="7" size="9" type="text"></p></td></tr></tbody></table>
</form><p><a href="http://menujublog.blogspot.com/2010/03/cara-membuat-kode-warna-di-blog.html" target="new">Get it</a></p></center>

--> Kemudian TERBITKAN ENTRI.
Apabila ada peringatan silahkan kalian ceklist "Hentikan galat HTML" kalian ceklist saja.

--> TERBITKAN ENTRI.

Selesai sudah dan kalian sudah mempunyai kode warna sendiri!.

Read More →

Widget Recent Comment with Scroll Keren berfungsi untuk melihat komentar terbaru yang mengomentari salah satu artikel pada sebuah blog yang dapat dilihat pada sidebar blog. hal ini sangat bermanfaat untuk melihat artikel mana yang paling banyak dikomentari.

Cara Widget Recent Comment with Scroll Keren:

--> Login ke blogger Anda
--> pilih Tata Letak dan klik Tambah Widget
--> Pilih HTML/Javascript, selanjutnya masukan masukan (copy paste) kode di bawah ini

<div style="overflow:auto;width:270px;height:300px;border:1px solid #eee;padding:8px;margin:10px 0 0"> <script style="text/javascript" src="http://files.bloggerplugins.org/widgetcomments.js"></script><script style="text/javascript">var a_rc=10;var m_rc=true;var n_rc=true;var o_rc=60;</script><script src="http://widgetblogkeren.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script> <div style="font-size:9px; padding:8px 0px 0px 0px"></div></div>

Keterangan : width:270 : Adalah lebar dari widget Recent Comment. height:300 : Adalah tinggi dari widget Recent Comment. Angka 10 : Adalah jumlah Recent Comment. Angka 60 : Adalah jumlah karakter/kata dari widget Recent Comment. border:1px solid #eee : Adalah ukuran border/bingkai dan warna border/bingkai.

--> Klik Simpan template, selamat mencoba dan silahkan ganti ganti dan sesuai kebutuhan blog dan selera Anda.

Read More →

Widget Recent Comments / Komentar Terbaru dengan Avatar Unik baru-baru ini sudah populer dan banyak dipasang pada blog pribadi, tampilan yang simple dan unik sangat menonjol pada Mini Avatar yang unik dan keren.

Cara Memasang Recent Comments dengan Mini Avatar pada Blogger

--> Login ke Blogger Anda,
-->Pilih Tata Letak, kemudian Tambah Gadget dan Pilih HTML/Javascript, selanjutnya copy paste lalu masukan script Recent Comments di bawah ini

<style type="text/css">
ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
.w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
.w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 5,
showAvatar = true,
avatarSize = 30,
roundAvatar = true,
characters = 25,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/svn/trunk/w2b-recent-comments-w-gravatar.js"></script>
<script type="text/javascript" src="http://widgetblogkeren.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>

Keterangan: 5 » Jumlah komentar yang muncul. 30 » Ukuran Mini Avatar yang tampil. 25 » Jumlah karakter komentar yang akan tampil.
http://widgetblogkeren.blogspot.com --> Ganti dengan alamat blog kalian.

-->Terkahir, Pilih Simpan. Selamat mencoba.

Read More →

Read more otomatis berfungsi untuk meringkas artikel postingan yang terdapat pada homepage atau halaman utama blog.

Fitur Read More otomatis ini dilengkapi dengan gambar dan dapat mengatur jumlah karakter yang muncul pada homepage. Dengan menggunakan fitur Read More Otomatis jumlah karakter pada homepage tidak akan fullpost dan tidak akan memakan banyak tempat pada template, jika Template Blogspot kalian belum dilengkapi denga fitur Read More Otomatis, kalian dapat menggunakan script Read More Otomatis ini dengan mudah dan gratis.

Cara Menyisipkan Read More Otomatis pada Template Blogspot:

-->Login ke Blogger Anda
--> Pada Dashboard Pilih Template dan Edit HTML
--> Centang Expand Template Widget, selanjutnya silahkan cari kode di bawah ini (Ctrl+F)

</head>

--> Letakan script di bawah ini sebelum kode di atas,

<script type='text/javascript'>
var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
img_thumb_width = 120;
</script>
<script type='text/javascript' src='http://bloggerblogwidgets.googlecode.com/files/auto_readmore_blogger.js' ></script>

Keterangan:
summary_noimg = 430; : Jumlah Karakter jika tidak memiliki Gambar / Thumbnail summary_img = 340; : Jumlah Karakter jika memiliki Gambar / Thumbnail img_thumb_height = 100; : Tinggi Gambar / Thumbnail. img_thumb_width = 120; : Lebar Gambar / Thumbnail.

--> Selanjutnya, silahkan cari kode di bawah ini,

<data:post.body/>

--> Selanjutnya hapus kode tersebut lalu ganti dengan kode di bawah ini,

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<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>
<div style='clear: both;'/>
<span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >Read more ... </a></span>
</b:if>
</b:if>

--> Terakhir, Simpan Template.

Read More →

Proteksi Gambar, Mencegah Copy Paste Liar merupakan hal yang sangat penting untuk mencegah Copy Paste khususnya pada Gambar / Image, dalam hal ini akan memberikan efek gambar kosong / gambar tidak muncul saat di Copy Image atau Save Image As.

Intinya gambar pada postingan sobat jika di copy paste atau di simpan, gambar tersebut akan hilang dan blank, tetapi trik tersebut tidak akan berjalan otomatis dan Anda harus menyisipkan sedikit kode pada alamat url Gambar / Image pada postingan blog.

Gunakan kode image di bawah ini jika Anda menambahkan Gambar / Image pada postingan,

<img style="background-image:url('AlamatURL Image/Gamabar');" src="data:image/gif;base64,R0lGODlhAQABAIAAAP ///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" width="256" height="256"/>

Catatan : Yang perlu kalian ganti dan sesuaikan hanya Tulisan yang berwarna merah dan usahakan lebar dan tinggi gambar sesuai dengan ukuran gambar asli.

Read More →

Sebelumnya kita wajib mengetahui apa itu blog NoFollow dan Blog DoFollow.

Blog NoFollow adalah istilah dalam dunia blogging apabila kalian memberikan komentar dengan link yang tercantum pada komentar tersebut dan tidak dianggap backlink / link balik oleh mesin pencari seperti Mbah Google. Blog NoFollow juga menghindari komentar yang SPAM alias tidak ada sangkut pautnya dengan artikel / postingan.

Blog DoFollow adalah istilah dalam dunia blogging apabila memberikan komentar dengan link yang tercantum pada komentar tersebut akan dianggap backlink / link balik oleh mesin pencari seperti Mbah Google. Jika blog sudah di setting menjadi Blog DoFollow maka kalian siap-siap untuk ratusan komentar dari para pencari backlink gratis dengan sebuah komentar, tetapi tetap waspada sebagai admin, karena banyak pula komentar berbau SPAM alias tidak ada sangkut pautnya dengan artikel / postingan.

Nah jika Anda tertarik dengan pengaturan Blog DoFollow pada blog Anda, maka ikuti langakah berikut ini:

--> Login ke blogger Anda,
--> Pada Dashboard Anda pilih Menu Template.
--> Edit HTML (Centang Expand template Widget), Silahkan cari kode di bawah ini Ctrl + F)

<a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'>

--> Jika tidak ada, silahkan cari kode di bawah ini

<a expr:href='data:comment.authorUrl' rel='nofollow'>

--> Selanjutnya, ganti kode tersebut dengan kode DoFollow di bawah ini,

<a expr:href='data:comment.authorUrl>

--> Terakhir, Simpan Template.

Sangat mudah bukan Merubah Blog NOFOLLOW Menjadi DOFOLLOW ini, siap siap saja blog kalian kebajiran pengunjung.

Read More →

Alexa Rank adalah merupakan bagian yang tidak terpisahkan bagi pengguna blog yaitu blogger dan wordpress yang berfungsi menaikan traffik dari blog itu sendiri dengan Alexa Rank.

Bisa dikatakan hampir seluruh pengguna blogger menggunakan Alexa Rank sebagai alternatif untuk menigkatkan rank blog.



Berikut ini beberapa cara Menaikan Alexa Rank

1. Memasang Alexa Toolbar

Dengan memasang Alexa Toolbar dapat dijadikan alternatif lain untuk menaikan Alexa Rank dan juga kita bisa memasang website atau blog kita sendiri di dalam toolbar itu sendiri dan juga situs social lainnya dengan akun yang kita miliki seperti Facebook dan Twitter.
Alexa Toolbar yang sudah terinstal dalam browser sedikit demi sedikit akan menambahkan point ranking suatu blog atau blog yang kita miliki (Alexa Toolbar ini bisa diinstal dengan browser Mozilla Firefox dan Intenet Explore saja).

2. Alexa Widget

Alexa Widget merupakan salah satu cara untuk meningkatkan Rank Alexa dan Juga Rank Blog. Apabila ada pengunjung yang mengklik Alexa Widget yang dipasang dalam blog kalian maka Alexa akan menggangap sebagai point tambahan apabila pengunjung yang mengklik Alexa widget yang kita miliki belum menginstal Alexa Toolbar.

3. Claim site

Melakukan claim site maka proses ini sama seperti melakukan webmaster/tools yang membuat Meta Tag sesuai dengan blog kita sendiri. Calim site dari Alexa rank ini juga menyediakan Meta Tag sesuai dengan blog kita, dimana meta tag Alexa bisa ditaruh tepatdi bawah <head>

4. Artikel yang Original

Artikel yang original dan sudah terindex dalam mesin pencari, dan dikunjungi oleh pengunjung melalui search engine merupakan poit lebih dan diharapkan oleh para blogger karena selain akan meningkatkan traffic tentu saja akan meningkatkan alexa rank.

5. Update Blog

Update pada artikel atau membuat artikel baru minimal dalam satu minggu ada 3 atau 4 artikel yang baru dalam blog kita maka Alexa Rank kita juga akan bertambah dan tentu saja akan memperbesar peluang blog kita terindex google.

6. Melakukan Ping

Melakukan Ping terhadap artikel yang menurut kita layak untuk dibaca maka artikel kalian akan cepat masuk ke dalam mesin pencari, hal ini juga bisa menaikan alexa rank sedikit demi sedikit.

7. Alexa Artikel

Buatlah artikel yang berkaitan dengan Alexa Rank dengan karyamu sendiri, karena masih banyak orang di luar sana yang belum mengerti tentang Alexa Rank dan melakukan ping terhadap artikel yang berkaitan dengan Alexa Rank tersebut.

8. Label Alexa

Dalam membuat artikel yang berkaitan dengan Alexa sebaiknya kalian membuat label baru tentang Alexa rank.

9. Social Bookmark

Share artikel kalian ke situs sosial yang ada, seperti Facebook, Twitter, Plurk, Tumlr dll. Atau buatlah posting dalam situs social tentang blog kalian.

10. Blogwalking

Blogwalking di sini maksudnya kalian dalam bekunjung ke blog orang lain dibiasakan untuk meninggalkan komentar terhadap blog tersebut dan juga berkomentarlah terhadap blog yang mempunyai Rank yang tinggi karena sebagai metode lain untuk menaikan Rank Alexa.

11. Tukaran Link

Dengan melakukan tukaran link juga bisa membantu untuk menaikan Alexa Rank.

12. Short Url

Dalam membuat artikel dan didalam artikel tersebut terdapat beberapa link atau Url yang menuju ke situs lain, sebaiknya kalian menggunakan shorten url. Hal ini juga bisa mempercepat Alexa Rank Meningkat.

Mudah mudahan cara meningkatkan Alexa Rank ini bisa membantu kalian semua.

Read More →

Widget FeedBurner atau Email Berlangganan ini berfungsi untuk melihat artikel terupdate yang dikirim pada inbox email, tetapi jika kalian ingin memasang Widget ini kalian wajib memiliki account feedburner.

Widget ini memiliki tampilan yang bagus dan menarik, untuk demonya dapat Anda lihat di bawah postingan ini pada artikel ini. Widget ini dilengkapi dengan Halaman Facebook, Twitter, dan RSS Feed.

Cara Pasang FeedBurner Email di Bawah Postingan

--> Login ke Bloger
--> Jangan lupa pilih Template
--> Edit HTML,
Selalu ingat centang Expand Template Widget dan Find kode di bawah ini (Ctrl + F)

<data:post.body/>

Selanjutnya, mari kita letakan kode di bawah ini sebelum kode tersebut

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<style>
form.emailform{display:block;clear:both;margin:20px 0 0}.mbttext{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD4T9GKIbg45FwMLQmTButLLYR7S9Nu3N0xEUuROn3CWACCbIbDOBIeDC27pFrPIbBCFIvGaHSUgqFDW1qsJATGLffm2UDpPCqTVEdbRTkLfF04u_WreIzSvIumjlH2DPoMtBYXBpi2nr3/s28/w2b-mail.png) no-repeat scroll 4px center transparent;color:#666;font-weight:700;text-decoration:none;border:1px solid #D3D3D3;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;-moz-box-shadow:1px 1px 2px #CCC inset;-webkit-box-shadow:1px 1px 2px #CCC inset;box-shadow:1px 1px 2px #CCC inset;padding:7px 15px 7px 35px}.mbtbutton{color:#666;font-weight:700;text-decoration:none;border:1px solid #D3D3D3;cursor:pointer;-moz-border-radius:4px;-webkit-border-radius:4px;-goog-ms-border-radius:4px;border-radius:4px;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FBFBFB',endColorstr='#F4F4F4',GradientType=0);background:linear-gradient(top,#fbfbfb0%,#f4f4f4100%);padding:6px 15px}#doulike-outer{-moz-border-radius:10px;-webkit-border-radius:10px 10px 10px 10px;-goog-ms-border-radius:10px 10px 10px 10px;border-radius:10px;background:none repeat scroll 0 0 transparent;border:1px solid #D3D3D3;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;-webkit-transition:all .3s ease-out;-ms-transition:all .3s ease-out;transition:all .3s ease-out;width:480px;padding:8px}#doulike-outer:hover{background:none repeat scroll 0 0 #FFF;-moz-box-shadow:1px 1px 2px #CCC inset;-webkit-box-shadow:1px 1px 2px #CCC inset;box-shadow:1px 1px 2px #CCC inset}#doulike-outer td{padding:3px 0}
</style>
<div id='doulike-outer'>
<div id='doulike'>
<table width='100%'>
<tbody>
<span style='font-style: italic; font-size: 30px; font-family: arial,sans-serif, verdana; color:#FF683F;'>Do you Like this story..?</span>
<tr>
<td>
<div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' href='' layout='button_count' send='true' show_faces='false' width='300'/>
</td>
</tr>
<tr>
<td align='left'> <p style='color:#666; font-style:italic; margin:0px 0px 5px 0px; '>Get Free Email Updates Daily!</p>
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=ID FeedBurner&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='ID FeedBurner'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='mbttext' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}' onfocus='if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your email...'/>
<input alt='' class='mbtbutton' title='' type='submit' value='Submit'/>
</form>
</td>
<td><p style='color:#666; font-style:italic; margin:0px 0px 5px 0px; '>Follow us!</p>
<a href='http://feeds.feedburner.com/ID FeedBurner' rel='nofollow' target='_blank' title='Suscribe to RSS Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfIaqaRVTQRuoAyhHJvmySb278toszIc4LTo-4XVAtUuqVQxNrxe3EDDIV0AzCP6g9MGhc4bHAIFgTYCXuWaVfKDWEePL7S2vc7_7X1gKM2qFRV8UjKK3KAZsA-o_BltkSOJDAV8m22BJp/s40/w2bRSS+.png'/></a>
<a href='http://twitter.com/ID Twitter' rel='nofollow' target='_blank' title='Follow us on Twitter'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhybngd0gIfbArzG_1C3gYaI-lSPgg2td0V8m31rpZqqrKYf1JL7yCM21bZqprp88SHUtCW2aidyWzAnIlBCaBvfnAG4aMbw7u2YE_UEZYHU6YG6YQjwklnUXD8xnVbA76wQ9Pj3JSnTcDg/s40/w2bTwitter.png'/></a>
<a href='URL Facebook Page' rel='nofollow' target='_blank' title='Follow us on Facebook'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9hyphenhyphenwNwOMUOHS0t0uV3cu0pPkFJKSFujkWwWpkkrJTolkoIvYm5gaK_kJ7OBWr0VrjEBbrIqKNBpajO7Rn339iY8W9D4VQtysMCYtbGQZVvFbGEsoRHTL-iHN1ZRouEPs6ALr2hbVI-S0h/s40/w2bFaceBook.png'/></a>
</td>
</tr>
</tbody></table></div></div>
</b:if>

Keterangan dalam Mengedit kode.
Silahkan Ganti "ID FeedBurner" dengan nama Feedburner Anda.
Silahkan Ganti "ID Twitter" dengan URL TwitterAnda
Silahkan Ganti "URL Facebook Page" dengan URL Facebook Page kalian.

--> Terkahir, Simpan Template.

Note : Hati-hati dalam mengedit sob, soalnya rawan sekali.

Read More →

Pada umumnya iklan biasanya berada pada sidebar/samping kiri atau kanan blog, pada header/bagian atas blog, bahkan pada footer/bagian bawah blog, nah bagaiman jika iklan berada tepatnya di atas postingan dan di bawah judul artikel?.

Posting kali ini kita akan membahas bagaimana cara meletakan iklan tepatnya di atas postingan dan di bawah judul artikel. Cara ini memudahkan pengunjung untuk melihat iklan tersebut dan dengan senang hati jika pengunjung tersebut melakukan klik pada iklan tersebut, karena selain membaca artikel pengunjung juga dapat melihat iklan yang tepat berada di atas postingan. Tetapi cara ini belum tentu bisa di pakai di semua template, biarpun begitu apa salahnya jika kita coba.

Untuk contohnya bisa kalian lihat di blog Online File Sharing Free

Ok kita langsung saja mulai Langkah-langkahnya

--> Pertama, silahkan Anda login dahulu ke Blogger kesayangan Anda,

--> Pada dasbor blogger Anda, silahkan klik tanda panah kebawah lalu pilih Template,

--> Edit HTML, jangan lupa untuk ceklist Expand Widget Template dan silahkan cari kode css di bawah ini dengan menekan di ctrl-f pada keyboard,

]]></b:skin>

Selanjutnya, letakan kode di bawah ini sebelum kode di atas,

/* -- (Googe Adsense) -- */

.ads{margin-bottom:10px;border-top:solid 1px #DEDEDE;padding-top:10px;font-size:13px}
.ads-right-min{border-left:solid 1px #DEDEDE;height:250px;padding-left:10px}
.ads-right-min a:link,.ads-right-min a:visited,.bottom-share-links a:link,.bottom-share-links a:visited{font-size:12px;color:#222;display:block;height:22px;line-height:22px;margin-bottom:16px;padding-left:32px}
.ads-right-min a:hover,.bottom-share-links a:hover{color:#666}

Sekarang kalian cari kode di bawah ini. Kode di bawah ini kode penting, karena dengan memasukan kode ini maka akan memunculkan iklan pada postingan Anda,

<div class='post-body entry-content'>

Selanjutnya, letakan kode di bawah ini sesudah/di bawah kode di atas,

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='ads'>
<table border='0' cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td width='300'>
Kode Iklan
</td>
<td width='300'><div class='ads-right-min'>
Kode Iklan
</div>
</td>
</tr>
</table>
</div></b:if>

Keterangan,
Kode Iklan : Masukanlah kode iklan yang Anda miliki dari situs penyedia iklan,
<td width='300'> : Lebar kotak iklan sebelah kiri,
<td width='300'><div class='ads-right-min'> : Lebar kotak iklan sebelah kanan, Silahkan Anda ganti sendiri angka 300 tersebut, sesuaikan dengan template Anda,

Gampang dan simple bukan, selamat mencoba sobat.

Read More →

Melakukan Ping otomatis pada setiap artikel/posting yang baru di update sangatlah penting. Dengan melakukan Ping Otomatis ini setiap artikel baru akan diping atau dikirim pada social bookmark terkenal. Pastinya kalian siap-siap untuk menerima traffik pembaca artikel/posting kalian dari pembaca interlokal/lokal.

Melakukan Ping Otomatis juga tidak membuang-buang waktu daripada Anda melakukan ping secara manual. Dengan Ping Otomatis ini Anda hanya disuruh klik 1x dan artikel baru Anda otomatis di Ping pada situs social bookmark.

Caranya sangat mudah dan simple.
--> Login ke blogger (Opsi bahasa pilih bahasa indonesia supaya gampang)
--> Klik Rancangan
--> Pada Element laman klik Tambah Gadget dan Pilih Add HTML/Javascript
--> Tambahkan kode berikut:

  <!-- auto ping by http://www.auto-ping.com/ --> <a href="http://www.auto-ping.com/ping683" target="_blank"><img src="http://www.auto-ping.com/iping.php?aut=EF14380489BD68B224A7D8B87239455201155A64B924A54A750E6D8DD2AD0BC1854A7AD421A02FC8C1" alt="Ping your blog, website, or RSS feed for Free" border="0" /></a> <!-- auto ping by http://www.auto-ping.com/--> 

--> Klik Simpan

Kunjungi website resminya » disini, copy paste kode pada website tersebut dan silahkan ganti tampilan Auto Ping sesuai dengan kebutuhan Anda.

Catatan:
Jika Anda ingin melakukan Auto Ping atau Ping Otomatis pada artikel/posting baru, silahkan buka artikel/posting Anda lalu klik widget Auto Pingnya.

Read More →

Meletakan iklan di bawah judul artikel/posting merupakan cara strategis karena Anda meletakan iklan di tempat yang sering dilihat visitors/pengunjung sedangkan social bookmark berfungsi untuk mebagikan artikel kalian ke media jejaring sosial, jadi artikel kalian tidak hanya pada blog saja tetapi di situs jejaring sosial pun ada dalam hal lain bisa buat promosiin blog sehingga trafiik berjibun ke blog kalian..

Langkah-langkahnya di bawah ini.

Untuk demonya silahkan lihat di blog Widget Blog Keren ini atau di blog Online File Sharing Free

--> Silahkan kalian login dengan email dan password kalian ke blogger
--> Pada dasboard blog Anda silahkan pilih Template,
--> Edit Html dan jangan lupa ceklist Expand Template Widget (Silahkan gunakan ctrl-F untuk mencari kode di bawah ini)

]]></b:skin>

--> Letakan kode Css di bawah ini sebelum kode di atas atau kode yang sudah kalian temukan

/* -- Bookmark -- */
.ads{margin-bottom:35px; border-top:solid 1px #DEDEDE; padding-top:8px; font-size:11px;}
.ads-right-min{border-left:solid 1px #DEDEDE}
.ads-right-min a:link,
.ads-right-min a:visited,
.bottom-share-links a:link,
.bottom-share-links a:visited{font: normal 12px Arial, Helvetica, sans-serif;display: block;color:#222;height:28px;line-height:16px;padding-left:20px}
.ads-right-min a:hover,
.bottom-share-links a:hover{color:#B40404}
.mini-feed{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYhaU-YbiK_poFawO_CxyWLB6WJFMKU9_GugGYa98eUFxxiVDp7euPMHYaxfe_cioYdnEh5wMSCG7KB4tMZhy4WdWbW7M_1suqdfEeZq98uDjT0-Tmi_hGJdtXwqdGFGLHkp5z2-AQtMo/s400/feed.png) no-repeat;}
.mini-tweet{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XStGhnkkliSEeJk-KQg-viVQXO-G4rJZ9tW4DuYH8A4gwFLasQK73lyktcP86ofKyR1ajrVZhOzIuBoA6a0xW36rxd6ZpKPX_H64UzdY98LHzzWOUWpyFJa6-jyJ0h9BOVsM14ieiR0/s400/twitter.png) no-repeat;}
.mini-stum{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijfSf4XX2eQQI9Sm0utWZmhpeorI0LwKyVTChNZ1eksqU57dHMC_QUFyUi61nk6Fawzjh37Likix-EhxIKcgyXHX8EVCIT-YYOCoaL_fGtmtgDrfvMoA2lWd2TrJFtN1UdMIt76a8-s5mT/s400/stumbleupon.png) no-repeat;}
.mini-facebook{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXAqA5F9ORAivJbE2FapXh5peWoQm1VD20qvffXHDuzvHvuKMqPuRrzUkiBBVjqlyXj40m_7H0Hns9E8xKrBE6NQbMCMffFTvJiJ2N_aCGIaBB_Cu976VS_RCXGM3N6sl7aTZep0HuKwk/s400/facebook.png) no-repeat;}
.mini-digg{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqqT7_0DGhjQ-JiuVgwY-Rgw36_oyz9ed4BszM96Lx_nBRN_xc8pYY0hzhePbw64-4yKTkEms_OZdYeRFteRuMC-0pvAyfC_pVwKgJ7FzOXu2DLUh8aNGWDrQp9oNQcgmQqgBczKlicL3a/s400/digg.png) no-repeat;}
.bottom-share-links{height:50px; clear:both; padding-top:10px}
.bottom-share-links .mini-feed{float:left; margin-right:13px;}

--> Untuk memasang iklan dan social bookmarknya silahkan cari kode di bawah ini

<div class='post-body entry-content'>

--> Lalu letakan kode di bawah ini di atas/sebelum kode tersebut,

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='ads'>
<table border='0' cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td width='375'>
Kode Iklan Anda
</td>
<td><div class='ads-right-min'>
<h2><b>Do you want to share?</b></h2>
<a class='mini-feed' href='http://feeds2.feedburner.com/FEEDURL'>Subscribe RSS Feed</a>
<a class='mini-tweet' expr:href='&quot;http://twitthis.com/twit url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'>Tweet on Twitter</a>
<a class='mini-facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'>Share on Facebook</a>
<a class='mini-stum' expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'>Stumble This Article</a>
<a class='mini-digg' expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'>Digg this Article</a>
</div>
</td>
</tr>
</table>
</div></b:if>

Keterangan !
Kode Iklan Anda : Silahkan Anda masukan kode iklan Anda,
FEEDURL : Silahkan Anda ganti dengan nama feedburner Anda

Nah iklan kalian akan muncul berdampingan dengan situs social bookmark, jadi selamat menunggu earning Ga dan traffic bejibun.

Read More →

Meletakan iklan AdSense berada di tengah atau diantara postingan menurut senagian blogger adalah trik untuk menaikan CTR dan tentusaja klik iklan.

Cara ini memungkinkan pengunjung dapat melihat dengan mudah iklan yang berada di antara postingan, lebih mantap lagi jika iklan dengan format text yang ditampilkan karena sewaktu-waktu pengunjung mengira iklan tersebut adalah postingan dan berniat untuk melakukan klik.

Cara ini juga sangat jitu, karena meletakan iklan di tempat yang banyak dilihat oleh pengunjung.

Iklan akan muncul seperti contoh di bawah ini.

Judul Postingan
Isi postingan......................
Isi Postingan......................

<== Iklan AdSense ==>

Isi Postingan......................
Isi Postingan......................

Dengan cara ini posisi iklan AdSense akan berada di antara area postingan dan iklan akan muncul setiap halaman postingan, agar iklan terlihat lebih rapi dan indah aturlah jarak iklan dan postingan.

Cara Memasang Iklan AdSense Di Tengan Postingan.

Memasang iklan Google AdSense ataupun situs yang menyediakan iklan untuk publisher dan Advertise dalam area HTML, hal yang wajib adalah melakukan convert iklan agar iklan muncul di Area postingan, silahkan kunjungi toolsnya pada link di bawah ini.
Convert Kode Iklan Convert Disini.

1. Buka Blogger Anda,
2. Pilih Template lalu Edit HTML
3. Cari kode di bawah ini,

<data:post.body/>

4. Hapus dan ganti kode tersebut dengan kode baru di bawah ini,

<div expr:id='"iklan1" + data:post.id'></div>
<div style="clear:both; margin:10px 0">

<= Letakan Kode Iklan AdSense di Sini =>

</div>
<div expr:id='"iklan2" + data:post.id'>

<data:post.body/>

</div>
<script type="text/javascript">
var obj0=document.getElementById("iklan1<data:post.id/>");
var obj1=document.getElementById("iklan2<data:post.id/>");
var s=obj1.innerHTML;
var t=s.substr(0,s.length/2);
var r=t.lastIndexOf(" ");
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+1);}
</script>

"Ganti tulisan berwarna merah denga kode iklan yang sudah di convert".

5. Selanjutnya, Simpan Template.

Agar Iklan Anda hanya tampil pada halaman postingan gunakan kode di bawah ini,

<b:if cond='data:blog.pageType == &quot;item&quot;'>

Kode Iklan AdSense Anda

</b:if>

Gimana Sobat? mudah dan simple kan, selamat mencoba.

Read More →

Susah susah gampang buat mengilangkan Navbar pada blog, dan terkadang memang untuk sebagian blogger Navbar ini bisa dibilang mengganggu.

Nah berikut cara untuk menghilangkan Navbar pada blog

--> Login ke account blogger kalian
--> Klik dasbor dan select blog yang akan kalian hilangkan Navbarnya
--> Klik menu Rancangan
--> Klik menu Edit HTML
Jangan lupa untuk mencetang Expand Template Widget ( fungsinya untuk menjaga jaga jika blog kita error atau gagal dalam memasukan kode HTML kita bisa mengembalikan keadaan semula dengan mengklik lagi Expand Template Widget) atau cara yang lebih aman dengan mendownload template kalian terlebih dahulu untuk menjaga jaga terjadi error.
--> Cari kode ]]></b:skin>
Biar lebih gampang dan cepat copy kode diatas kemudian tekan tombol Ctrl + F di keybord kalian dan paste di menu tadi maka kode tersebut akan segera ketemu.
--> Letakkan kode di bawah ini di atas kode ]]></b:skin> pada halaman html

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

Atau bisa dengan cara lain dengan meletakkan kode di bawah ini tepat di bawah kode <body> :

<style type='text/css'>
#navbar-iframe {display:none;}
</style>

Lalu Simpan Template.

Read More →