Cara Membuat Related Post Bergambar

Dengan adanya Related Post pada sebuah website atau blog akan sangat membantu pengunjung situs anda untuk membaca sebuah artikel yang terkait dengan postingan anda. Berikut adalah langkah-langkah dalam membuat Related Post Bergambar :

1. Masuk Akun Blogger anda.

2. Pilih Template.

3. Backup terlebih dahulu Template anda sebelum dimodifikasi.

4. Lalu pilih Edit HTML.

5. Centang tulisan Expand Template Widget (untuk menampilkan kode html secara keseluruhan).

6. Cari kode </head> dengan cara menekan tombol keyboard Ctrl + F.

7. Copas kode dibawah ini persis diatas kode </head>.

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

<style type='text/css'>

#related-posts {

float:center;

text-transform:none;

height:100%;

min-height:100%;

padding-top:5px;padding-left:5px;}

#related-posts h2{

font-size: 1.2em;

font-weight: bold;

color: black;

font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;

margin-bottom: 0.75em;

margin-top: 0em;

padding-top: 0em;

}

#related-posts a{

color:black; }

#related-posts a:hover{

color:black;

}#related-posts a:hover {

background-color:#d4eaf2;}

</style>

<script src='http://kangdansen.googlecode.com/files/relatedpostwiththumbnail.js' type='text/javascript'/>

</b:if>

8. Sekali lagi cari kode <div class='post-footer-line post-footer-line-3'>.

9. Copas kode dibawah ini tepat dibawah kode tersebut.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><a href='http://www.depotsenigrafis.com/?Kanvas_Printing' style='display:none;'>Kanvas Printing</a><a href='http://depotsenigrafis.blogspot.com/2012/02/kanvas-printing.html' style='display:none;'>Kanvas Printing</a>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle=&quot;Artikel Terkait :&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>

10. Ganti tulisan "Artikel Terkait" yang berwarna merah dengan selera anda.

Selamat mencoba dan semoga artikel ini bisa bermanfaat buat rekan-rekan bloger nusantara dan salam Indonesia Raya!!!

Best regards,

Candrameda Al Ghozali

Depot Seni Grafis - Printing Media Online Indoor and Outdoor
Large Format Printing
Banner Specialist
Hotline Service : 031-70989554
marketing@depotsenigrafis.com
http://depotsenigrafis.com/

Cara Menguji Template Baru Tanpa Mempengaruhi Blog Utama Anda

Pada saat melihat sebuah desain template baru, kita pasti ingin sekali untuk melakukan pergantian template pada blog / website kita. Tapi hal ini sering kali menjadi sebuah kesalahan yang sering merugikan kita sendiri apalagi kita tidak mempunyai file backup data pada blog kita. Dan hal ini sering mempengaruhi kinerja dari situs kita. Jadi dalam artikel kali ini saya coba berbagi sedikit pengalaman bagaimana untuk menguji template baru dengan semua data dari blog utama anda, tetapi tidak mempengaruhi kinerja dari blog utama.

Langkah Pertama - Buat blog baru untuk melakukan pengujian.

Langkah Kedua - Backup semua data dari blog utama anda dengan cara : pergi ke dashboard blogger dari blog utama anda -->setting -->template -->lalu pilih tombol cadangkan / pulihkan di sisi kanan layar monitor anda. fungsi ini akan membackup semua data dari blog anda termasuk postingan dan komentar dalam format XML.

Langkah Ketiga - Import data ke blog yang baru dengan cara sama seperti langkah kedua pilih file data (format xml) yang anda expor sebelumnya kemudian tunggu sampai seluruh proses selesai.

Langkah Keempat - Setelah itu, semua data dari blog utama anda telah diimpor untuk melakukan pengujian blog. Sekarang anda dapat melakukan pengujian blog anda dengan semua pengaturan pos, widget, script, dan fungsi template baru anda. Setelah selesai melakukan editing, anda bisa menggunakan template dari hasil editing ke blog utama anda. Dan yang paling penting disini adalah selalu membackup data blog anda sebelum melakukan perubahan.

