Secret's

Minggu, 17 Juni 2012

Cara Memasang Meta Tag Setiap Postingan Otomatis

Diposting oleh Unknown di 13.31 0 komentar

Cara Memasang Meta Tag Setiap Postingan Otomatis. Pada awal pembahasan ini saya akan memberikan panduan seputar SEO. Panduan kali ini saya membahas cara memasang meta tag otomatis untuk setiap postingan. Meta Tag Otomatis ini sudah sangat populer di kalangan blogger, termasuk blog ini yang menerapkan meta tag otomatis untuk setiap postinganya. Keuntungan memasang meta tag ini adalah mempermudah Mesin Pencari (Search Engine)untuk menemukan postingan. Keuntungan lain dari meta tag otomatis ini adalah membedakan meta tag halaman awal dan halaman posting. Sekarang Anda harus beralih dengan meta tag otomatis ini dan jangan menggunakan meta tag kuno.

Berikut Panduan Cara Memasang Meta Tag Setiap Postingan Otomatis

Login ke Akun Blogger sobat
Pilih Template lalu Edit HTML
Kemudian cari kode berikut ini

<head> {Pembuka}

............

Meta Tag

............

<b:skin><![CDATA[ {Penutup}

Kemudian lihat template Anda dan hapus meta tag diantara Pembuka dan Penutup
Letakan Meta Tag Otomatis berikut ini kedalamnya

<b:include data='blog' name='all-head-content'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<meta content='Masukan Deskripsi untuk Halaman Awal' name='description'/>
<meta content='Masukan Kata Kunci untuk Halaman Postingan' name='keywords'/>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<meta expr:content='data:blog.pageName + &quot;, Masukan Deskripsi untuk Halaman Postingan&quot;' name='description'/>
<meta expr:content='data:blog.pageName + &quot;, Masukan  Kata Kunci untuk Halaman Postingan&quot;' name='keywords'/>
</b:if>
<meta content='index, follow' name='robots'/>
<meta content='1 days' name='revisit-after'/>
<meta content='id' name='language'/>
<meta content='id' name='geo.country'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='global' name='distribution'/>
<meta content='translate' name='google'/>
<meta content='all, index, follow' name='googlebot'/>
<meta content='all, index, follow' name='yahoobot'/>
<meta content='all, index, follow' name='msnbot'/>
<meta content='all, index, follow' name='bingbot'/>
<meta content='all, index, follow' name='spiders'/>
<meta content='all, index, follow' name='webcrawlers'/>
<meta content='document' name='resource-type'/>
<meta content='id' http-equiv='Content-Language'/>
<meta content='never' name='expires'/>
<meta content='general' name='rating'/>
<meta content='global' name='target'/>
<meta content='all' name='audience'/>

Terakhir Save Template

Sebelumnya Anda jangan lupa untuk meletakan Google Verifikasi, Bing Verifikasi, Alexa Verifikasi pada template blog Anda

Demikianlah panduan seo tentang meta tag otomatis. Di akhir pembahasan ini saya akan mengakhiri artikel dengan judul Cara Memasang Meta Tag Setiap Postingan Otomatis. Jika Anda merasa kesulitan berkomnetarlah pada komentar di bawah ini.

Cara Membuat Menu Beadcrumbs Terindex Google

Diposting oleh Unknown di 13.31 0 komentar

Cara Membuat Menu Beadcrumb Terindex Google. Di awal pembahasan ini saya akan memberikan trik agar menu breadcrumb terindex oleh mesin pencari khususnya oleh Google. Trik ini hampir sudah diketahui dan dipraktekan oleh blogger indonesia lainnya dan sempat gumang di awal tahun 2012 ini. Memasang trik ini ada syaratnya, label pada blog anda harus terlebih dahulu terindeex google yaitu dengan cara copas link label lalu taruh di mesin pencari google.

Berikut ini Pandan Cara Membuat Menu Beadcrumb Terindex Google

Masuk ke Akun Blogger sobat
Pilih Template lalu Edit HTML
Centang Expand Template Widget
Kemudian letakan kode css berikut sebelum kode ]]></b:skin>

