Home → Semua Post

Membuat Text Area dengan Tombol Highlight All

Membuat Text Area dengan Tombol Highlight All | Tutorial Blog

Tutorial kali ini saya akan coba berbagi tentang cara Membuat Text Area dengan tombol Highlight All. Dengan menggunakan Highlight All akan lebih memudahkan mengcopy kalimat/kode script yang ada di dalam text area.

Untuk membuatnya cukup mudah, silahkan copy kode dibawah ini :

<div>
<form name="copy">
<div align="center">
<input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Highlight All" /> </div>
<div align="center">
<textarea cols="20" name="txt" rows="4" style="height: 80px; width: 180px;" wrap="VIRTUAL"><a href="http://kutu-blogspot.blogspot.com/" rel="dofollow" target="_blank">Tutorial Blog</a></textarea></div>
</form>
</div>

Silahkan ganti tulisan yang berwarna biru dengan tulisan/ kode script yang anda inginkan. hasilnya akan seperti dibawah ini :

Sekian penjelasan singkat mengenai cara Membuat Text Area dengan tombol Highlight All.
Semoga bermanfaat . . .

Tag Heading Blogspot SEO Friendly

Tag Heading Blogspot SEO Friendly - Pada templates default, struktur pada tag heading masih agak berantakan. Seperti yang saya bilang pada artikel sebelumnya bahwa kebanyakan template menggunakan tag h3 sebagai judul posting, maka kali ini saya akan membahas seputar tag heading blogspot seo friendly.

Salah satu cara agar membuat blog seo friendly adalah dengan cara memasang tag heading yang benar. Blog yang disukai google adalah blog yang memiliki struktur-struktur tag heading yang benar, yang kebanyakan yaitu tag h1 sebagai judul blog, tag h2 sebagai judul artikel, dan tag h3 sebagai widget. Ketiga tag heading cukup penting karena dalam perannya masing-masing penting untuk google dan juga pembaca.

Pemasangan Tag Heading Blogspot SEO Friendly

Untuk memasangnya, silakan login ke blog anda, lalu masuk blogger > rancangan > edit html > centang expand template widget. Dan ikuti cara-cara di bawah ini:

H2 Sebagai Judul Posting

Cari kode berikut.

<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'> <b:if cond='data:blog.url != data:post.url'> <a expr:href='data:post.url'><data:post.title/></a> <b:else/> <data:post.title/> </b:if> <b:else/> <data:post.title/> </b:if> </b:if> </h3>

Lalu cari kode berikut di bawah ini.

<h3 class='mobile-index-title entry-title'> <data:post.title/> </h3>

Lanjutkan cari kode berikut di bawah ini

<Group description="Post Title" selector="h3.post-title, h4, h3.post-title a">

<Group description="Post Title" selector="h2.post-title, h4, h2.post-title a">

H3 Sebagai Widget

Kemudian yang selanjutnya adalah mengubah tag heading pada widget di blog cari kode di bawah ini

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>

Rubah h2 menjadi h3, untuk tag heading widget ini akan ada banyak di template tergantung berapa widget yang anda pasang di blog, jika ada 3 widget maka kode tersebut juga akan ada 3, maka carilah kelima tersebut dan ganti tag heading nya menjadi h2.

Catatan: Biasanya untuk perubahan pada tutorial yang terakhir yaitu mengubah tag heading pada widget, jika diubah h2 menjadi h3 maka style/judul dari widget anda akan berubah. Agar sama seperti semula, lanjutkan mencari kode berikut:

.sidebar h3

Nah barulah rubah h3 menjadi h2
Simpan template!!!

Nah sekian dulu artikel saya mengenai tag heading blogspot seo friendly. Semoga dengan mengubah struktur tag heading yang benar, maka blog anda semakin dikenal google.

Cara Membuat/Memasang Widget Top Komentator Berbentuk Cloud

Cara Membuat/Memasang Widget Top Komentator Berbentuk Cloud - Pada tutorial blog kali ini kita akan mempelajari tentang cara membuat/memasang widget top komentator berbentuk cloud.

Widget Top Komentator Berbentuk Cloud yang satu ini sudah banyak digunakan oleh kalangan blogger yang tentunya ingin memiliki komentar banyak.

Widget top komentator ini sangat berbeda dengan versi sebelumnya yaitu widget top komentator yang hanya menggunakan daftar. Penempatan daftar yang vertikal seperti itu tidak terlalu menghemat tempat, berbeda sekali dengan top komentator berbentuk cloud yang satu ini mengandalkan bentuknya memang bisa dikatakan menghemat tempat. Widget seperti ini juga memudahkan pengunjung untuk melihat dan menarik simpatinya untuk berkomentar lebih banyak lagi agar tampil di widget top komentator blog anda. Selain itu, data pada widget top komentator berbentuk cloud ini juga lebih akurat dan tidak memberatkan blog (baca: optimalkan kecepatan blog).