Best regards,

Candrameda Al Ghozali

Depot Seni Grafis - Printing Media Online Indoor and Outdoor
Large Format Printing
Banner Specialist
Hotline Service : 031-70989554
marketing@depotsenigrafis.com
http://depotsenigrafis.com/

Cara Membuat Tombol Sosial Melayang

Slick Social Buttons Share merupakan Plugin Wordpress yang ditambahkan untuk blog anda dengan tampilan melayang. Kode script dari plugin tesebut telah dirubah oleh beberapa blog dan diantaranya adalah stylifyyourblog.com agar dengan mudah diintegrasikan dengan blogger. Seperti halnya Widget Social lainnya, anda dapat juga menambahkan berbagai jenis tombol sosial lainnya. Fitur ini sangat menyenangkan karena mempunyai fitur geser yang menunjukkan tombol-tombol ini hanya bila pengguna ingin menggunakan dan menyembunyikan tombol ketika tidak diperlukan. Disini saya akan membahasnya secara umum yang sering digunakan.

Berikut adalah langkah-langkah cara membuatnya :

• Login ke akun Blogger Anda.
• Pergi ke Desain> Elemen Halaman. (Untuk Antarmuka New Blogger Ke Layouts)
• Klik Tambah Gadget.
• Dalam sebuah jendela Gadget, pilih HTML / Javascript.
• Copy kode berikut dan paste di dalam kotak konten.

<style>
#nav-dcssb, #nav-dcssb li {
margin: 0;
padding: 0;
list-style: none;
}
#nav-dcssb {
}
#nav-dcssb li {
padding: 5px;
}
#nav-dcssb li.size-box {
text-align: center;
height: 60px;
}
#nav-dcssb li.size-small {
height: 30px;
}
/* Floater */
.dc-social-float .tab {
cursor: pointer;
height: 44px;
margin-left: -1px;
}
.dc-social-float .dc-social-float-content {
background: #fff;
border: 1px solid #bbb;
padding: 10px;
}
.dc-social-float .dc-social-float-content {
border-radius: 10px; -webkit-border-radius: 10px;
}

/* Slick */
.dc-social-slick .dc-social-slick-content {
padding: 10px;
background: #fff;
border: 1px solid #ccc;
}
.dc-social-slick.vertical .dc-social-slick-content {
width: 78px;
}
.dc-social-slick.horizontal.left #nav-dcssb li.size-small, .dc-social-slick.horizontal.right #nav-dcssb

li.size-small {
height: 60px;
}

.dc-social-slick.top  {
top: 0;
}
.dc-social-slick.bottom  {
bottom: 0;
}
.dc-social-slick.right  {
right: 0;
}
.dc-social-slick.left {
left: 0;
}
.dc-social-slick.right, .dc-social-slick.left {
padding-top: 2px;
background: url(images/bg_slick_top.png) repeat-x 0 0;
}

.dc-social-slick.right .dc-social-slick-content {
border-top: none;
border-right: none;
border-radius: 0 0 0 10px; -webkit-border-radius: 0 0 0 10px;
padding: 10px 10px 20px 10px;
}
.dc-social-slick.left .dc-social-slick-content {
border-top: none;
border-left: none;
border-radius: 0 0 10px 0; -webkit-border-radius: 0 0 10px 0;
padding: 10px 10px 20px 10px;
}
.dc-social-slick.left.horizontal .dc-social-slick-content, .dc-social-slick.right.horizontal .dc-social-

slick-content {
border-radius: 0; -webkit-border-radius: 0;
padding: 10px 10px 18px 10px;
}
.dc-social-slick.top.vertical .dc-social-slick-content, .dc-social-slick.bottom.vertical .dc-social-

slick-content {
border-top: none;
border-bottom: none;
}

.dc-social-slick .tab {
cursor: pointer;
}
.dc-social-slick.top .tab, .dc-social-slick.bottom .tab {
height: 46px;
}
.dc-social-slick.left .tab, .dc-social-slick.right .tab {
width: 46px;
}

