Tampilkan postingan dengan label Tag - Label. Tampilkan semua postingan
Tampilkan postingan dengan label Tag - Label. Tampilkan semua postingan

Membuat Label Blog Sebagai Link RSS Feed Untuk Tiap Kategori

Unknown | 10.54 | 0 comments
Jika anda memiliki banyak konten yang berbeda berdasarkan kategori maka sebaiknya anda menggunakan trik berikut ini agar pengunjung dengan mudah dapat mengsubscribe konten berdasarkan kategori yang mereka inginkan. Jadi pengunjung tidak perlu mensubscribe semua posting anda, hanya artikel tertentu berdasarkan kategori. Kali ini kita akan membuat tombol rss feed sebagai label untuk kategori pada blog anda. Untuk itu ikuti langkahnya dibawah ini:

1. Login ke blogger
2. Masuk ke Rancangan --> Edit HTML
3. Centang Expand Template Widget
4. Carilah kode seperti berikut ini:
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
5. Lalu ganti kode diatas dengan kode berikut ini:
<b:loop values='data:labels' var='label'>
<li>
<a expr:href='data:blog.homepageUrl + "feeds/posts/default/-/" + data:label.name'>
<img alt='Subscribe' src='http://www.feedburner.com/fb/images/pub/feed-icon16x16.png' style='vertical-align:middle;border:0' />
</a>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
6. Simpan template anda

Lalu sobat coba lihat label widget anda. Anda akan mendapat label dengan link rss subscribe. Jika sobat ingin mengganti gambar subscibe diatas cukup mengubah kode berwarna biru dengan url gambar yang anda inginkan.

Efek Link Nudging Pada Label Blog

Unknown | 14.41 | 0 comments
Trik dan Tips kali ini yaitu kita akan membuat Link Nudging dengan menggunakan Jquery dan Javascipt. Efek link nudging ini membuat link bergoyang dengan halus ketika mouse diarahkan diatas link tersebut. Efek ini akan menambah keindahan dari blog anda. Link nudging kali ini kita akan terapkan pada label atau kategori blog. Jika anda tertarik untuk membuatnya ikuti langkahnya dibawah ini:

1. Masuk ke Rancangan--> Edit HTML
2. Cari kode </head>
3. Letakkan script dibawah ini diatas kode </head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>
Keterangan: Kode Jquery diatas sudah umum digunakan, jadi jika template anda sudah ada kode tersebut tidak usah memasukan kode jquery diatas.