Selain memberikan backlink untuk pengunjung dengan widget top komentator, widget ini juga berfungsi sebagai memberikan traffic bagi pengunjung itu sendiri, dan yang paling khusus adalah memperkuat tali persaudaraan antar sesama blogger sehingga terjaring saling kunjung atau disebut pengunjung setia (baca: tips mendapatkan pengunjung setia). Anda berminat memasang widget top komentator berbentuk cloud ini di blog anda? ikuti langkah-langkahnya berikut ini:

1. Login ke akun blogger anda
2. Pergi ke menu rancangan > elemen laman

3. Klik add widget/tambah widget (sesuaikan posisinya), lalu klik HTML/JavaScript dan isikan kode berikut pada kolom yang tersedia:

<div style="text-align:justify;line-height:1.2;"><script type="text/javascript">
function cCloud(feed) {
max = 0;
min = 10000;
//finding highest and lowest count
for (i=0;i<feed.count;i++)
{
ccCount = feed.value.items[i].commentcount * 1;
if (ccCount > max){
max = ccCount;
}
if (ccCount < min)
{
min = ccCount;
}}
ccCountD = "";
display = "";
for (j=0;j<feed.count;j++)
{
ccdiff = feed.value.items[j].commentcount - min;
ccFontsize = 80 + (ccdiff * 100) / (max - min) + "%";
ccUrl = "'" + feed.value.items[j].authorurl + "'";
ccCountD = "(" + feed.value.items[j].commentcount + ")";//comment count
ccName = feed.value.items[j].title + ccCountD;
ccLName = "<a style='text-decoration:none;font-size:" + ccFontsize + "' href=" + ccUrl + " target='_blank'>" + ccName + " </a>";//clickable commentator name
display = display + ccLName;
}
document.write(display);}</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?
YourBlogUrl=http://bloganda.blogspot.com
&Exclusions=Anonymous,Synasmedseo
&ShowHowMany=10
&Order=alphabet
&_callback=cCloud&_id=cfa196644e1d6159c9183548c4b5e2f5
&_render=json"
type="text/javascript"></script><br/>
<span style="font-size: 8px;">Widget by <a href="http://daw-xp.blogspot.com/2011/09/membuat-widget-top-komentator-cloud.html" title="cara membuat/memasang widget top komentator berbentuk cloud">DAW-XP</a></span></div>

Keterangan:

Hapus tulisan yang berwarna merah jika sobat tidak ingin menampilkan jumlah komentar.
Angka 10 adalah jumlah top komentator di blog anda.
Ganti http://bloganda.blogspot.com dengan url blog anda.
Anonymous,Synasmedseo (dua nama) adalah nama-nama yang tidak ingin ditampilkan dalam top komentator anda, anda dapat mengubahnya dengan nama anda sendiri ketika berkomentar (besar kecilnya huruf berpengaruh).
Alphabet adalah urutan top komentator berdasarkan abjad atau huruf, silahkan ganti dengan "frequency" jika ingin mengurutkannya berdasarkan banyaknya komentar.

Sekian dulu postingan saya hari ini mengenai cara membuat/memasang widget top komentator berbentuk cloud. Semoga setelah anda memasang widget top komentator ini blog anda semakin ramai dan banyak komentarnya. Amin, semoga bermanfaat.

Cara Membuat Meta Tag SEO Friendly

Cara Membuat Meta Tag SEO Friendly - Kita semua tahu bahwa salah satu penunjang untuk hasil yang lebih maksimal di SERP adalah meta tag yang seo friendly. Lalu bagaimanakah meta tag seo friendly yang baik dan bagus untuk sebuah blog itu? Nah pada kesempatan ini juga saya akan membahas tentang cara membuat meta tag seo friendly untuk sebuah blog di blogspot.

Meta tag yang baik adalah meta tag yang mampu mendapat index dari search engine, baik itu google, yahoo dan search engine lainnya. Meta tag tersebut banyak dianggap kalangan blogger sebagai meta tag seo friendly karena meta tag tersebut mempunyai peran penting terhadap blog maupun artikelnya di serp. Google sendiri pun menyarankan agar menggunakan meta tag agar lebih mudah untuk mengindex sebuah web atau blog. Berikut ini adalah penerapan untuk cara membuat meta tag seo friendly:

1. Title