.dc-social-slick.bottom .tab {
top: 1px;
}
.dc-social-slick.top .tab {
bottom: 1px;
}
.dc-social-slick.align-left .tab {
margin-left: -1px;
}
.dc-social-slick.align-right .tab {
margin-right: -1px;
}

.dc-social-slick.bottom.align-right.horizontal .dc-social-slick-content {
border-radius: 10px 0 0 0;
-webkit-border-radius: 10px 0 0 0;
}
.dc-social-slick.bottom.align-left.horizontal .dc-social-slick-content {
border-radius: 0 10px 0 0;
-webkit-border-radius: 0 10px 0 0;
}

.dc-social-slick.top.align-right.horizontal .dc-social-slick-content {
border-radius: 0 0 0 10px;
-webkit-border-radius: 0 0 0 10px;
}
.dc-social-slick.top.align-left.horizontal .dc-social-slick-content {
border-radius: 0 0 10px 0;
-webkit-border-radius: 0 0 10px 0;
}

.dc-social-slick.right .tab, .dc-social-slick.left .tab {
margin-top: -2px;
}
.dc-social-slick.right .tab {
left: 1px;
}
.dc-social-slick.left .tab  {
right: 1px;
}

.dc-social-slick.horizontal #nav-dcssb li {
float: left;
}
.clear {clear: both;}
</style>
<script type="text/javascript" src="

https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script type='text/javascript'

src='http://stylifyyourblog1.googlecode.com/svn/trunk/easingplusslickfloat.js'></script>


<div id="dc-dcssb">
<ul id="nav-dcssb" >
<li id="dcssb-twitter" class="size-box"><script src="http://tweetmeme.com/i/scripts/button.js"

type='text/javascript'></script>
</li>
<li id="dcssb-facebook" class="size-box"><a name="fb_share" type="box_count"

href="http://www.facebook.com/sharer.php">Share</a><script

src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</li>
<li id="dcssb-plusone" class="size-box"><script type="text/javascript"

src="https://apis.google.com/js/plusone.js"></script>
<g:plusone size="tall"></g:plusone>
</li>
<li id="dcssb-linkedin" class="size-box"><script src="http://platform.linkedin.com/in.js"

type="text/javascript"></script>
<script type="IN/Share" data-counter="top"></script></li>
<li id="dcssb-stumble" class="size-box">
<script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>
</li>
<li id="dcssb-digg" class="size-box">
<script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script>
<a class="DiggThisButton DiggMedium"></a>
</li>
</ul>
</div>
<script type="text/javascript">
jQuery(window).load(function() {
jQuery('#dc-dcssb').dcSocialFloater({
idWrapper : 'dcssb-float',
width: '98',
location: 'bottom',
align: 'left',
offsetLocation: 50,
offsetAlign: 50,
center: false,
centerPx: 0,
speedContent: 600,
speedFloat: 1000,
tabText: '<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4hpIzyhVeEzJ_h81Qp79AAi9RrNwlu_jZ0D2r6vFt15mdqS0oBJ0v3gq207_DdPWJxuYQ3l0ju_Aff-u4I0zVTHTzLySD-TqMWHg_ZwOXbggKHSKQkbZdEjzja16Keg8kkjb0OEOvxTQ/s1600/tab_bottom_floating.png" alt="Share" />',
autoClose: false,
loadOpen: false,
tabClose: true,
classOpen: 'dcssb-open',
classClose: 'dcssb-close',
classToggle: 'dcssb-link'
});
});
</script>

 

• Simpan gadget anda.

Untuk penyesuaiannya :

1. Alignment & Kecepatan
Untuk mengubah posisi widget, cek warna biru dengan setiap atribut memiliki arti yang biasa. Untuk mengubah atribut kecepatan yaitu pada speedContent dan speedFloat (satuan waktu adalah mikrodetik).