.breadcrumbs{box-shadow:0 1px 4px rgba(0,0,0,0.27),0 0 40px rgba(0,0,0,0.06) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.27),0 0 60px rgba(0,0,0,0.1) inset;-moz-box-shadow:0 1px 4px rgba(0,0,0,0.27),0 0 40px rgba(0,0,0,0.06) inset;-khtml-box-shadow:0 1px 4px rgba(0,0,0,0.27),0 0 60px rgba(0,0,0,0.1) inset;background:#F5F5F5 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjbhSuc82xelnSNPUFln31vE9lIJi8zCwmDT62gdkTVMCcVk2EWDf1Mg9ADvGrZ_sd7OlbiABhfAEIgZ1LvgpYPEbxd4j99f8rQObPFaTW5GFq0a8qxz7J4iJML8Pte0BFRkw6JclUvnU/s1600/backgroundbreadcrumb.png);background-repeat:repeat-x;-moz-border-radius:5px;line-height:1.4em;font:11px Tahoma,arial,Verdana,sans-serif;border:1px solid #d2d2d2;margin:0 0 5px;padding:5px 5px 5px 10px}

Kemudian cari kode berikut ini

<b:includable id='main' var='top'>

Hapus kode tersebut kemudian ganti dengan kode berikut ini

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Beranda</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Beranda</a></span>
<b:loop values='data:post.labels' var='label'>
&#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:loop>
&#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Beranda</a></span> &#187; <span>Unlabelled</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Beranda</a></span> &#187; <span>Arsip untuk <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl'>Beranda</a></span> &#187; <span>Semua artikel</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Beranda</a></span> &#187; <span>Artikel pada <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>

Terakhir Save Template

Demikian panduan seo pada kesempatan kali ini. Di akhir pembahasan ini saya akan mengakhiri artikel yang berjudul Cara Membuat Menu Beadcrumb Terindex Google. Jika Anda ingin bertanya bertanyalah pada komentar di bawah ini.

Cara Menjadikan Title Heading Blog SEO Friendly

Diposting oleh Unknown di 13.29 1 komentar

Cara Menjadikan Title Heading Blog SEO Friendly. Di awal pembicaran ini saya akan memberikan trik tentang mengedit judul posting agar menjadi seo friendly. Menentukan tag judul posting haruslah tepat, H1 sangat baik dijadikan pada judul posting karena google pertama kali akan mengindex dari h1, h2 dan seterusnya, tetapi kalian tidak boleh mengganti heading tersebut dengan asal karena nantinya akan terjadi duplikat h1 dan memperburuk posisi di mesin pencari. Pada panduan berikut ini judul posting memiliki heading yang berbeda antara halaman awal dan halaman posting.

Berikut ini Panduan Cara Menjadikan Title Heading Blog SEO Friendly

Masuk ke Akun Blogger sobat
Pilih Tenplate lalu Edit HTML
Centang Expand Template Widget
Kemudian gunakan ctrl-f untuk mencari kode berikut ini

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

Kemudian ganti dengan kode bdi bawah ini

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.title'>
<h2 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>
<b:else/>
<h1 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h1>
</b:if>

Kode di atas menjelaskan kalian sudah merubah tag heading judul posting menjadi H1, tahap selanjutnya akan menjelaskan mengenai header blog.

Kemudian Gunakan ctrl-f untuk mencari kode berikut ini

<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>

Hapus kode di atas dan ganti dengan kode berikut ini

 <b:if cond='data:blog.pageType != &quot;item&quot;'>
<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>
<b:else/>
<p class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</p>
</b:if>

Cari lagi kode di bawah ini

<h1 class='title'>
<b:include name='title'/>
</h1>

Hapus kode di atas dan ganti dengan kode di bawah ini

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:else/>
<p class='title' style='font-size:30px; font-weight:bold;letter-spacing:-1px;line-height:normal;margin:5px 5px 0;padding:15px 20px 3px 0;'>
<b:include name='title'/>
</p>
</b:if>

