Pages

Showing posts with label Tips Blog. Show all posts
Showing posts with label Tips Blog. Show all posts

Tools Encoder HTML

Mem-parse  HTML dilakukan oleh para blogger dalam memposting artikel yang di dalamnya berisi HTML/Javascript. Karena, jika tidak dilakukan terlebih dahulu, postingan HTML/Javascript tersebut akan tampil berantakan dan tidak sesuai dengan coding yang seharusnya ingin ditampilkan. 

Berikut ini contoh tools untuk parse HTML/Javascript. Masukkan saja code yang ingin anda parse lalu tekan tombol convert sekali saja. Kemudian hasil dari convert dapat anda letakkan pada postingan anda dan tampil sempurna :D




Memasang Widget Pelacak IP Address dan Browser

Setelah lamanya blog ini hanya berdiam diri dan harap saja ada yang masih setia mampir (ckckc), akhirnya pada saat ini ukhrazone kembali hidup..hehe mudah-mudahan aja nggak mati suri lagi :| Note : Kalimat di atas hanya intro belaka..hehe. Langsung aja ke intinya okay!

Postingan kali ini berisi tentang tips blogging yaitu menambah widget dalam blog kamu yang dapat melacak ip maupun browser yang digunakan oleh pengunjung blog kamu. Seperti dibawah ini.


Ikuti langkah - langkah di bawah ini :

1. Masuk kesitus http://danasoft.com.

2. Kemudian  klik Create your free sign with custom text quotes!.

3. Lalu pada halaman selanjutnya, isi alamat email serta nama kamu di kotak isian, kemudian pilih bahasa serta gambar yang kamu inginkan. Dan dikotak selanjutnya kamu bisa menulis apapun.

4. Klik tombol "Make My Custom Sign". Kemudian akan muncul  kode html, copykan code html tersebut pada kotak yang paling bawah dan pastekan pada blogmu di add gadget dan kemudian add HTML/Javascript.

5. Selesai.

Cara Pasang Big Social Bookmarks di Setiap Postingan

Assalamualaikum sahabat blogger. Ukhra datang lagi ni buat share ke kamu. Kali ini ukhra mosting tentang salah satu cara meningkatkan traffic blog kamu yaitu memasang social bookmarks di setiap postingan yang letaknya di bawah postingan kamu. Kali ini tampilannya agak berbeda yaitu lebih besar dan unik. Seperti ini nih...


Tapi nggak usah jauh - jauh, di bawah postingan ini ada kok contohnya...hehe

Oke, langsung aja deh ..

1. Login di akun blogger kamu
2. Setelah masuk ke dasbor klik Tata Letak/Layout
3. Lalu klik Edit HTML
4. Setelah itu kamu cari kode ]]></b:skin>
5. Copas kode di bawah di atas kode tadi

div.sociable { margin: 16px 0;}

span.sociable_tagline { position: relative; }
span.sociable_tagline span { display: none; width: 14em; }
span.sociable_tagline:hover span {
position: absolute;
display: block;
top: -5em;
background: #ffe;
border: 1px solid #ccc;
color: black;
line-height: 1.25em;
}
.sociable span {
display: block;
}
.sociable ul {
display: inline;
margin: 0 !important;
padding: 0 !important;
}
.sociable ul li {
background: #f5f5f5;
display: inline !important;
list-style-type: none;
margin: 0;
padding: 2px;
}
.sociable ul li:before { content: ""; }
.sociable img {
float: none;

border: 0;
margin: 0;
padding: 0;
}

.sociable-hovers {
opacity: 0.4;
-moz-opacity: 0.4;
filter: alpha(opacity=40);
}
.sociable-hovers:hover {
opacity: 1;
-moz-opacity: 1;
filter: alpha(opacity=100);
}