2. Tertutup atau Terbuka
Widget ini memiliki pilihan apakah anda ingin tombol-tombol ini akan terlihat ketika tombol ini diklik atau membiarkannya tetap dalam keadaan terbuka. Untuk perubahan ini pilihan pencariannya terdapat pada atribut "loadOpen" dalam kode berwarna merah.

3. Menambah / Menghapus Tombol
Tombol dapat ditambahkan atau dihapus dengan mudah. Untuk menghapus tombol hapus kode di antara tag-li. Sedangkan untuk menambahkan tombol cukup tambahkan tag-li dengan sesuatu kelas atribut seperti kode berikut :

<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"><li class="size-box">
 
----The Button Code----
 
</li></span>

Demikianlah artikel tentang Cara Membuat Tombol Sosial Melayang yang saya buat ditengah-tengah kesibukan saya dalam menjalani aktivitas sehari-hari di dunia advertising dan semoga bermanfaat buat rekan-rekan blogger lainnya.

Best regards,

Candrameda Al Ghozali

Depot Seni Grafis - Digital Printing Indoor and Outdoor Service
Large Format Printing
Banner Specialist
Hp.: 0821 41 335123
candrameda@gmail.com
http://depotsenigrafis.blogspot.com/

Cara Membuat Social Icon Di Blog Anda

Dalam postingan kali ini saya coba berbagi bagaimana Cara Membuat Social Icon Di Blog Anda dengan tampilan sedikit agak berbeda. Tujuan dari ikon tersebut adalah agar pembaca blog anda mudah untuk mengikuti dan berlangganan artikel blog anda pada Platform Sosial. Di dalam ikon-ikon tersebut juga ada ikon Google + (plus). Disini saya hanya membagikan 4 ikon sosial seperti Facebook, Twitter, Google+ dan Rss Feed anda. Yang mana untuk kumpulan ikon lengkapnya anda bisa menemukan di website Social Icon Studio dengan jumlah 24 ikon termasuk Youtube, Linkedin, Stumble Upon dan lain sebagainya.

Contoh tampilan ikon tersebut tampak seperti gambar di bawah ini :

Berikut adalah langkah-langkah untuk pemasangan ikon di blog anda :

Langkah 1. Dalam desain Blogger Dashboard anda klik> Tambah Gadget> lalu pilih HTML/Javascript

Langkah 2. Salin dan sisipkan kode dibawah ini ke dalam gadget html tersebut.

==============================Kode HTML=========================================

<a href=" http://facebook.com/candrameda "imageanchor="1" style="margin-left: 1em; margin-right: 1em;"> <img border =" 0 " /> </ A> <a href=" http://twitter.com/candrameda "imageanchor="1" style="margin-left: 1em; margin-right: 1em;"> <img border =" 0 " /> </ A> <a href=" https://plus.google.com/103629717530711228132/ "imageanchor="1" style="margin-left: 1em; margin-right: 1em;"> <img border = "0" /> </ A> <a href=" http://feeds.feedburner.com/depotsenigrafis "imageanchor="1" style="margin-left: 1em; margin-right: 1em;"> <img border =" 0 "src =" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuE7glvfrTQnr49Ah89YYHLfyuqJD98_oUM0E3DveqAEqGRPz1iLvRC9U4Zm02-TqBipgZD0Mkd3uAvoNAZt3RZd3XacSFdtOultf4KsVg9cYC2Csvr4MwVW2UcRSrIO3kNRwol1pToPk/s1600/rss-30x43.png "/> </ a>

=================================================================================

Catatan - ganti link yang berwarna merah dengan link sosial dan link feed anda.

Langkah 3. Simpan gadget dan lihat hasilnya.

Berikanlah komentar pada kolom komentar pada postingan dibawah ini.

Best Regard's

Related Post Widget Buat Blogger

Pagi ini aku coba untuk sharing pengalaman tentang bagaimana cara membuat Related Post Widget buat Blogger dengan tampilan thumbnail dari postingan yang memiliki label yang sama atau katagori di bagian bawah setap halaman blog, sehingga membuat pembaca blog/website anda mempunyai banyak pilihan dari postingan anda.