Kode di atas akan membedakan antara header blog dengan judul posting agar tidak terjadi duplikat pada satu halaman.

Tahap ini akan mengubah tag heading pada judul sidebar menjadi h3

Cari kode berikut ini

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>

Kalian hanya mengganti h2 dengan h3 saja.

Tahap selanjutnya kalian harus mengubah CSS pada template blog kalian agar tampilannya sesuai dengan kode kode di atas.

Pertama pengubahan CSS untuk judul posting

Cari CSS seperti berikut

.post h3 {.....................;}
.post h3 a, .post h3 a:visited, .post h3 strong {.....................;}
.post h3 strong, .post h3 a:hover {.....................;}

Kemudian hapus dan ganti dengan CSS di bawah ini

.post h1, .post h2{color:$titlecolor; font-size:160%; font-weight:normal; line-height:1.4em; margin:0.25em 0 0; padding:0 0 4px}
.post h1 a, .post h1 a:visited, .post h1 strong, .post h2 a, .post h2 a:visited, .post h2 strong{color:$titlecolor; display:block; font-weight:bold; text-decoration:none}
.post h1 strong, .post h1 a:hover, .post h2 strong, .post h2 a:hover{color:#333}

Kedua pengubahan CSS untuk Header Blog

Cari CSS Header berikut ini

#header h1 {.....................;}

Kemudian hapus CSS Header di atas dan ganti dengan CSS berikut ini

#header h1, #header p{margin:5px 5px 0; padding:15px 20px .25em; line-height:1.2em; text-transform:uppercase; letter-spacing:.2em; font:$pagetitlefont}

Tahap selanjutnya pengubahan heading judul sidebar blog

Cari CSS sidebar berikut ini

.sidebar h2{.....................;}

Kemudian ganti h2 menjadi h3

Demikianlah pembahasn tentang tag heading title blog. Di akhir pembahasan ini saya akan mengakhiri artikel yang berjudul Cara Menjadikan Title Heading Blog SEO Friendly. Jika kalian kesusahan dalam memasukan kode kode di atas betanyalah pada komentar di bawah ini.

Kamis, 26 April 2012

Show Your HTML/Javascript and Css Codes In Bulb Lights

Diposting oleh Unknown di 07.07 0 komentar

Showing HTML/Javascript codes is a most important part. Every blogger try something new to show their HTML/Javascript codes diffrently. Today I am going to show you this amazing tool which shows your HTML.Javascript code in light of glowing bulb. Actually it is a magic of css no need to install any widget,just by adding a simple code.

View Demo

How To Add It To Blogger ?

Let's see how to add this tool to blogger.

First go to Blogger > Design > Edit HTML
Now Search for the tag ]]></b:skin>
Copy and paste below code just above/before ]]></b:skin> tag.

.code1 {
overflow:auto;width:503px;height:200px;
font-family: "Consolas", "Courier New", Courier, mono, serif;
color:#848176;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 35px;
clear : both;
list-style-type : none;
background : #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgweX-n90hAeRLb1PAXIGwAAyJDJ3ObBvl5UYK4_7p5paW6EnCmuHn1fVlE8zO6grGYXzXAz5Z96C5CJcxbyRJLK7IE5DiCE_twz2Hc_8C2al2hSIrc7dITY_sNTzJrhXh2xiubNAIf5PRs/s320/btsnts-show-codes1.jpg) repeat-y top left;
border : 1px solid #000000;
border-left:20px solid #ccc;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px
}
.code1:hover{
background : #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0kPSiGRfF2tKRCEz15wtXDVZLsHUs19-9ZOPwoLHk4nwCZdqe016EX0t_k3pnsiZL4SnZRK27pO4M-D-Nk7pu4_vgYsRz0h6a1hN5HT1gzEcDK57xxzDY1sdIsZvu-0fzFLUDCEaJmW1g/s1600/btsnts-show-codes2.jpg) repeat-y top left;
color:#FEF9BF;
border : 1px solid #000;
border-left:20px solid #ccc;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 10px 10px 5px #888888;
}

