Showing posts with label S E O. Show all posts
Showing posts with label S E O. Show all posts

Friday, February 11, 2011

setting profil pada blogger sebagai media promosi blog

Mempublikasikan blog bukan sekedar blogwalking, follow blog lain dan kasih komentar pada blog / website lain tapi yang perlu adalah identitas yang kita tinggalkan pada media tersebut.

Pada beberapa kasus ada beberapa teman blogger yang mungkin lupa, disengaja atau tidak tahu banyak yang tidak melakukan setting yang komunikatif pada profil blogger mereka, sehingga waktu melakukan follow pada blog lain dan pada saat dilihat profil-nya tidak nampak identitas blog mereka, tentu ini akan sangat merugikan karena dengan kita menampilkan identitas blog kita akan bisa menambah traffick apabila ada yang melihat profil kita lewat follower widget.
untuk melakukan setting profil blogger ikuti cara2 berikut :
  1. Login blogger.com
  2. Masuk ke menu edit Profil
  3.  
  4. Lihat tampilan berikut ; masuk ke item "select blogs to display", ini adalah item untuk memilih blog mana yang akan kita tampilkan pada profil kita.
Simpan setting dan kembali ke dasboard ----->
lihat tampilan profil kamu untuk memastikan sudah sesuai dengan harapan.
Untuk setting yang lain disesuaikan dengan kebutuhan.
Met mencoba semoga sedikit tulisan ini bisa bermanfaat.

Tuesday, February 1, 2011

Menampilkan daftar isi pada label tertentu

Menampilkan daftar isi sebuah blog merupakan sebuah kebutuhan agar pembaca dapat memperoleh informasi apa yang kita sajikan dengan mudah, tapi dalam beberapa hal ini juga merupakan sebuah dilema karena dengan banyaknya artikel yang kita muat akan membuat loading saat membuka blog cukup lama sehingga bisa mengganggu kenyamanan pengunjung.
Ada beberapa cara untuk menampilkan isi blog diantaranya adalah :
  • Recent Post ( artikel terbaru )
  • Top Posting ( artikel populer )
  • Random Post ( artikel acak )
  • Membuat Daftar Isi
  • Related Post, etc
Sekarang kita akan mencoba membahas mengenai daftar isi dengan menampilkan hanya sebagian berdasar label posting.
untuk lebih jelasnya ikuti langkah berikut :
  1. Klik Page Element
  2. Klik Add Gadget
  3.   AddGadget
  4. Klik plus button (+) for HTML/JavaScript. (img)

    HTML
  5. Copy and paste kode dibawah ini

<script style="text/javascript">
var numposts = 500;
var standardstyling = true;
</script>

<script type='text/javascript' src='http://hdesign-code.googlecode.com/files/label-post.js'></script>

<h3>Arsitektur</h3>
<ul>
<script src="http://kibagus-homedesign.blogspot.com/feeds/posts/default/-/Arsitektur?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=100"></script>
</ul>
<br />

<h3>Rumah Adat</h3>
<ul>
<script src="http://kibagus-homedesign.blogspot.com/feeds/posts/default/-/Rumah%20adat?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=100"></script>
</ul>


Keterangan :
  • <h3>Arsitektur</h3> = judul label posting yang dimaksud ( sesuai dengan label artikel yang ingin ditampilkan )
  •  http://kibagus-homedesign.blogspot.com/feeds/posts/default/-/Arsitektur = alamat URL dan label artikel yang dimaksud ( ganti dengan alamat blog dan nama label = warna hijau )
  • Untuk menampilkan lebih dari 3 label tinggal tambahkan kode pada bagian bawah, sesuai dengan kebutuhan.
Tips :
  • Penggunaan daftar isi jenis ini harus di ikuti dengan pengaturan jenis label yang kita gunakan jangan sampai kita menggunakan label sebuah artikel dengan lebih dari 1 label karena pada tampilan daftar isi akan muncul judul artikel yang sama pada label yang berbeda.
  • Tampilkan hanya beberapa jenis label yang utama.

Monday, January 31, 2011

Membuat widgets daftar isi otomatis versi 2

 

Membuat daftar isi blog merupakan hal yang bisa kita lakukan untuk menampilan isi posting dalam blog secara lengkap dan juga bisa memudahkan pembaca untuk mengakses isi blog yang ada.

Sekarang kita akan mencoba membuat daftar isi yang menampilkan isi posting secara keseluruhan yang terbagi dalam label posting secara otomatis dalam bentuk yang berbeda. ini merupakan alternatif membuat daftar isi disamping posting membuat daftar isi otomatis dan Menampilan seluruh posting dalam satu widgets daftar isi otomatis yang dibahas beberapa waktu yang lalu.
Langkah Pertama
  1. Klik Page Element
  2. Klik Add Gadget / pada posting / halaman statik
  3.   AddGadget
  4. Klik plus button (+) for HTML/JavaScript. (img)

    HTML
  5. Copy and paste kode dibawah ini