6. Lalu, cari kode <data:post.body/>
Note : Jika kamu memasang read more, akan terdapat dua buah <data:post.body/>, copas kode di bawah ini di bawah kode <data:post.body/> yang kedua..

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='sociable'>
<div class='sociable_tagline'>
<img alt='maspeypah' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijJ9PxJhG8JMcK2b1lhfyvzQJ8vd3K_pgmjs2Wmv0gaG0PG0j5g2B5B8QA-2HpIBLPee2vAJfMCDXkRB40CEzx3VJjJ09v6breC8zTHmeTR9Iidk3x3XC-mBZXkG_UL7V2Sr4hm2-rXX5Z/s1600/share.jpg' title='Share This Artikel'/>
</div>
<ul>
<li><a expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Digg' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjedWEIXjcOT1iuZcEq3ZfPfWAFWXbKXcZn5JvLDQQUMINshbfKire8apwV9vsyANy1FFM4HiIhNjKU_TJYIhSmd5I2Dj00FAcu_ISQpA6VS4mudFGY-bQgXD0tycsJi3B2mWRq7qQFJpdj/s400/digg.png' title='Digg'/></a></li>
<li><a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='del.icio.us' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfPmnwN7DO0i59SGbSPf5K0slABp2pcMajPzfQ0z7ydRVnGo8RwDDb1x-O2BNzZDkOEqaXnhwKSaIr_GgCJDlX6AxAb4o6I4Vl0Ufxm6wCc8T6j4Flv8dEC_kUzLjDhBIo1MzYp2b1LCrL/s400/delicious.png' title='del.icio.us'/></a></li>
<li><a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Facebook' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQcY3n8uThyphenhyphen0zCoeJSzVg2y6nNPnCJrx9Gn1eqDHQ8QJgHsF6oRQ25K27Ck1e4LlJropmWPwZSzmvCi2tpo7TWd2tFzD_D6JYeJ-6LEZsekUgl9be-QfqDP1pE8qMNnOLfqSv8AgSiMcQB/s400/facebook_002.png' title='Facebook'/></a></li>
<li><a expr:href='&quot;http://www.google.com/bookmarks/mark?op=edit&amp;bkmk=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Google' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU3EdTAiw0kJYo0F4q49bJOfcVNxiWdgRDys1D1DPyqsUl9SGyCz-ANWaZUgfjZTBG2Z2kgn4R5xpvQE2Uka5E5Pk_hsuWRUVktMc2JOuD9Jl0En0FJq-EHNM96RsrBq_-F7UKTtGfdJX4/s400/googlebookmark.png' title='Google'/></a></li>
<li><a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='StumbleUpon' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiB5I8vpkrcCaj904IKc0v9X4ZWzLzeXiKSyGGZtkk37Hy29-aNfuCa0m5Zl8rkMeFrglXCB66z9xVbHvSCvcqQq5ihHaaNQ5qsDwmdd_NM51zA4IEhGB1r0w9yXhAkyoV1cjAAPIPMIRMr/s400/stumbleupon.png' title='StumbleUpon'/></a></li>
<li><a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Technorati' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZG6YJtB9f6NzLyDjJZCVF2C7GMGtksS8exWnLC-7R54jqlE-1xaOlgg3CS3U1LZ4_-z5z33RSng_oO3dFyHJHinb5t9HHLXrSIksWoQ_WeFG0nJ5v90wnptLaDekCn9Y49u1zAbQzOmic/s400/technorati.png' title='Technorati'/></a></li>
<li><a expr:href='&quot;http://twitter.com/home?status=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='TwitThis' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghMUA5-yA1wmXS7BplzR4zBYiFVRCoY4VMv7mJfXTdCGZP_91VNfCmaRpxI-MEwlJiLUo4T16dJiSbm3W96LSUfbJDYSiWTgbgB09CzODRG-imfdaH1Fp6CV1BFGItcZenOSkdtNEa4xeM/s400/twitter.gif' title='TwitThis'/></a></li>
</ul>
</div>
</b:if>

Read more: http://www.maspeypah.co.cc/2010/02/cara-membuat-share-this-post.html#ixzz0i7yChRBM
7. Save . Selesai !!

Happy Blogging !!

Cara Membuat Button Save as PDF