How To Show It In Blogger Posts ?

1. Go to your post editor and choose Edit HTML.

2. Add <div class="code1"> Your Code Here </div>

Note - If you want to show your HTML/Javascript in your posts then firstencode them

If still you are getting any problem then throw it into comment box.

Sabtu, 21 April 2012

Cara Membuat Widget Komentar Terbaru Dengan Efek Marquee / Berjalan

Diposting oleh Unknown di 03.16 0 komentar

Cara Membuat Widget Komentar Terbaru Dengan Efek Marquee / Berjalan - Kali ini saya akan membahas mengenai Tutorial Blog yaitu Cara Membuat Widget Komnetar Terbaru Dengan Efek Marquee / Berjalanfungsi widget ini menampilkan Komentar terbaru di Blog sobat dengan Efek berjalan dari atas ke bawah silahkan lihat demo nya dibawah ini

On Apr 21 mery commented on cara setting emulator ps1 epsxe 170 di
gan,,kok aku mo config video nya koq gag ad pilihan Pete's DX6 D3D Driver 1.77?? gimana sih?

On Apr 21 www.michaellandresteven96.blogspot.com commented on cara membuat related post dengan
makasih gan ijin nyobain ya

On Apr 20 cimotivator commented on cara membuat 3 tab menu dengan jquery
mas,bikin tutor mengenai cara membuat logo seperti blazerracing donk....pliss........klo udah...(more)

On Apr 20 Fajar Lesmana commented on stop geng motor stop kekerasan
Ya bener gan, sebaiknya untuk apa ikut-ikutan kaya gitu ga ada gunanya

On Apr 20 Smooth-x commented on tombol share jquery dengan efek slide
cakep om... dah ane coba.. sip.. dah...matur nuhun...

On Apr 20 Fajar Lesmana commented on cara membuat menu horizontal dekat
Sama-sama gan

On Apr 20 Anonymous commented on sony xperia s resmi masuk indonesia
mantab artikelnya, kunjungan balik ya sob diwww.starchau.blogspot.com

On Apr 20 cara menyembuhkan diabetes commented on stop geng motor stop kekerasan
bener tuch....klo loe emg pria sejati buatlah sesuatu yang lebih bermanfaat bwt masyarakat supaya...(more)

On Apr 20 cara menyembuhkan diabetes commented on khasiat jus alpukat bagi kesehatan
waahhhhhbaru tahu nich klo buah alpukat itu bagus juga yach ntuk kesehatan....

On Apr 20 SHARE AJA commented on cara membuat menu horizontal dekat
Terima kasih tips nya sob, udah aku praktekkan di blog aku, salam kenal.

On Apr 19 Fajar Lesmana commented on cara memodifikasi widget subscribe via
Maaf mas saya ga bisa kasih tahu karena di kotak komentar ini ga bisa menulis script

On Apr 19 Fajar Lesmana commented on cara membuat related post dengan
Nah kan itu bisa, dan terimakasih atas nasihat nya.

On Apr 19 Fajar Lesmana commented on cara menambahkan caption pada gambar
Sama-sama gan, salam persahabatan juga

On Apr 19 Fajar Lesmana commented on cara setting emulator ps1 epsxe 170 di
ya yang penting kaset tersebut berlabel PS1, apapu jenis kaset nya jika kaset berlabel PS1 bisa...(more)

On Apr 19 Fajar Lesmana commented on widget share egg yang bisa buka tutup
Oh trimakasih atas anugrah dan AWARD nya ya Sob.

Mau tahu cara membuatnya silahkan copy kode dibawah ini dan paste ke HTML Java Script.

<marquee align="center" direction="down" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2">
<script src="http://buternaker.googlecode.com/files/comment-slide.js">
</script>
<script>
var numcomments = 15;
var showcommentdate = true;
var showposttitle = true;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://blazerracing.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments">
</script>
</marquee>

Sumber Java Script www.kucoba.com