<style scoped="scoped" type="text/css">
/* Skin for Blogger Tabbed Layout TOC */
#tabbed-toc{margin:0 auto;background-color:#224C19;-webkit-box-shadow:0 1px 3px rgba(0,0,0,.4);-moz-box-shadow:0 1px 3px rgba(0,0,0,.4);box-shadow:0 1px 3px rgba(0,0,0,.4);overflow:hidden;position:relative;color:#333}
#tabbed-toc .loading{display:block;padding:5px 10px;font:normal bold 10px/normal Helmet,Freesans,Sans-Serif;color:white}
#tabbed-toc ul,#tabbed-toc ol,#tabbed-toc li{margin:0 0;padding:0 0;list-style:none}
#tabbed-toc .toc-tabs{width:20%;float:left}
#tabbed-toc .toc-tabs li a{display:block;font:normal bold 10px/28px Helmet,Freesans,Sans-Serif;height:28px;overflow:hidden;text-overflow:ellipsis;color:#ccc;text-transform:uppercase;text-decoration:none;padding:0 12px;cursor:pointer}
#tabbed-toc .toc-tabs li a:hover{background-color:#153615;color:white}
#tabbed-toc .toc-tabs li a.active-tab{background-color:#275827;color:white;-webkit-box-shadow:-2px 2px 2px rgba(0,0,0,.5);-moz-box-shadow:-2px 2px 2px rgba(0,0,0,.5);box-shadow:-2px 2px 2px rgba(0,0,0,.5);position:relative;z-index:5;margin:0 -1px 0 0;/* cursor:text;*/}
#tabbed-toc .toc-content,#tabbed-toc .divider-layer{width:80%;float:right;background-color:white;border-left:5px solid #275827;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
#tabbed-toc .divider-layer{float:none;display:block;position:absolute;top:0;right:0;bottom:0;-webkit-box-shadow:0 0 7px rgba(0,0,0,.7);-moz-box-shadow:0 0 7px rgba(0,0,0,.7);box-shadow:0 0 7px rgba(0,0,0,.7)}
#tabbed-toc .panel{position:relative;z-index:5;font:normal normal 10px/normal Helmet,Freesans,Sans-Serif}
#tabbed-toc .panel li a{display:block;position:relative;font-weight:bold;font-size:11px;color:#892412;line-height:20px;height:20px;padding:0 12px;text-decoration:none;outline:none;overflow:hidden}
#tabbed-toc .panel li time{display:block;font-style:italic;font-weight:normal;font-size:10px;color:#666;float:right}
#tabbed-toc .panel li .summary{display:block;padding:10px 12px 10px;font-style:italic;border-bottom:4px solid #275827;overflow:hidden}
#tabbed-toc .panel li .summary img.thumbnail{float:left;display:block;margin:0 8px 0 0;padding:4px 4px;width:72px;height:72px;border:1px solid #dcdcdc;background-color:#fafafa}
#tabbed-toc .panel li:nth-child(even){background-color:#FFE8E3}
#tabbed-toc .panel li a:hover,#tabbed-toc .panel li a:focus,#tabbed-toc .panel li a:hover time,#tabbed-toc .panel li.bold a{background-color:#333;color:white;outline:none}
#tabbed-toc .panel li.bold a:hover,#tabbed-toc .panel li.bold a:hover time{background-color:#222}
@media (max-width:700px){#tabbed-toc{border:2px solid #333}#tabbed-toc .toc-tabs,#tabbed-toc .toc-content{overflow:hidden;width:auto;float:none;display:block}#tabbed-toc .toc-tabs li{display:inline;float:left}#tabbed-toc .toc-tabs li a,#tabbed-toc .toc-tabs li a.active-tab{background-color:#224C19;-webkit-box-shadow:2px 0 7px rgba(0,0,0,.4);-moz-box-shadow:2px 0 7px rgba(0,0,0,.4);box-shadow:2px 0 7px rgba(0,0,0,.4)}#tabbed-toc .toc-tabs li a.active-tab{background-color:white;color:#333}#tabbed-toc .toc-content{border:none}#tabbed-toc .divider-layer,#tabbed-toc .panel li time{display:none}}
</style>

<br />
<div id="tabbed-toc">
<span class="loading">Memuat...</span></div>
<script>
var tabbedTOC = {
    blogUrl: "http://www.hdesignideas.com/", // Blog URL
    containerId: "tabbed-toc", // Container ID
    activeTab: 1, // The default active tab index (default: the first tab)
    showDates: false, // `true` to show the post date
    showSummaries: false, // `true` to show the posts summaries
    numChars: 200, // Number of summary chars
    showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)
    thumbSize: 40, // Thumbnail size
    noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC", // A "no thumbnail" URL
    monthNames: [ // Array of month names
        "Januari",
        "Februari",
        "Maret",
        "April",
        "Mei",
        "Juni",
        "Juli",
        "Agustus",
        "September",
        "Oktober",
        "November",
        "Desember"
    ],
    newTabLink: true, // Open link in new window?
    maxResults: 99999, // Maximum post results
    preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload")
    sortAlphabetically: true, // `false` to sort posts by published date
    showNew: 7, // `false` to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked
    newText: " - <em style='color:red;'>New!</em>" // HTML for the "New!" text
};
</script>
<script src="http://dte-project.googlecode.com/svn/trunk/tabbed-toc.js"></script>

Keterangan :

Kode warna merah :
Alamat url blog kamu.

Simpan dan lihat hasilnya..      CONTOH PENGGUNAAN..!
Semoga bermanfaat..!
Terima kasih..!