4. Tambahkan kode dibawah ini dan letakan dibawah kode jquery tadi:
<script type='text/javascript'>
$(document).ready(function() {
$(&#39;#Label1 li&#39;).hover(function() { //mouse in
$(this).animate({ marginLeft: &#39;12px&#39; }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});
</script>
5. Simpan template anda lalu liat hasilnya.

Jika anda ingin melihat link nudging bekerja pada label maka anda harus menambahkan widget (gadjet) label pada blog. Pilih Label dengan tampilan "Daftar". Selamat mencobanya!!

Cara Membuat Sexy Bookmark di Blog

Unknown | 09.49 | 0 comments
Bookmark kini sekarang menjadi suatu trend untuk mempromosikan blog dan meningkatkan SEO. Tidak dipungkiri lagi jika banyak blog yang menempatkan sosial bookmark seperti facebook, twitter, digg dan lain sebagainya. Bookmark ternyata bisa ditampilkan lebih sexy....tapi seperti apa ya? Seperti gambar dibawah ini bookmark yang akan kita buat. Dari pada banyak omong mending langsung kita praktekin saja.

1. Login ke blogger
2. Masuk ke Rancangan -- Edit HTML
3. Centang Expand widget template (jangan lupa untuk backup template blog anda)
4. Carilah kode ini: ]]></b:skin>
5. Kopi kode dibawah ini dan letakan kodenya diatas kode ]]></b:skin>

div.sexy-bookmarks { height:54px; background:url(http://img709.imageshack.us/img709/57/sharing.png) no-repeat left bottom;position:relative; width:540px }

div.sexy-bookmarks span.sexy-rightside { width:17px; height:54px; background:url(http://img709.imageshack.us/img709/57/sharing.png) no-repeat right bottom; position:absolute; right:-17px }

div.sexy-bookmarks ul.socials { margin:0 !important;padding:0 !important; position:absolute; bottom:0;left:10px }

div.sexy-bookmarks ul.socials li { display:inline-block !important; float:left !important; list-style-type:none !important; margin:0 !important; height:29px !important; width:48px !important; cursor:pointer !important; padding:0 !important }

div.sexy-bookmarks ul.socials a { display:block !important; width:48px !important; height:29px !important;f ont-size:0 !important; color:transparent !important}

.sexy-furl, .sexy-furl:hover, .sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumble, .sexy-stumble:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoo, .sexy-yahoo:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-script-style, .sexy-script-style:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-syndicate, .sexy-syndicate:hover, .sexy-email, .sexy-email:hover { background:url(http://img406.imageshack.us/img406/9198/sexyy.png) no-repeat !important }

.sexy-furl { background-position:-300px top !important }
.sexy-furl:hover { background-position:-300px bottom !important }
.sexy-digg { background-position:-500px top !important }
.sexy-digg:hover { background-position:-500px bottom !important }
.sexy-reddit { background-position:-100px top !important }
.sexy-reddit:hover { background-position:-100px bottom !important }
.sexy-stumble { background-position:-50px top !important }
.sexy-stumble:hover { background-position:-50px bottom !important }
.sexy-delicious { background-position:left top !important }
.sexy-delicious:hover { background-position:left bottom !important }
.sexy-yahoo { background-position:-650px top !important }
.sexy-yahoo:hover { background-position:-650px bottom !important }
.sexy-blinklist { background-position:-600px top !important }
.sexy-blinklist:hover { background-position:-600px bottom !important }
.sexy-technorati { background-position:-700px top !important }
.sexy-technorati:hover { background-position:-700px bottom !important }
.sexy-myspace { background-position:-200px top !important }
.sexy-myspace:hover { background-position:-200px bottom !important }
.sexy-twitter { background-position:-350px top !important }
.sexy-twitter:hover { background-position:-350px bottom !important }
.sexy-facebook { background-position:-450px top !important }
.sexy-facebook:hover { background-position:-450px bottom !important }
.sexy-mixx { background-position:-250px top !important }
.sexy-mixx:hover { background-position:-250px bottom !important }
.sexy-script-style { background-position:-400px top !important }
.sexy-script-style:hover { background-position:-400px bottom !important }
.sexy-designfloat { background-position:-550px top !important }
.sexy-designfloat:hover { background-position:-550px bottom !important }
.sexy-syndicate { background-position:-150px top !important }
.sexy-syndicate:hover { background-position:-150px bottom !important }
.sexy-email { background-position:-753px top !important }
.sexy-email:hover { background-position:-753px bottom !important }

6. Paste kode ini dibawah kode
<data:post.body/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='sexy-bookmarks'>

<ul class='socials'>

<li class='sexy-delicious'><a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-digg'><a expr:href='&quot; http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-technorati'><a expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-reddit'><a expr:href='&quot; http://www.reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-stumble'><a expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-designfloat'><a expr:href='&quot;http://www.designfloat.com/submit.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-facebook'><a expr:href='&quot; http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-twitter'><a expr:href='&quot; http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-furl'><a expr:href='&quot; http://www.furl.net/storeIt.jsp?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-email'><a expr:href='&quot; mailto:?subject=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-syndicate'><a href='http://feeds.feedburner.com/blogtrikdantips' title='Subscribe to RSS'/></li>

</ul>

<span class='sexy-rightside'/></div>
</b:if>

Keterangan:
- Ganti id feedburner (kode berwarna biru) dengan id feedburner milik sobat

7. Simpan template anda dan lihat hasilnya.

Cara Menampilkan Hanya Judul Posting pada Label

Unknown | 00.04 | 0 comments
Ketika menklik sebuah label pada blog akan muncul beberapa judul posting dan summary (rincian singkat). Hal tersebut tentunya akan memakan waktu loading yang lama pada blog anda apabila disertai dengan gambar. Sebelumnya saya udah pernah menjelaskan bagaimana membatasi jumlah tampilan label. Tapi kali ini ada sebuah tips baru dimana anda dapat menampilkan hanya judul posting pada label.

Ikuti saja langkah dibawah ini untuk membuatnya!
1. Login ke blogger.
2. Pilih Rancangan dan klik Edit HTML
3. Centang Expand Template Widget
4. Cari kode dibawah ini:
<!-- posts -->
<div class='blog-posts hfeed'>
<b:include data='top' name='status-message'/>
<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:include data='post' name='post'/>
6. Ganti kode yang berwarna biru dengan kode berikut ini:
<b:if cond='data:blog.homepageUrl !=
data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<data:post.title/></a><br/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
7. Simpanlah template anda dan lihat hasilnya!!!

Cara Membatasi Jumlah Posting pada Label

Unknown | 09.17 | 0 comments
Label atau kategori merupakan salah satu elemen yang sangat penting dalam blog anda. Ketika sobat mengklik sebuah label yang ada pada blog maka akan muncul semua posting yang menerapkan label yang sama. Hal ini membuat tampilan blog anda menjadi kurang menarik disamping membuat loading menjadi lambat. Untuk itu ada trik yang mudah untuk membatasi jumlah posting pada setiap label sesuai dengan pengaturan yang kita inginkan. Nah ini dia nich caranya:

1. Login ke blogger
2. Masuk ke Rancangan --Edit HTML
3. Centang Expand template Widget
4. Cari kode <a expr:href='data:label.url' rel='tag'> (Use Ctrl+F untuk mencari lebih mudah)
5. Sisipan kode ini: + "?max-results=10" sehingga nantinya terlihat seperti dibawah ini:
<a expr:href='data:label.url + &quot;?max-results=10&quot;' rel='tag'>
Keterangan: Angka 10 menunjukan jumlah posting yang ditampilkan pada label halaman

6. Simpan template sobat

Menghapus Jumlah Posting pada Label Blog

Unknown | 10.21 | 0 comments
Anda ingin menghapus jumlah posting pada label blog...caranya mudah sekali. Setiap label memiliki jumlah postingnya masing-masing label. Jumlah posting yang ditampilkan pada label memakai space atau ruang dari blog anda sehingga dapat menggangu tampilan blog sobat.

Berikut ini adalah langkah untuk menghapus jumlah posting pada label:

1. Log in ke blog anda
2. Pilih Rancangan -- Elemen Laman
3. Masuk ke Edit HTML
4. Jangan lupa beri tanda centang pada Expand Template Widget
5. Cari kode ini <data:label.count>

**untuk memudahkan pencarian anda dapat menggunakan CTRL + F, kemudian paste kode tersebut maka secara otomatis kode akan dicari dan di highlight...

6. Selanjutnya hapus kode dari template
7. Simpan template tersebut dan lihat hasilnya

Selamat mencoba!!!

Cara Membuat, Menghapus, dan Mengedit Label di Blog

Unknown | 09.34 | 0 comments
Ketika sobat memposting sebuah artikel sebaiknya sobat melabel atau mengkategorikan posting tersebut sesuai dengan isi topik sehingga pengunjung akan lebih mudah mencari artikel yang berkaitan berdasarkan label.

Tidak hanya itu saja label juga memiliki peran dalam meningkatkan page rank dan mengoptimasi search engine untuk mencari artikel di blog sobat. Untuk itu sobat sebaiknya memulai melabel posting. Berikut ini saya akan jelaskan cara membuat label, menghapus mengganti dan menulis label dari posting.

1. Membuat label
Pertama login dulu ke blogger. Pilih edit post. Beri tanda centang pada artikel yang ingin dilabel. Klik pada menu drop down kemudian pilih new label. Beri nama label yang sesuai dengan isi topik.

2. Menghapus label
Apabila sobat ingin menghapus label, sobat hanya perlu mencentang artikel yang ingin dihapus labelnya. Kemudian klik pada menu dropdown. Selanjutnya klik pada "Remove label" atau "hapus label"

3. Mengganti label
Apabila sobat ingin mengganti label maka yang sobat perlu lakukan yaitu klik pada daftar label di samping kiri maka akan muncul semua artikel dengan label yang sama. Centang artikel tersebut semuanya kemudian hapus label. Setelah itu centang lagi semua artikel dan berilah nama label yang baru.

4. Menulis artikel sambil memberi label
Ketika sobat telah selesai menulis dan sobat memiliki sejumlah label maka sobat dapat menunjukan label pada kotak posting bagian kanan bawah "tunjukan semua" klik link tersebut dan sejumlah label akan muncul. Klik pada link yang sobat ingin berikan label. Dan sobat pun dapat menerbitkan entri.

Selamat mencoba!!!

Memasang Tag Cloud Animasi

Unknown | 08.36 | 0 comments
Sudahkah sobat pernah melihat tag yang berbentuk seperti bola bumi dan bergerak seperti bumi. Tag ini pertama kali dibuat oleh Roy Tank disitusnya. Widget ini diberi nama Blogumulus. Namun kini istilah tersebut sudah jarang didengar karena lebih banyak orang yang menyebutnya cloud label animasi, label bola dunia dan lain-lain. Sebelumnya saya pernah menerangkan kepada sobat tentang cara memasangnya dengan mengedit template sobat.

Kali ini ada trik yang lebih mudah untuk membuat tag cloud animasi tersebut, dimana kita hanya menggunakan widget generator sehingga nampak sederhana untuk membuat. Jika ingin tau caranya ikuti langkah berikut ini:

1. Kunjungi blog berikut ini: KLIK DISINI
2. Selanjutnya klik Tombol Widget Generator
3. Isi formnya: Judul blog, url blog, lebar dan tinggi widget, warna background, text, kecepatan, dll
4. Klik Tombol Generate
5. Kemudian Klik tombol Add to Blogger
6. Lalu sobat Klik tombol Add Widget maka widget tersebut langsung terpasang pada blog sobat

Lihat demonya DISINI
Mudah saja kan cara membuatnya.....!! Selamaat mencobaaaaa......
 
Site Meter :
Copyright © 2011. Tutorial Windows 7 - All Rights Reserved
Proudly powered by Blogger
Thank You For Google