Ganti kode yang berwarna merah denagn URL Blog sobat.
Sekian Penjelasan dari saya semog artikel bermanfaat bagi sobat

Sabtu, 24 Maret 2012

Cara Mudah Membuat Tampilan Blog/Web Maintenance

Diposting oleh Unknown di 08.50 1 komentar

بِسْمِ اللّهِ الرَّحْمَنِ الرَّحِيْمِ

Cara Mudah Membuat Tampilan Blog/Web Maintenance. Yups, kali ini ::Blogging Is My Life:: akan share mengenai Cara Mudah Membuat Tampilan Blog/Web Maintenance. Cara ini bisa sobat pakai bila sobat ingin membuat tampilan maintenance pada blog/web sobat.

Cara ini hanya menggunakan trik CSS dengan penambahan gambar saja kok. Tapi trik ini bisa membuat blog/web sobat seakan-akan seperti sedang maintenance.

Yups ok mari kita langsung aja pada langkah" Cara Mudah Membuat Tampilan Blog/Web Maintenance :
1. login blog
2. buka rancangan >> edit HTML
3. taruh kode dibawah ini diatas kode ]]></b:skin>

html {
height: 100%;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimcNcl8onhWz7O-1PGhthXDMsxxD7dlqjonwu4QHVCiP8WJaq48uWoKs8WW_8AHEOpqXZwClZ7UFt6Z5p9KcwhpxRZjQikjIN4Ypdw1NeePs-YW98nCWN2mzS_7Z5mfzE_nOZ78Kf-PqA/s1600/under-maintenance.gif) no-repeat center 50%;
margin: 0;
}
body {
display: none;
}

4. sobat bisa mengganti tulisan yang berwarna merah dengan alamat gambar yang lain.

Selamat mencoba sob ^_^

Cara Membuat Widget Cek Berat Blog/Web

Diposting oleh Unknown di 08.47 0 komentar

بِسْمِ اللّهِ الرَّحْمَنِ الرَّحِيْمِ
Yups sebelumnya saya sudah share ke sobat" cara mengecek berat blog jadi kali ini saya kan share Cara Membuat Widget Speed Test atau bisa disebut widget untuk mengecek berat blog.

Ok deh langsung saja ane kasih tipsnya...
Copy kode HTML dibawah ini dan taruh di kotak postingan sobat(edit HTML) dan langsung publikasikan deh... hehehehe

<center>
<form action="http://www.iwebtool.com/tool/tools/speed_test/speed_test.php" method="get" name="pageform" onsubmit="return validate(this);" target="pageframe">
<table border="0" style="border-collapse: collapse;"><tbody>
<tr> <td height="91" valign="top">
<table class="tooltop" height="76" style="border-collapse: collapse;"><tbody>
<tr> <td>
<table border="0" cellspacing="5" style="border-collapse: collapse;"><tbody>
<tr> <td colspan="5" valign="top"><b><span style="font-size: medium;">Masukkan Alamat Blog/Web Max 10 Url: </span></b></td> </tr>
<tr> <td colspan="4" valign="top">
<textarea name="domain" rows="11" style="width: 100%;"></textarea></td> <td>
</td> </tr>
<tr> <td>
<input style="float: left;" type="submit" value="Check!" /></td> <td>
<span style="font-size: x-small;">(<a href="http://vikrymadz.blogspot.com/">http://vikrymadz.blogspot.com</a>)</span></td> <td>
</td> <td colspan="2"></td> </tr>
</tbody></table>
</td> </tr>
</tbody></table>
</td> </tr>
<tr> <td>
</td> </tr>
<tr> <td height="39">
</td> </tr>
</tbody></table>
</form>
<script language="JavaScript">
function validate(theform) {
if (theform.domain.value == "") { alert("No domain provided"); return false; }
return true;
}
</script>
</center>

Selamat mencoba.....

Pages

Secret's

Lorem ipsum dolor sit amet

widgeT Follow Blogger

Popular Posts

Blog Archive

Mengenai Saya

Pengikut

Partner

Buscar

HorizCantik