Pastinya kita tertarik bukan menempatkan button save as PDF di bawah postingan kita supaya para pengunjung dapat menyimpan hasil postingan kita dalam format PDF. Bukan hanya membantu, mempermudah lagi. Mudah - mudahan dapat pahala.. amin..


:okay:


1. Masuk ke Layout/Tata Letak
2. Klik Edit HTML
3. Cari kode <data:post.body/>
4. Biasanya jika kamu memasang read more, akan terdapat dua buah
<data:post.body/>
, copy pastekan kode di bawah ini di bawah kode
<data:post.body/>
yang kedua

<center>
<!-- START: PDF Online Script -->
<script type='text/javascript'>
var authorId = &quot;4D2009E0-017A-4BC3-BC97-AB23434373AE&quot;;
var pageOrientation = &quot;0&quot;;
var topMargin = &quot;0&quot;;
var bottomMargin = &quot;0&quot;;
var leftMargin = &quot;0&quot;;
var rightMargin = &quot;0&quot;;
</script>
<script src='http://web2.pdfonline.com/pdfonline/pdfonline.js' type='text/javascript'>
</script>
</center>
5. Klik Save Template :hi:

Happy blogging !

Cara Membuat Tulisan Terbalik


Posting kali ini bercerita tentang....cara membuat tulisan dengan gaya terbalik. Mungkin anda pernah melihat sebelumnya dan ada yang tahu da nggak tahu caranya. Posting kali ini khusus ukhra share buat kamu yang belum mengetahuinya. Contohnya begini...