Sejauh ini gadget yang terbaik menurut pengalaman saya yaitu dengan menggunakan linkwithin, karena beban widget ini relatif lebih ringan dan anda tidak perlu menginstal script, karena script widget tersimpan didalam server linkwithin.

Tutorial ini adalah tutorial yang paling rinci yang pernah saya tulis pada linkwithin. Ikuti langkah-langkah dibawah ini dengan hati-hati :

• Pergi ke situs Linkwithin
• Mengisi form yang telah disediakan. Gambar di bawah ini akan membantu anda dalam pengisian form dari linkwithin,

• Pilihlah 5 jika lebar halaman postingan anda sekitar 500px.
• Tekan tombol Widget dan kemudian klik link Instal Widget pada halaman berikutnya seperti yang ditunjukkan di bawah ini,

• Ubahlah title dengan kata Related Post atau apapun sesuai selera anda

• Sekarang klik link Edit Template

•  Ganti kode yang Anda lihat dengan yang satu ini:

 

<b:includable id='main'> <b:if cond='data:blog.pageType == "item"'> <data:content/> </ b: if> </ b: includable>

Kode di atas akan menyembunyikan thumbnail yang muncul pada homepage.

• Selanjutnya klik Link Edit Konten dan tambahkan kode tambahan berikut tepat di atas kode di dalam widget,

 

'Related Posts:' <script> linkwithin_text = </ script>

Ganti Related Posts: dengan teks yang Anda inginkan.

• Lalu tekan tombol ADD WIDGET
• Setelah itu Anda akan dibawa ke halaman Elemen Halaman dari account blogger Anda, cukup drag widget ke bagian bawah tubuh posting Anda seperti ditunjukkan di bawah ini,

• Klik tombol "Simpan" tombol oranye di sudut kanan atas dan Anda selesai!

Selamat mencoba Tips untuk Blogger kali ini.

Candrameda Al Ghozali

Tentang Penulis:
Candrameda Al Ghozali adalah seorang profesional muda di bidang advertising dan desainer grafis. Sejak awal tahun 2008 saya mendirikan sebuah usaha Digital Printing yang bernama Depot Seni Grafis - DSG yang berlokasi di daerah Sidoarjo - Jawa Timur. DSG juga mempunyai sebuah blog/website yang beralamatkan depotsenigrafis.blogspot.com

Cara Membuat Animated Favicon

Favicon yaitu ikon favorit juga dikenal sebagai ikon website atau ikon halaman. Favicon ini biasanya dikaitkan dengan situs Web tertentu atau sebuah halaman web. Favicon juga menunjukkan bahwa website tertentu atau halaman web. Seorang web designer dapat pula membuat ikon seperti yang ada di blog ini dengan favicon generator dan menggunakannya sebagai merek atau simbol yang menunjukkan situs web mereka.

Browser internet seperti mozilla sangat mendukung penggunaan animasi seperti ini dan menampilkannya ke dalam Browser URL Bar di samping nama situs dan daftar bookmark yaitu koleksi situs favorit menu di browser.

Berikut langkah-langkah pembuatan Animated Favicon :

• Tentukan gambar yang akan anda gunakan sebagai icon (format yang didukung : gif, jpg, jpeg, png).
• Masukkan teks ke dalam kotak Scrolling Text jika diperlukan.
• Hit tombol Generate Favicon.

• Download hasil Generate Favicon ke dalam hardisk komputer anda dengan cara klik kanan lalu pilih Save Image As.
• Upload file favicon anda ke Image Hosting pilihan anda. (disini saya menggunakan photobucket.com)
• Langkah selanjutnya adalah :

Go To Blogger > Design > Edit HTML
Cari kode <b:skin>

Copy Paste kode dibawah tepat diatas kode <b:skin>

<link href='ADD YOUR FAVICON LINK HERE' rel='icon' type='image/gif'/>

Ganti tulisan ADD YOUR FAVICON LINK HERE dengan link URL image anda