Judul mempunyai peran yang sangat penting bagi kelangsungan sebuah blog. Judul blog itu sendiri merupakan sebagai identitas blog itu sendiri, kita bisa memodifikasinya agar menjadi seo friendly di setiap postingan di search engine. Cari kode <title><data:blog.pageTitle/></title> lalu ganti dengan kode berikut:

<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/><title><data:blog.pageTitle/></title>
</b:if>

atau dengan kode

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>
jika anda ingin menembak keyword, gunakan tag title ini:

<b:if cond='data:blog.pageType ==
"index"'>
<title><data:blog.pageTitle/> | keyword1 | keyword2 | dst</title>
<b:else/>
<title><data:blog.pageName/></
title>
</b:if>

2. Deskripsi

Meta tag ini menjelaskan tentang deskripsi yang terdapat pada blog sobat. Meta tag ini juga berfungsi sebagai penjelasan yang lebih spesifik mengenai isi dari blog kita selain daripada judul di atas.

Meta yang satu ini diangap sebagai penentu tujuan dari sebuah blog. Kata kunci yang satu ini dapat membantu anda dalam optimasi SEO di search engine. Usahakan keyword yang anda masukkan sesuai persis dengan informasi yang terdapat pada blog anda.

Mungkin hanya 3 itu saja contoh meta tag seo friendly yang paling utama untuk menentukan hasil blog atau web anda di search engine. Tidak perlu cukup banyak-banyak meta tag untuk anda yang ingin seo friendly, namun semuanya butuh proses tidak hanya yang instan. Sekian dulu postingan saya mengenai cara membuat meta tag seo friendly. Semoga bermanfaat.

Cara Memasang Tweetmeme di Setiap Postingan

Cara Memasang Tweetmeme di Setiap Postingan - Saya baru inget, ada sebuah request dari sahabat blogger yang lupa namanya untuk me-request tentang Cara Memasang Tweetmeme di Setiap Postingan.

Tweememe adalah sebuah socialbookmark yang berkembang saat ini. Tweetmeme juga bisa mengirimkan artikel-artikel layaknya socialbookmark seperti digg dan lain-lain. Selain menambah visitor, tweetmeme ini juga berfungsi untuk menambah backlink daripada artikel tersebut.

Dengan tweetmeme ini, pengunjung dapat dengan mudah membagikan artikel yang di-tweet ke dalam twitter mereka. Kita pun juga bisa tahu siapa saja yang telah men-tweet artikel kita.

Tombol tweetmeme ini dapat dipasang di samping judul artikel (seperti blog ini) atau juga dipasang di bawah artikel. Berminat ingin Cara Memasang Tweetmeme di Setiap Postingan blog anda? Ikut langkah-langkah di bawah ini:

Tombol Tweetmeme di Samping Judul Artikel

1. Login ke blogger.
2. Pergi ke tab rancangan, lalu masuk ke edit HTML.
3. Jangan lupa untuk centang "expand template widget".
4. Cari kode <data:post.title/> (yang paling terakhir), biasanya kode lengkapnya begini:

        <b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h1>
</b:if>

5. Setelah ketemu, salin kode berikut lalu paste di bawah kode </b:if> (lihat kode pada no. 4):

<div style='float:right; padding: 0 5px 5px 0;'>
<script type='text/javascript'>
tweetmeme_style = 'compact';
tweetmeme_url = '<data:post.url/>';
tweetmeme_source = 'synasmedseo';
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'> </script>
</div>

6. Simpan template.

Tombol Tweetmeme di Bawah Artikel

1. Login ke blogger.
2. Pergi ke tab rancangan, lalu masuk ke edit HTML.
3. Jangan lupa untuk centang "expand template widget".
4. Cari kode <data:post.body/> lalu letakkan kode berikut di bawahnya:

<div style='float:right; padding: 0 5px 5px 0;'>
<script type='text/javascript'>
tweetmeme_style = 'compact';
tweetmeme_url = '<data:post.url/>';
tweetmeme_source = 'synasmedseo';
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'> </script>
</div>

5. Simpan template.

Catatan : Jika anda ingin mengatur jarak tombol dengan text yang ada di sekitarnya, anda dapat mengubahnya dengan cara mengatur nilai padding pada kode no. 5 atau no. 4 (sama saja). Anda juga dapat mengatur letaknya misalkan ke sebelah kiri hanya dengan mengubah kode right (kanan) dengan kode left.

Mungkin itu saja pembahasan kita mengenai Cara Memasang Tweetmeme di Setiap Postingan. Semoga dengan anda memasang tombol tweetmeme ini artikel anda semakin banyak dikenal orang dari setiap tweetnya. Semoga bermanfaat.

Kumpulan Tutorial Blogspot

Tips Blog | Tutorial Blog | Belajar Blog