Jumat, 31 Mei 2013

Cara Membuat Menu Blog Dengan Gambar

Cara membuat menu blog dengan gambar dengan keterangan dibawahnya seperti beranda, daftar isi, hubungi, dan lain-lain. Untuk lebih jelasnya lihat gambar dibawah ini. Lalu klik salah satu gambar, maka akan terbuka halaman baru sesuai dengan URL halaman yang saya masukan.

  • membuat menu blog dengan gambar
    Beranda
  • membuat menu blog dengan gambar
    Desain Blog
  • membuat menu blog dengan gambar
    Tips dan Trik
  • membuat menu blog dengan gambar
    Hubungi

    Cara membuat menu blog dengan gambar. Ikuti langkah-langkah dibawah ini.

    1. Login ke blogger. Dari halaman dasbor pilih pengaturan Tata Letak.
    2. Lalu Add Gadget, setelah itu Pilih HTML/JavaScript.
    3. Selanjutnya susun kode CSS dan HTML Seperti format dibawah ini.
    4. <style>
      KODE CSS
      </style>
      KODE HTML
    5. Sebagai contoh, Copy semua kode dibawah ini. dan Pastekan di Gadget HTML/JavaScript Tadi.
    6. <style>
      #tabs31{margin:0;padding:0;}
      #tabs31 ul{list-style: none;}
      #tabs31 ul li{float:left; margin-right:25px;}
      #tabs31 img {width:50px; height:50px;}
      figcaption {text-align:center;color: blue;font-weight:bold;font-size:10px;}
      </style>

      <div id="tabs31">
      <ul>
      <li><a href="http://fandrajuani.blogspot.com/">
      <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjofpRmTU3xZpFtxA7rRMMEKnalkXU7wsP73eirvTFvUgmwEht5Dspfvvz5RQYLVfPH3_Z8jD_Ots_4T1cLCqVYv4EnNga0fF2YD7u402OupXschI-p2wLcs24Bye2o8yoG2AkEphUtK2RT/s128/DAFTAR-ISI.jpg" title="Beranda" width="50" height="50" /></a>
      <figcaption>Beranda</figcaption></li>

      <li><a href="http://fandrajuani.blogspot.com/search/label/Desain%20Blog">
      <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXI-6cf29MMWUUnvV7jCAjdBLEu0fzYolQETM0R_FTo8SPSU2bO-uhPqg1JYgXp5135IapnOOz-6sFGdpd23nFK7n0Om0mZuWkpqYISm2diWKqO2qwr9gTupra-QF79NiF2kRxd9hrSjan/s128/DESAIN.jpg" title="Desain Blog" width="50" height="50" /></a><figcaption>Desain Blog</figcaption></li>

      <li><a href="http://fandrajuani.blogspot.com/search/label/Tips%20dan%20Trik">
      <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzOnDZvxGrcMC-v0Th_F8nMBIInl5Z-IP9A8iYdVhoOiwxxTmrgnsRVeBbLVkF4MVBdyIve2JTFmkl3Na-C20EGfOJ6QYchnugQeCe7gg-zGLbRStsLyQhUtAVc9njpKl93MMZy0G6ci3M/s128/TIPS-DAN-TRIK.jpg" title="Tips dan Trik" width="50" height="50" /></a>
      <figcaption>Tips dan Trik</figcaption></li>

      <li><a href="http://fandrajuani.blogspot.com/p/hubungi.html">
      <img  src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuqd0oEdrF0BNtz8VPLPEMuv8vc38BN3rGW-aY8BQbdZ6oatCDpvvdb5yYDpcbf4Wp3L_PtT1fnibF90ltOvE67FcUb0HRQwNEePUTVLJq_xhieMsBUZjINNK-fKzr99_HUtbBeTTfyzbt/s128/HUBUNGI.jpg" title="Hubungi" width="50" height="50" /></a>
      <figcaption>Hubungi</figcaption></li>

      </ul>
      </div>
    7. Save Gadget, selesai.

    Keterangan Kode Css Langkah 5: 

    • #tabs31 ul{list-style: none;} untuk menghilangkan list-style bulet.
    • #tabs31 ul li{float:left; membuat gambar horizontal, dan margin-right:25px; spasi atau jarak kanan antar gambar.
    • #tabs31 img {width:50px; height:50px;} tinggi dan lebar gambar.
    • figcaption untuk mengatur keterangan dibawah tulisan.

    Keterangan Kode HTML Langkah 5:

    • format dari menu <li><a href="url halaman menu">
    • <img src="Url gambar" title="keterangan gambar saat disentuh mouse" width="50" height="50" /></a>
    • <figcaption>Keterangan dibawah gambar</figcaption></li>
     Jika ingin menambahkan menu tambahkan format seperti dibawah ini.
    <li><a href="url halaman menu"><img src="Url gambar" title="keterangan gambar saat disentuh mouse" width="50" height="50" /></a><figcaption>Keterangan dibawah gambar</figcaption></li>

    Gunakanlah gambar dengan ukuran yang sama disetiap gambar, agar tampilan menu terlihat rapi, caranya bisa lihat di cara membuat icon blog. Cara mengambil URL gambar, bisa kamu baca di artikel cara upload dan ambil url gambar. Cara mengisi url halaman menu, baca artikel cara membuat dan mengisi menu blog. URL Label atau kategori juga bisa kita masukan ke menu.
    Semoga Bermanfaat.

      Selasa, 28 Mei 2013

      Menambahkan Gambar Disamping Judul Posting

      Cara menambahkan gambar disamping judul posting blog.

      gambar disamping judul post blog

      Gambar diatas dengan lingkaran merah adalah contoh gambar yang ditempatkan di samping kiri posting blog, gambar tersebut akan muncul di setiap posting blog yang ada. Akan saya coba jelaskan secara detail, agar bisa di mengerti. Ikuti langkah-langkah dibawah ini.
      1. Login ke blogger, ke pangaturan template.
      2. Selanjutnya klik edit HTML dan cari kode ]]></b:skin> dan pasang kode berikut di atas kode ]]></b:skin>
      3. h3.post-title {
        background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd7UvUxaDYpRhq-Btf6-ieATXGHw3hpFQVwmbu4zU0KVVYjDveC0q8VtycAdyXqxdPvmL0HAXrcDGPG4bbclCKdMorP469G1ySbvTO8ByArSJWx1ZVhyphenhyphenSnDSWqFV-bxTgZ2jtweW4uWMna/s1600/32x32.jpg")no-repeat;padding:10px 0px 0px 40px;}
      4. Save template, Selesai.
      Keterangan kode langkah 2:
        url("gambar.jpg") adalah kode url sumber gambar yang akan digunakan.
        no-repeat membuat gambar tidak berulang.
        padding:10px 0px 0px 40px; mengatur posisi tulisan judul posting.
          Jika gambar ingin ditempatkan disebelah kanan atau tengah judul posting blog. Tambahkan kode berikut disamping no-repeat; contoh: no-repeat top right;
          •  right untuk bagian kanan.
          •  center untuk bagian tengah
          Untuk membuat icon dengan gambar sendiri, silakan baca di cara membuat icon website. Dan untuk cara mengambil URL dari gambar sendiri, baca di cara upload dan ambil url gambar.
            Itulah sedikit cara untuk mendesain blog sendiri, dengan menambahkan gambar disamping judul posting blog, yang akan muncul disetiap posting artikel yang ada di blog. Silakan baca juga cara membuat tulisan bayangan di blog di judul, deskripsi blog bagian tab, sidebar dikiri-kanan blog, sampai judul posting, bisa kita beri tulisan bayangan. Semoga Bermanfaat.

              Senin, 27 Mei 2013

              Cara Mengganti Tulisan Beranda,Posting Lama,Posting Lebih Baru

              Cara mengganti tulisan beranda, posting lama, posting lebih baru di blog dengan kata-kata sendiri atau dengan gambar navigasi halaman.Tulisan tersebut berada di bawah bagian akhir pada saat kita membuka artikel, atau bagian bawah dari daftar posting di halaman awal blog. Untuk blog berbahasa inggris biasanya bertuliskan home, next, previous. Untuk lebih jelasnya lihat gambar dibawah ini.

              mengganti beranda posting lama baru


              Tulisan seperti contoh gambar diatas itulah yang akan kita ganti. cara mengganti tulisan beranda, posting lama, posting lebih baru di blog. Ikuti langkah-langkah dibawah ini.
              1. Login ke blog, dan pilih pengaturan template.
              2. Selanjutnya klik Edit HTML dan cari 3 kode Biru dibawah ini. Gunakan Ctrl F untuk mempermudah Pencarian.
              3. 1. expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
                Keterangan: Posting Lebih Baru(Previous)

                2. expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
                Keterangan: Posting lama(Next)

                3. <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
                Keterangan: Beranda(Home)
              4. Jika hanya ingin mengganti tulisannya saja dengan kata-kata kita sendiri. maka ganti Format kode diatas menjadi seperti ini.
              5. expr:title='data:olderPageTitle'>Selanjutnya</a>
                expr:title='data:newerPageTitle'>Sebelumnya</a>
                <a class='home-link' expr:href='data:blog.homepageUrl'>Rumah</a>
              6. Ganti kode warna merah dengan kata yang kamu inginkan. Untuk beranda/home ada 2 kode yang sama, ganti kedua2nya. Selanjutnya Preview, jika sudah berubah baru save.
              7. Jika ingin mengganti tulisannya dengan gambar, maka tambahkan Url gambar, Contoh:
              8. expr:title='data:newerPageTitle'><img src='http://c.dryicons.com/images/icon_sets/blue_velvet/png/32x32/back.png'/></a>

                expr:title='data:olderPageTitle'><img src='http://b.dryicons.com/images/icon_sets/blue_velvet/png/32x32/forward.png'/></a>

                <a class='home-link' expr:href='data:blog.homepageUrl'><img src='http://c.dryicons.com/images/icon_sets/blue_velvet/png/32x32/home.png'/></a>
              9. Kode warna Biru itu URL gambar dengan tambahan formtanya. Beranda/home ada 2 kode yang sama, ganti kedua2nya. Jika sudah, silakan dipreview dulu, klo sudah berubah baru save.
              10. Untuk mengganti dengan gambar lain, ganti url gambar, dengan url gambar yang kamu inginkan. Format gambar seperti dibawah ini.
              11. <img src='URL gambar kamu'/></a>
              12. Coba cari digoogle gambar, dengan kata kunci icon home. Cari gambar yang ada pilihan ukurannya. Pilih gambar ukuran 32 atau sesuai dengan yang kamu inginkan. Selanjutnya Copy URLnya(klik kanan tepat digambar dan pilih copi URL gambar) dan masukan kodenya di format kode diatas.
              13. Salah satu web yang menyediakan icon gambar adalah http://dryicons.com/icon/blue-velvet/home/ silakan dicari gambar yang sesuai dengan yang kamu inginkan.
              Silakan dibaca juga cara menghilangkan diberdayakan oleh blogger yang berada dibawah posting blog dan juga fitur-fitur lainnya, seperti navbar, langganan entri atom dan masig banyak lagi. Itulah sedikit cara untuk mendesain blog sendiri menggunakan template asli blogger, yaitu dengan mengganti tulisan beranda, posting lama dan posting lebih baru di blog. Semoga Bermanfaat.

              Sabtu, 25 Mei 2013

              Membuat Menu Dropdown di Blogspot

              Cara Membuat Menu Dropdown yang terletak di bawah header Blog.

              membuat menu dropdown di blog

              Ikuti langkah-langkah dibawah ini.
              1. Kunjungi situs http://cssmenumaker.com/
              2. Pilih salah satu menu dropdown yang kamu inginkan.
              3. Sebagai contoh Blue Opera Drop down menu. Gambar paling pertama dari gambar diatas. Selanjutnya klik Customize.
              4. cara membuat menu dropdown diblog
              5. Dan Atur Isi Menu dropdown dengan nama dan URL yang kamu inginkan.
              6. membuat menu dropdown diblog
              7. Keterangan gambar diatas:
                • Gunakan Add Item untuk menambah isi menu, atau klik tanda silang merah untuk menghapus isi menu.
                • Untuk mengganti nama Judul, Klik menu structure dan  isi dibagian Title.
                • Untuk mengganti URL,  Isi bagian Link dengan URL yang kamu inginkan.
                • Dan klik Update Item.
              8. Setelah selesai mengisi menu. Selanjutnya copy semua kode HTML dan CSS di website tersebut, lalu pastekan di gadget HTML/Javascript di blogger. Contoh Pemasangan:
              9. 1. Login ke blogger. Dari halaman dasbor pilih pengaturan Tata Letak.
                2. Klik Tambahkan Gadget, lalu pilih HTML/Javascript.
                3. Lalu Susun Kode HTML dan CSS seperti ini.

                <style>
                Masukan Kode Css
                </style>
                Masukan Kode HTML

                4. Save Gadget, lalu pindahkan ke bawah header.
              10. Jika menu dropdown nya tidak turun atau tidak terlihat???
              11. 1. Login ke blogger. Dari halaman dasbor pilih pengaturan Template.
                2. Klik Edit HTML dan cari kode
                <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
                3. Setelah ketemu, ganti 1 menjadi 3 dan no menjadi yes
                4. Kodenya jadi seperti ini.
                <b:section class='header' id='header' maxwidgets='3' showaddelement='yes'>
                5. Save template.
                6. Selanjutnya kembali ke pengaturan tata letak.
                7. Dan pindahkan Gadget HTML/Javascript menu dropdown tadi, tepat dibawah Header.
                8. Lalu klik Save/Simpan Setelan.

              12. Terakhir, lihat tampilan blog kamu. Selesai.
              Untuk menu yang lebih mudah, bukan dropdown, tapi menu dari laman blogger, silakan baca disini cara membuat dan mengisi menu blog. Semoga Bermanfaat

                Rabu, 22 Mei 2013

                Tombol Sosial Share Widget Untuk Blogger

                Tombol sosial share widget untuk blogger. Seperti facebook tombol like, send, subcribe, recommend, Twitter follow, Google +, Google + 1 dan masih banyak lagi. Tombol share akan muncuk dibawah posting disetiap artikel yang ada di blog.

                Untuk lebih jelasnya ikuti langkah-langkah dibawah ini.
                1. Kunjungi situs sharethis.com
                2. Selanjutnya lakukan registrasi pendaftaran disitus tersebut.
                3. Setelah selesai melakukan registrasi, silakan masuk Log In.
                4. Dan klik Get Sharing Tools
                5. Selanjutnya Step 1 pilih Platform Blogger
                6. Step 2 Style, pilih bentuk tombol share yang kamu inginkan.
                7. Step 3, atur tombol share yang akan dipasang di blog.
                8. tombol share widget untuk blogger
                9. Setelah selesai, klik Finish Get the Code dan Pilih Multi Post
                10. Selanjutnya klik Go, maka akan terbuka halaman baru Import Elemen Laman.
                11. cara membuat tombol share di blog
                12. Dan klik Menambah Widget, pindahkan saja widget ke bagian footer bawah blog. Selesai.
                Tombol sosial share sudah ada di blog, tapi muncul juga dihalaman awal blog. Cara menyembunyikannya, agar muncul hanya di bagian posting blog saja. Ikuti langkah-langkah dibawah ini.
                1. Login ke blogger, dari halaman dasbor pilih pengaturan Template.
                2. Selanjutnya klik Edit HTML dan cari kode share this yang mirip dengan kode dibawah ini.
                3. <b:widget id='HTML1' locked='false' title='ShareThis' type='HTML'>...</b:widget>
                4. Semua kode masih tersembunyi, klik tanda >...< untuk membuka semua kode, sehingga tampilannya menjadi seperti ini.
                5. <b:widget id='HTML1' locked='false' title='ShareThis' type='HTML'>
                  <b:includable id='main'>...<b:includable>
                  </b:widget>
                6. Klik lagi tanda >...< maka akan terbuka semua kode sharethis seperti dibawah ini.
                7. <b:widget id='HTML1' locked='false' title='ShareThis' type='HTML'>
                      <b:includable id='main'>
                    <!-- only display title if it's non-empty -->
                    <b:if cond='data:title != &quot;&quot;'>
                      <h2 class='title'><data:title/></h2>
                    </b:if>
                    <div class='widget-content'>
                      <data:content/>
                    </div>

                    <b:include name='quickedit'/>
                  </b:includable>
                    </b:widget>
                8. Sekarang, tambahkan kode <b:if cond='data:blog.pageType == "item"'> dan </b:if> diantara kode lengkap sharethis diatas, contohnya:
                9. <b:widget id='HTML1' locked='false' title='ShareThis' type='HTML'>
                      <b:includable id='main'>
                  <b:if cond='data:blog.pageType == "item"'>
                    <!-- only display title if it's non-empty -->
                    <b:if cond='data:title != &quot;&quot;'>
                      <h2 class='title'><data:title/></h2>
                    </b:if>
                    <div class='widget-content'>
                      <data:content/>
                    </div>
                  </b:if>
                    <b:include name='quickedit'/>
                  </b:includable>
                  </b:widget>
                10. Terakhir, Preview template, jika sudah hilang dari halaman awal blog, baru save template, Selesai.
                Sekarang coba buka salah satu artikel di blog, dan lihat tombol sosial share yang sudah kamu buat tadi akan muncul dibawah posting, disetiap artikel yang ada. Jadi tidak menggangu tampilan awal halaman blog.

                Silakan dibaca juga artikel lainnya tentang cara membuat komentar facebook diblog yang berada dibawah artikel blog, agar blog bisa dikomentari menggunakan akun facebook. Atau cara membuat facebook like page yang berbentuk kotak dengan tombol Like halaman, serta tampilan foto pengguna facebook yang menyukai halaman blog. Semoga Bermanfaat.

                Breadcrumb Seo untuk Blogspot

                Breadcrumb Seo untuk Blogspot. Breadcrumb berguna untuk memudahkan google untuk menelusuri isi dari blog kita, dan juga memudahkan pembaca melihat informasi letak artikel yang sedang dibaca. Breadcrumb letaknya berada di bawah menu header, dan diatas judul artikel yang sedang dibuka. Untuk lebih jelasnya, lihat contoh gambar dibawah ini.

                breadcrumb seo untuk blogspot
                Cara membuat breadcrumb seo untuk blogspot. Ikuti langkah-langkah dibawah ini.
                1. Login ke blogger, dari halaman dasbor pilih pengaturan template.
                2. Selanjutnya klik edit HTML dan cari kode <b:include data='top' name='status-message'/> dan masukan kode berikut ini diatasnya.
                3. <b:include data='posts' name='breadcrumb'/>
                4. Setelah itu cari kode <b:includable id='main' var='top'> dan masukan kode berikut ini diatasnya.
                5. <b:includable id='breadcrumb' var='posts'>
                  <b:if cond='data:blog.homepageUrl != data:blog.url'>
                  <b:if cond='data:blog.pageType == "static_page"'>
                  <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div>
                  <b:else/>
                  <b:if cond='data:blog.pageType == "item"'>
                  <!-- 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' rel="v:url" property="v:title">Home</a></span>
                  <b:loop values='data:post.labels' var='label'>
                   » <span typeof="v:Breadcrumb"><a expr:href='data:label.url' rel="v:url" property="v:title"><data:label.name/></a></span>
                  </b:loop>
                   » <span><data:post.title/></span>
                  </div>
                  <b:else/>
                  <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div>
                  </b:if>
                  </b:loop>
                  <b:else/>
                  <b:if cond='data:blog.pageType == "archive"'>
                  <!-- breadcrumb for the label archive page and search pages.. -->
                  <div class='breadcrumbs'>
                  <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span>
                  </div>
                  <b:else/>
                  <b:if cond='data:blog.pageType == "index"'>
                  <div class='breadcrumbs'>
                  <b:if cond='data:blog.pageName == ""'>
                  <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span>
                  <b:else/>
                  <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Posts filed under <data:blog.pageName/></span>
                  </b:if>
                  </div>
                  </b:if>
                  </b:if>
                  </b:if>
                  </b:if>
                  </b:if>
                  </b:includable>
                6. Save template, selesai.
                7. Jika ingin merubah tampilan breadcrumb, tambahkan kode css diatas ]]></b:skin>
                8. .breadcrumbs {
                  padding:5px 5px 5px 0px;
                  margin: 0px 0px 15px 0px;
                  font-size:95%;
                  line-height: 1.4em;
                  border-bottom:3px double #e6e4e3;}
                9. Silakan ubah sendiri, kode css nya sesuai dengan yang kalian inginkan.
                Dari sini, pembuatan breadcrumb sudah selesai. Sekarang mengecek breadcrumb di google. Breadcrumb yang terindeks google, tampilannya akan seperti gambar dibawah ini.

                breadcrumb seo untuk blogspot

                Cara ceknya:
                1. Kunjungi situs google http://www.google.com/webmasters/tools/richsnippets
                2. Selanjutnya masukan URL dari salah satu artikel di blog kamu.
                3. Klik Pratinjau, Selesai.
                Setelah memasang breadcrumb seo di blog, google akan mengindeksnya dalam beberapa hari di hasil pencarian google. Silakan dibaca juga artikel lainnya tentang seo, yaitu tentang Belajar seo untuk blogger pemula Semoga Bermanfaat.

                  Senin, 20 Mei 2013

                  Belajar Seo untuk Blogger Pemula

                  Belajar Seo untuk blogger pemula. Seo atau search engine optimization berguna untuk meningkatkan peringkat artikel blog di mesin pencari google. Atau cara agar artikel blog berada di halaman pertama di google, ketika ada orang yang memasukan kata kunci di google search yang sesuai dengan isi dari artikel yang sudah kita buat.

                  Bicara tentang seo, ada banyak faktor yang membuat artikel bisa berada di halaman pertama google, dari umur blog, content isi dari artikel yang berkualitas, backlink dan banyak lagi yang lain. Disini kita akan mempelajari dasar-dasarnya terlebih dahulu. Dari mengubah title judul blog, menambahkan deskripsi, keywoards, dan tools seo yang sudah disediakan oleh blogger. Untuk lebih jelasnya ikuti langkah-langkah dibawah ini.

                  Merubah Judul Title Blog

                  1. Login ke blogger > pengaturan template  > Edit HTML
                  2. Dan Cari kode <title><data:blog.pageTitle/></title> ganti menjadi
                  3. <b:if cond='data:blog.pageType == &quot;index&quot;'>
                    <title><data:blog.pageTitle/> | Desain Blog Tutorial dan Tips Trik Blogspot</title>
                    <b:else/>
                    <title><data:blog.pageName/> - <data:blog.title/></title>
                    </b:if>
                  4. Ganti "Desain Blog Tutorial dan Tips Trik Blogspot" dengan judul yang kamu inginkan, tidak lebih dari 60 karekter. Dan tanda | dan - itu batas pemisah.
                  5. Save template, selesai.

                  Menambahkan meta deskripsi di Halaman awal dan setiap posting blog

                  1. Login ke blogger, dari halaman dasbor pilih Setelan > Preferensi Penelusuran > Tag Meta Deskripsi.
                  2. Pilih Aktifkan deskripsi penelusuran, dan isi deskripsi blog dengan penjelasan dari judul blog, panjang deskripsi Maksimum 150 karakter.
                  3. meta deskripsi untuk seo blog
                  4. Simpan Perubahan, Selesai.
                  5. Sekarang, menambahkan Deskripsi di setiap posting blog.
                  6. Buka Entri Baru atau Edit posting yang ada. 
                  7. Dan Lihat bagian kanan entri, di bagian Deskripsi penelusuran isi dengan penjelasan dari isi posting blog, disarankan 20-30 kata saja.
                  8. meta deskripsi untuk seo blog
                  9. Setelah itu klik selesai.

                  Menambahkan meta keywords kata kunci Blog

                  1. Login ke Blog, pengaturan template, edit HTML dan tempatkan keywoard yang berhubungan dengan isi blog, dibawah kode judul blog tadi.
                  2. <meta content='Fandra Juani,Desain blog,blogger,blogspot,tutorial,cara,belajar,Tips,Trik,edit template,pemula' name='keywords'/>
                  3. Ganti kata kunci diatas dengan kata kunci yang kamu inginkan. Isi keywords dengan kata kunci yang berbeda satu sama lainnya dan pisahkan setiap kata dengan tanda koma.
                  Setelan mengganti Title judul blog, menambahkan deskripsi dan keywords. Sekarang test tingkat seo blog kita, kunjungi http://www.submitshop.com/seo-tools/meta-tag-analyzer untuk melihat berapa skor seo title keseluruhan blog. Setelah selesai, lanjut ke langkah seo berikutnya yaitu menambahkan title dan alt gambar di posting blog.

                  Menambahkan Title dan Alt text gambar blog

                  1. Klik gambar di entri blog, dan isi title text dengan kata kunci 1 sampai 3 kata saja. Dan isi Alt text dengan penjelasan kata kunci gambar, jangan terlalu panjang. Contoh:
                  2. cara membuat image seo blog
                  3. Isi setiap gambar dengan title dan alt yang sesuai dengan isi dari posting blog.

                   Mengatur Tautan Permanen URL Posting Blog

                  1. Buka Entri Baru, dan klik bagian kanan entri pada Tautan permanen. Contoh:
                  2. mengatur tautan permanen seo blog
                  3. Gunakan Tautan Permanen Khusus, jika judul posting terlalu panjang. Buatlah URL yang masih bisa dimengerti maksudnya, walaupun diperpendek url nya, setidaknya 4 sampai 7 kata saja. Setelah di publikasikan URL posting blog tidak bisa diedit lagi alias permanen, karena itu setiap kita membuat entri baru, buatlah judul yang benar-benar sesuai dengan isi dari posting artikel.
                  Selanjutnya adalah menambahkan Internal link url dari satu posting ke posting yang lain. Masukanlah Link Url dari posting atau artikel yang saling berhubungan antara satu dengan yang lainnya. Contoh: Jika kita sedang membuat artikel dengan judul belajar membuat blog, maka masukanlah link url dari posting kita yang lain seperti belajar menulis blog yang telah dipublikasikan sebelumnya.

                  Cara Menggunakan Internal Link Blog

                  1. Klik Link pada bagian tools entri, dan masukan url artikel dari dalam blog. contoh:
                  2. menggunakan internal link seo blog
                  3. Masukan url di bagian web address, dan ganti tulisan di bagian text to display dengan judul atau isi dari url tersebut.
                  4. Jangan gunakan kata Disini atau Klik Disini, Baca Disini pada bagian text to display.
                  5. Gunakanlah kalimat sesuai judul, maksimal 4 sampai 5 kata saja, jangan panjang-panjang.
                  6. Selanjutnya klik Ok. Abaikan saja pengaturan yang lainnya.
                  Seperti contoh diatas, saya memasukan link url dari posting yang lain berjudul cara mempercepat loading blog dengan 4 kata saja. URL yang dimasukan sesuai dengan isi dari artikel ini, tentang belajar seo, karena loading juga mempengaruhi seo. Sekarang coba klik tulisan ini tentang cara menulis artikel di blog , maka akan terbuka halaman baru yang berisi artikel lain yang ada di blog ini.
                  Terakhir adalah tentang Eksternal link atau memasukan URL dari situs lain diluar blog kita. Contohnya facebook.com yahoo.com dan lain-lain. Cara memasukannya di posting blog, sama seperti memasukan url internal link, yang membedakan adalah kita harus mencentang Add 'rel=nofollow' attribute. Untuk meningkatkan seo blog di google.

                  Untuk lebih jelasnya lagi tentang belajar seo blogger, coba cari di google dengan kata kunci seo for blogger, baca dari situs google, jangan situs lain, biasanya dalam format PDF untuk seo starter guide, isinya lebih lengkap dari cara diatas dan yang pasti sumber terpercaya dari google sendiri. Semoga Bermanfaat.

                   

                  Copyright @ 2013 ADOL DOLLAR.