Hasilnya terlihat seperti dibawah ini :

<link href='http://i1084.photobucket.com/albums/j403/candrameda/MyAnimatedFavicon.gif

' rel='icon' type='image/gif'/>

Simpan template anda dan lihat hasilnya***

Cara Membuat Sticky Bar Di Blogspot

Anda dapat menambahkan Sticky Bar di blog blogger untuk menampilkan panel di bagian atas header atau tepat di bawah footer. Sebuah Sticky Bar sekarang dapat digunakan secara luas oleh semua blog dan situs untuk memberitahukan kepada pengunjung tentang update terakhir postingan anda atau penawaran sekalipun. Anda juga dapat menambahkan link RSS Feed situs anda kepada pengunjung blog anda untuk berlangganan update terbaru dari blog anda.

Dalam tutorial kali ini saya akan mencoba untuk membuat hal-hal sederhana dan akan berbagi cara untuk membuat semacam Sticky Bar Widget dengan text sederhana dan gambar. Disini saya coba memakai Efek Drop Shadow dengan menggunakan CSS3. Widget ini sangat kompatibel dengan semua browser baik itu Mozilla atau Google Chrome. Untuk contoh Sticky Bar-nya anda bisa lihat di bagian atas blog ini.

Berikut langkah-langkah yang harus anda lakukan untuk membuat Sticky Bar :

1. Masuk ke Blogger --> Template --> Edit HTML
2. Backup dulu Template anda
3. Centang kotak Expand Widget Template
4. Cari kode berikut (tekan ctrl + f untuk pencarian lebih cepat)

]]></b:skin>

5. Copy paste-kan kode dibawah ini persis diatas kode ]]></b:skin>

    #mbt-stickybar{

    background:#000000 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2YrzWVYFUPM48H9OCw5DYgVRL6syohvFBKe1DuHOkD1noWAKYrEyhDPR-yeH5n8KiuBI0icbTgp-6NHMipvj0c2crZUwmM-2SKbhy8lbdJfWaaMXhVhjCbGeq9tiLmm7W3v2MzpoCY5s/s400/stickybar.png') repeat-x;

    width:100%;

    margin:0 auto;

    text-align:center;

    padding:0px 0;

    border-bottom: 1px solid #888888;

      -moz-box-shadow: #666666 0px 1px 3px;

      -webkit-box-shadow: #666666 0px 1px 3px;

      box-shadow: #666666 0px 1px 3px;

      z-index: 999;

    height: 28px; position:fixed;

    line-height: 1.85em;

    vertical-align: baseline;

    letter-spacing: 1px;

    }

    #mbt-stickybar a{

    text-decoration:none;

    color:#fff;

    font-size:13px;

    font-weight:bold;

    font-family: arial,"Helvetica",sans-serif;

    line-height: 24px;

    }

    #mbt-stickybar a:hover{

    text-decoration:underline;

    }

    #mbt-stickybar p {margin:0; list-style:none;}

    #mbt-stickybar img {vertical-align: middle;

          margin-right: 6px;}

Anda bisa mengganti warna background #000000 dengan warna pilihan anda (saya memakai program Photoshop untuk meng-generate kode warna)

6. Selanjutnya cari kode ini

<body>

7. Copy Paste-kan kode dibawah ini dibawah kode <body>

<div id='mbt-stickybar'>

<a href='#'>ADD TEXT HERE</a>

</div>

Catatan : sekarang ganti # dengan text link anda dan tulisan ADD TEXT HERE ganti dengan deskripsi dari link anda

8. Simpan Template anda dan lihat hasilnya.

Selamat mencoba dan semoga bermanfaat buat blog anda***

Cara Ping Sitemap Ke Search Engine

Salah satu upaya yang dapat dilakukan untuk memberitahu search engine bahwa kita telah mengupdate tulisan atau blog adalah dengan melakukan ping sitemap ke search engine tersebut. Dan untuk blogger sendiri kita harus melakukannya secara manual, hal ini berbeda dengan wordpress yang segalanya bisa dilakukan secara otomatis. Terlepas dari itu cara manual ini cukup efektif jika kita ingin tulisan yang baru dipublikasikan bisa langsung cepat terindeks oleh search engine.