˙˙ǝnƃ ƃuısnd uıʞıq `uɐsılnʇ ɥıu ɹǝuǝq


Untuk membuatnya, tidak perlu sampai mengotak atik blog kamu, cukup kunjungi tool online gratis berikut..

1. www.fliptextgenerator.com
2. www.techdo.com

Happy blogging !!

Cara Membuat Label Cloud Blogumus


Mengganti penampilan label anda yang biasa dengan label cloud berupa animasi flash yang dapat berputar - putar dan mengarah ke kamu jika di tunjuk menggunakan pointer tidaklah sesulit yang anda kira. Jika ingin lebih tahu lagi, ikuti langkah - langkah di bawah..




1. Masuk ke Layout/Tata Letak
2. Klik Edit HTML
3. Beri centang pada Expand Widget Template
4. Cari kode di bawah ini

<b:section class='sidebar' id='sidebar' preferred='yes'>


5. Copy pastekan kode di bawah ini tepat di bawah kode yang kita cari tadi

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

6.Ganti tulisan berwarna hijau dengan lebar, tinggi dan warna latar belakang yang anda inginkan
7. Ganti tulisan berwarna orange dengan ukuran tulisan yang anda mau
8. Dan ganti tulisan berwarna ungu dengan kecepatan gerak yang anda inginkan
9. Klik Save Template..

Happy blogging !

Banner Rotasi



Pada kesempatan ini ( ceilee, kek mau pidato aja ) ukhra akan memberikan tips tentang penghematan penampilan blog anda yaitu membuat banner anda tampil bergantian dan otomatis supaya yang tadi itu, agar halaman anda tidak terlalu penuh dan berattt.. Okay, cekidot..

1. Masuk ke Layout/Tata Letak
2. Klik Page Element
3. Klik Tambah Gadget
4. Pilih HTML/Javascript
5. Copy pastekan kode di bawah ini

<script type="text/javascript">
var imgs3 = new Array("URLImagesatu","URLImagedua","URLImagetiga");
var lnks3 = new Array("URLLinksatu","URLLinkdua","URLLinktiga");
var alt3 = new Array("ukhra","ukhra","ukhra");
var currentAd3 = 0;
var imgCt3 = 3;
function cycle3() {
if (currentAd3 == imgCt3) {
currentAd3 = 0;
}
var banner3 = document.getElementById('adBanner3');
var link3 = document.getElementById('adLink3');
banner3.src=imgs3[currentAd3]
banner3.alt=alt3[currentAd3]
document.getElementById('adLink3').href=lnks3[currentAd3]
currentAd3++;
}
window.setInterval("cycle3()",10000);
</script>
<a href=""URLLinkPertamaTampil"" id="adLink3" target="_top">
<img src="URLImagePertamaTampil" id="adBanner3" border="0" width="468" height="60"></a>



6. Ganti tulisan berwarna merah dan Save

Happy blogging !

Cara Membuat Blogger Login

Blogger Login membuat langkah anda lebih praktis lagi. Dengan menampilkan blogger login di blog anda, anda dapat login ke blogger langsung dari blog anda tanpa membuka blogger.com. Praktis bukan. Lihat gambar di bawah sebagai contoh ..












Jika kamu tertarik, ikuti langkah - langkah di bawah ini..
1. Masuk ke Layout/Tata Letak
2. Klik Page Elements
3. Klik Tambah gadget
4. Klik add HTML/Javascript
5. Masukkan kode di bawah ini

Please enter your username and password to enter your Blogger Dasboard page!<br/><br/><form id="start-login" action="https://www.google.com/accounts/ServiceLoginBoxAuth" name="login" onsubmit="onlogin()" method="post"><input value="http://www.blogger.com/loginz?d=%2Fhome&p=http%3A%2F%2Fwww.blogger.com%2F" name="continue" type="hidden"/><input value="blogger" name="service" type="hidden"/><input value="8" name="nui" type="hidden"/><input value="8" name="naui" type="hidden"/><input value="2" name="fpui" type="hidden"/><input value="3" name="uilel" type="hidden"/><input value="true" name="skipvpage" type="hidden"/><input value="false" name="rm" type="hidden"/><input value="true" name="alwf" type="hidden"/><input value="http://www.blogger.com/login.g" name="roeu" type="hidden"/><input value="0" name="alinsu" type="hidden"/><input value="WbQ8QiJfUvA" name="GA3T" type="hidden"/><div><label for="Email"> Username: <br/><input id="Email" tabindex="1" value="" name="Email" size="20" type="text"/></label></div><div><label for="Passwd"> Password: (<a href="https://www.blogger.com/forgot.g" target="_top" title="Forgot your password?">?</a>) <br/></label><input id="Passwd" tabindex="2" autocomplete="off" name="Passwd" size="20" type="password"/></div><br/><input id="signin-btn-ns" tabindex="0" value="Sign in" class="ubtn ubtn-block" name="submit" type="submit"/></form><span style="font-size: 80%">Widget edited by <a href="http://www.seby-antoe.com/2009/07/membuat-blogger-login-widget.html" target="_blank">Seby-Antoe.com</a></span>


6. Klik Save

Cara Membuat Kata Sambutan untuk Pengunjung


Kata sambutan disini dimaksudkan yaitu untuk mengeluarkan kata sambutan ketika pengunjung blog kamu memasuki blog kamu. Terdapat dua jenis penampilan kata sambutannya, yakni yang pertama hanya berupa kata saja, yang kedua pengunjung mesti memasukkan input sehingga ada interaksi dari pengunjung. Baiklah, ikuti langkah - langkah dibawah ini..

Jenis 1

1. Masuk ke Layout/Tata Letak
2. Klik Edit HTML
3. Cari kode </head>
4. Copy pastekan kode di bawah ini di atas </head> tadi

<SCRIPT language='JavaScript'>alert("Welcome !!");</SCRIPT>


5. Ganti kode berwarna merah dengan kata sambutan kamu
6. Klik Save template

Jenis 2

1. Tidak berbeda dengan di atas, cari kode </head>
2. Copy pastekan kode di bawah di atas kode </head>

<script type="text/javascript">
var yourName = prompt("Masukkan nama kamu :");
</script>


3. Ganti tulisan berwarna merah dengan kata - kata kamu
4. Klik Save Template

Happy blogging !

Cara Menampilkan Icon di Sebelah Judul Posting


Menampilkan icon di setiap judul posting tepatnya di sebelah judul posting, tidak memerlukan persiapan yang terlalu banyak. Cukup kamu sediakan icon/ gambar yang akan menjadi calon pendamping, loh ? Maksudnya pendamping judul postingan kamu lo. Berikut ini langkah - langkahnya ..

1. Masuk ke Layout/Tata Letak
2. Klik Edit HTML
3. Beri tanda centang pada Expand Widget Template
4. Lalu cari kode <a expr:href='data:post.url'>
5. Copy pastekan kode di bawah ini tepat di bawah kode <a
expr:href='data:post.url'>
tadi

<img border='0' src='alamat url icon kamu'/>


6. Ganti tulisan berwarna merah dengan alamat url icon kamu
7. Klik Save Template..

Happy Blogging !

Cara Buat Recent Post dengan Thumbnails


Membuat Recent Post memakai thumbnail tidak memerlukan Javascript yang merepotkan anda karena widget ini disediakan langsung oleh blogbuster untuk anda secara otomatis. Anda hanya mensetting dasar - dasarnya tanpa perlu mengotak -atik di Edit HTML. Nah, kalo anda mau membuat recent post anda memiliki tampilan yang lebih elegan, ikuti langkah - langkah berikut.

1. Masuk ke Layout/Tata Letak
2. Klik Page Elements
3. Klik Tambah gadget
4. Lalu kan muncul pilihan - pilihan widget, anda pilih kategori unggulan (future)
5. Akan muncul dua buah widget recent post, pilih yang kedua. Seperti ini..





6. Setelah diklik, akan muncul tampilan berikut





7. Atur sesuai keinginan anda
8. Save..

Happy blogging !

Cara Buat Signature/Tanda Tangan di Setiap Posting


Halo sahabat blogger.. Kali ini ukhra pengen share tentang tips blog untuk mempercantik tampilan blog kamu. Yaitu gimana cara buat signature atau tanda tangan di setiap postingan kamu..

Ikuti aja langkah - langkah di bawah dan dapatkan hasilnya seperti ini ...



Uppz..Tunggu dulu.. Kamu harus bikin dulu tanda tangan yang kamu design dan upload di photobucket ataupun imageshack.. Kamu bisa membuat signature juga melalui situs http://mylivesignature.com/..


1. Masuk ke Layout/Tata Letak
2. Klik Edit HTML
3. Beri centang pada Expand Widget Template
4. Cari kode <data:post.body/>

Note : Kamu bakalan nemuin 2 buah kode <data:post.body/> , letakkan kode dibawah ini di
bawah kode <data:post.body/> yang kedua..

<b:if cond='data:blog.pageType == "item"'>
<br/><br/><img src='alamat url gambar.mu'/>
</b:if>


5. Ganti tulisan berwarna merah dengan alamat url gambar yang udah kamu upload
6. Save..

Cara Buat Shoutbox Tersembunyi


Ini ukhra berikan tips biar buku tamu atau shoutbox kamu diletakkin tersembunyi, biar nggak nambahin ruang halaman blog kamu dengan panjang yang tidak terdefinisi.. ( lebay..)..Contohnya kamu bisa lihat shoutboxnya ukhra yang tersembunyi di pojok kanan bagian atas..

Kalo kamu tertarik, lanjut ke trik di bawah ini..



:lamagawa:


1. Masuk ke Layout/Tata Letak
2. Klik Page Element
3. Klik add gadget
4. Lalu, pilih add HTML/Javascript
5. Copy - pastekan kode di bawah ini....


<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGxk8bfPWCGrVC3JPIduNVIPZLCKE7ryhyphenhyphenzrkEqiKgJODt-WKrDqI-mgxJJ395FhHqHCsJP_C1EKr-d1GGiKiJrBiodyUzPsIw0Fteso16k_mRQX2sxXG9JjcbgaOT0EN4XNlOI-NQeshz/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

taruh kode shoutbox mu disini!!

<br/>
ingin seperti ini ??<br/>
<a onmouseover="window.location=this.href" href="http://www.ag5000nw-baru.co.cc/2009/12/by-peypahcara-menyembunyikan.html">di sini tempatnya!!</a>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

6. Ganti tulisan warna merah dengan kode shoutbox kamu..
7. Jangan di beri judul pada widget ini
8. Save...

Semoga berhasil !

Mau Tahu Berat Blog Kamu ?


Mmm..mau tau nggak berat blog kamu berapa? Itu tuh yang buat ukhra penasaran dan ngecek berat nih blog..Eh..eh ternyata..eh ternyata... berat bget..lebih dari 100....
:waaah:.....iya pastinya terkejut donk..Karena sebaiknya blog kamu itu kamu bikin seringan mungkin, usahain juga jangan terlalu banyak widget di halaman kamu, untungnya ke kamu juga, karena search engine biasanya enggan nampilin blog yang berat - berat. Trus bisa bisa bikin bosan pengunjung juga karena lama banget nunggu loadingnya, trus pergi deh si pengunjung tanpa ninggalin jejak..


Oke, gunain tool di bawah ini buat ngecek berat blog kamu, biar kamu tau dan buat antisipasi juga. Masukkin alamat blog kamu di bawah ini. Jangan lupa berdoa dulu biar beratnya nggak lebih dari 100..
:puppyeyes:























Your domain(s): Enter each address on a new line (Maximum 10)




(eg. iwebtool.com)





Powered by iWEBTOOL

Cara Buat Recent Comment dan Recent Post Menggunakan Javascript


Wah..udah lama ni sepi nggak nge post..:yawn: Udah deh..daripada terdiam membisu..ngepost lagi ahh...Sekarang bahas tentang cara buat recent post ama recent comment pake javascript aja deeh..biarin deh..meskipun udah banyak nan jauh disana orang - orang ngepost tentang ini..ga papa deh ya..:devilishgrin:


Oke, buat yang blom tau, ni ukhra kasih langkah - langkahnya.. !
:astig:


Membuat Recent Comments

1. Login dulu ke akun blog kamu
2. Masuk ke Layout/Tata Letak
3. Klik Page Elemen/Elemen Halaman
4. Trus, klik tambah gadget
5. Pilih HTML/Javascript
6. Copy pastein kode di bawah ini..

<script style="text/javascript" src="http://www.belajarngeblog.com/script/showrecentcomments.js">
</script><script style="text/javascript">var numcomments = 5;var showcommentdate = true;var showposttitle = true;var numchars = 100;var standardstyling = true;</script> <script src="http://namabloganda.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>
Note :
Jangan lupa ganti tuisan yang berwarna merah dengan jumlah comment yang mau
ditampilkan dan juga alamat blog kamu..

7. Save..


Membuat Recent Posts

1. Masuk ke Page Elemen
2. Klik Tambah gadget
3. Add HTMl/Javascript
4. Copy pastekan kode di bawah ini...

<script src="http://ekhan.gitar1stindo.googlepages.com/recentpost.js"></script>
<script>var numposts = 25; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>
<script src="http://bloganda.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">
</script>
Note :
Jangan lupa ganti tulisan yang warnanya merah dengan alamat blog kamu..

5. Save..

Cara Mengupdate Edit Entry


Banyak efek tulisan yang bisa diterapkan untuk tulisan yang akan di posting di blog yang dapat membuat postingan berpenampilan menarik dan kreatif. Ini adalah salah satunya, yaitu membuat efek stabilo pada tulisan di posting, dan lain - lain..





1. Login ke akun blogger kamu
2. Masuk ke Setting atau Pengaturan
3. Klik Dasar
4. Lihat dan geser kursor kamu ke bawah sampai kamu melihat Setting Global
5. Pilih Editor Entry anda dengan mengklik tombol radio button pada Editor yang diperbarui






6. Save..

7. Kemudian ketika anda memposting, editor entry anda akan berbeda dan anda bisa mengedit postingan anda lebih baik lagii....


Cara Membelah Header



Kita sering melihat blog - blog yang headernya sudah terbagi dua, sehingga disebelahnya satu lagi bisa diletakan widget untuk search engine, banner atauun widget lainnya. Begini ni struktur page elementsnya..




Oke deh, kalo tertarik langsung aja kelangkah - langkahnya..

1. Login ke Akun blog kamu
2. Masuk ke Layout/Tata Letak
3. Klik Edit HTML
4. Backup template kamu terlebih dahulu dengan mengklik Download full template
5. Cari kode CSS seperti di bawah ini

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

#header-inner {
background-position: center;
margin-left: auto;
margin-right: auto;
}

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}


6. Hapus dan ganti dengan kode CSS di bawah ini

#header-wrapper {
width:930px;
margin:0 auto 0px;
background:#38610B url(http://i33.tinypic.com/sw6cfo.jpg) no-repeat top center;
height:180px;
}

#head-inner {
width:500px;
background-position: left;
margin-left: auto;
margin-right: auto;
float:left;
}

#header {
margin: 0px;
text-align: left;
color:#ffcc66;
}

#r_head{
width:430px;
float:left;
padding-top:10px;
}

7. Kemudian cari kode seperti ini

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
</b:section>
</div>

8. Hapus dan ganti dengan kode di bawah ini

<div id='header-wrapper'>
<div id='head-inner'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
</b:section>
</div>
<div id='r_head'>
<b:section class='header' id='header2' preferred='yes'/>
</div>
</div>

9. Save template.. !!

Note :

Jika anda ingin melakukan perubahan baik dengan ukuran, anda dapat memperhatikan kode berwarna merah.

Cara Membuat Scrolling Related Posts

Tentunya istilah related post atau artikel terkait tidak asing lagi terdengar di telinga kita. Related posts biasanya diletakkan di bawah suatu posting yang tentunya berkaitan dengan postingan di atasnya, seperti terkait dengan label/ kategorinya..


Contoh tampilan related posts





1. Login ke Akun blog kamu


2. Masuk ke Layout/Tata Letak


3. Klik Edit HTML

4. Cari kode <data:post.body/> dan letakkan kode di bawah ini dibawah kode <data:post.body/> tersebut.


 <b:if cond='data:blog.pageType == &quot;item&quot;'>
<H2>Related Post:</H2>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 50;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type='text/javascript'>RelPost();</script>
</div>
</b:if>


5. Kemudian cari kode ]]></b:skin> , dan letakkan kode di bawah ini di atasnya


/*-- modifikasi related posts oleh http://bangdel.blogspot.com--*/
.rbbox{border: 1px solid #D8D8D8;padding: 5px;
background-color: #E0F8E0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #EFFBEF;}


6. Simpan dan Selesai  !!

Cara Membuat Kursor dengan Tampilan Lucu


Pada postingan kali ini, ukhra akan membantu memberikan trik yaitu membuat penampilan kursor terlihat lucu dan berbeda. Langsung aja deh ke langkah - langkah nya...Check it out..!!

Note : Kamu harus memiliki icon atau gambar yang akan menjadi calon tampilan kursor kamu..

Kamu dapat mengupload gambarnya melalui http://www.photobucket.com...

1. Login ke Akun blog anda
2. Masuk ke Layout/Tata Letak
3. Klik Edit HTML
4. Cari kode </body>..
5. Letakkan kode di bawah ini yang telah dikombinasikan dengan link gambar kamu di atas kode </body> tadi.. misalnya..



6. Lalu, simpan deh...

Cara Menghilangkan Navbar


Disini ada dua bentuk menghilangkan navbar pada halaman blog kita. Secara permanen dan akan muncul hanya jika kita menyodorkan kursor kita ke tempat biasanya navbar terletak.. Yaudah, ukhra akan menyabarkannya satu-satu. Simak trik di bawah ini...

a. Hilang secara permanen

1. Masuk ke Layout/ Tata Letak
2. Klik Edit HTML
3. Beri centang pada Expand Widget Template
4. Cari kode ]]></b:skin> dan letakkan kode di bawah ini di atas kode ]]></b:skin>



5. Save..


b. Muncul hanya ketika disodorkan kursor

1. Masuk ke Layout/Tata Letak
2. Klik Edit HTML
3. Beri centang pada Expand Widget Template
4. Cari kode ]]></b:skin> dan letakkan kode di bawah ini di atas kode ]]></b:skin>



5. Save..


Salam semangat blogger !!