Berikut adalah alamat ping sitemap masing - masing search engine dan cara penggunanaanya sangat mudah yaitu cukup copy pastekan alamat dibawah ini ke address bar browser dan ganti kode yang berwarna merah dengan alamat blog sobat.

Google

http://www.google.com/webmasters/sitemaps/ping?sitemap=http://blog-kamu.blogspot.com/atom.xml

Yahoo

http://search.yahooapis.com/SiteExplorerService/V1/ping?sitemap=http://blog-kamu.blogspot.com/atom.xml

Bing

http://www.bing.com/webmaster/ping.aspx?siteMap=http://blog-kamu.blogspot.com/atom.xml

Ask

http://submissions.ask.com/ping?sitemap=http://blog-kamu.blogspot.com/atom.xml



Catatan : Ganti kode warna merah dengan alamat blog sobat.

Antarmuka Baru Dari Blogger

Anda mungkin sudah pernah mendengar, bahwa dari sekian banyak produk Google yaitu Blogger terlihat sedikit berbeda dari sebelumnya, kini Blogger telah di makeover oleh Google dengan tampilan background nuansa putih sebagai ciri khas dari Google itu sendiri.

Dalam beberapa tahun terakhir Google telah membuat perubahan besar untuk penampilan Blogger dan ada lebih banyak perubahan dari segi grafisnya. Tampilan baru ini dibuat agar lebih cepat dan lebih efisien untuk anda dan juga lebih mudah bagi kita untuk mengupdate sebuah postingan.

Sepanjang proses desain, Google telah mewawancarai beberapa pengguna Blogger untuk membantu mengidentifikasi bagaimana Blogger lebih mudah dan lebih menyenangkan untuk digunakan. Google juga melihat pengguna Blogger untuk menguji antarmuka barunya dan membuat banyak perbaikan berdasarkan umpan balik mereka.

Sebuah Pengalaman Efisien Blogging

Apakah anda berada di halaman Dashboard atau Pengaturan dari Blogger.com. anda dapat membuat atau mengedit posting dengan satu klik sederhana pada bagian atas layar. Selain itu, editor posisi telah diperluas dan disederhanakan untuk memberikan kanvas yang lebih besar untuk menulis dan melihat pratinjau pekerjaan anda.

Selamat mencoba Antarmuka Baru dari Blogger, dan gunakan kesempatan ini untuk lebih kreatif dalam aktifitas blogging anda***

Anatomi Dari RSS Feed

Anatomi Dari RSS Feed

RSS adalah format yang telah menjadi standar untuk sindikasi data informasi. Hal ini memungkinkan pengembang untuk membangun struktur file untuk membuat program baca atau menganalisis data dalam format yang mudah dibaca.

RSS telah menjadi standar data format untuk mengkomunikasikan sebuah berita, update, atau jenis lain dari sebuah informasi bahwa sebuah perusahaan ataupun individu yang ingin memberitahukan kepada seluruh audiens yang lebih besar. RSS sendiri adalah singkatan dari Really Simple Syndication, merupakan format XML yang terdiri dari unsur-unsur yang ditunjuk secara konsisten untuk semua RSS feed dan sesuai dengan spesifikasi XML 1.0. Elemen-elemen ini haruslah konsisten untuk sebuah Format Data Standar agar dapat digunakan sebagai agregator RSS.

Sebuah RSS Feed selalu dimulai dengan <RSS>, yang berisi sebuah atribut yang disebut versi, yang menentukan versi dari RSS feed. Di sini kita fokus pada format RSS 2.0 karena saat ini paling sering banyak digunakan.

<rss version="2.0">
</rss>

Anak dari <RSS> elemen adalah <channel>. Elemen ini adalah elemen yang berisi data penting atau konten dalam feed.

<rss version="2.0">
  <channel>
  </channel>
</rss>

Untuk menggambarkan RSS feed ada beberapa tag yang dapat ditambahkan pada awalnya. Yang dibutuhkan <channel> elements are <title>, <link> and <description>. Optional channel elements are <language>, <copyright>, <managingEditor>, <webmaster>, <pubDate>, <lastBuildDate>, <category>, <generator>, <docs>, <cloud>, <ttl>, <image>, <rating>, <textInput>, <skipHours> and <skipDays>.

<rss version="2.0">
<channel>
<item>
<guid isPermaLink="false">
http://www.blogger.com/feeds/12931054/posts/full/115714541264251287
</guid>
<pubDate>Fri, 01 Sep 2006 21:08:00 +0000</pubDate>
<title>Secure Ajax Requests</title>
<description>
<div xmlns="http://www.w3.org/1999/xhtml">My latest article for InformIT, titled <a href="http://www.informit.com">How to Secure Ajax Requests</a> is on the homepage this week. This article focuses on ensuring that your database-enabled Ajax requests are secure and not leaving your database open for an attack. Enjoy...</div>
</description>
<link>
http://www.krishadlock.com/blog/2006/09/secure-ajax-requests.html
</link>
<author>Kris Hadlock</author>
</item>
</channel>
</rss>

Ini adalah struktur standar untuk weblog, dan terdiri dari unsur-unsur yang digunakan. Untuk melihat struktur ini dapat dilihat secara abstrak, mengapa dapat berisi semua jenis informasi. Meskipun struktur yang abstrak dapat memberitahu dengan melihat feed dalam data sederhana. Setiap elemen dapat berisi subelements berikut adalah penjelasan secara rinci:

• guid - The GUID merupakan elemen yang berisi string yang secara unik mengidentifikasi item.
• pubDate - pubDate adalah tanggal item diterbitkan.
• Judul: Judul adalah judul yang ditetapkan untuk produk, dalam hal ini adalah judul dari entri weblog.
• Description: Berisi data dari unsur utama, unsur ini digunakan untuk body posting weblog
• link: URL berisi satu halaman penuh dalam individu ada item tertentu secara rinci.
• penulis - adalah penulis konten yang disajikan dalam artikel.
• Kategori: memungkinkan elemen yang akan dimasukkan dalam kategori satu atau lebih.
• Komentar - URL halaman yang berisi komentar yang berhubungan dengan item.
• kabinet: dapat digunakan untuk menggambarkan objek media jika kita attach pada item.
• source – sumber dari RSS itu sendiri.

Auto Read More

Di dalam sebuah website/blog kita sering menjumpai sebuah tulisan kecil yang bernama READ MORE, tujuannya adalah untuk memenggal isi dari keseluruhan artikel tersebut agar halaman utama dari website/blog kita tidak terlalu memanjang ke bawah. Hal ini juga di tujukan agar loading dari website kita lebih ringan.

Di sini saya akan paparkan satu per satu bagaimana cara membuat Auto Read More tersebut :

================langkah 1=======================

- Baca Basmalah

- Backup Template Anda

- Centang Expand Template Widget

================langkah 2=======================

Tekan "ctrl + F" untuk memudahkan pencarian

cari kode berikut :

</head>

copy keseluruhan kode di bawah ini diatas kode </head>

<script type='text/javascript'>

var thumbnail_mode = &quot;float&quot; ;

summary_noimg = 230;

summary_img = 140;

img_thumb_height = 100;

img_thumb_width = 100;

</script>

<script src='http://blogergadgets.googlecode.com/files/excerpt.js' type='text/javascript'/>

================langkah 3==================

cari kode berikut :

<data:post.body/>

lalu ganti dengan kode di bawah ini :

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

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

<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>

   <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> READ MORE</a></span>

</b:if>

</b:if>

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

<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>

==================langkah 4======================

1. Kata READ MORE bisa anda ganti sesuai dengan keinginan anda

2. Jangan lupa tinggalkan komentar anda.


Best Regards

Candrameda Al Ghozali