Cara Menyimpan kode Snippets Feed Icon Pada Blogger

Cara Menyimpan kode Snippets Feed Icon Pada Blogger

Written by Muhamad Hamdan on Tuesday Jan 21th 2014

---

Apa yang dimaksud Feed..? Kita sering menemukan kata "RSS","XML" dan "Atom" diberbagai media artikel,tapi kita tidak tahu bagaimana cara menggunakan link ini.

Feed adalah cara untuk Website/Blog besar dan kecil untuk mendistribusikan konten mereka jauh melampoi dengan pengunjung menggunakan brower.Izin berlangganan feed update regular,dikirim secara otomatis melalui web portal,news reader,atau pembuatan email sejak lama selalu terbaik.Feed juga memungkinkan untuk konten situs yang dikemas dalam "widget, "gadget" perangkat mobile,dan tecnologi gigitan ukuran lain yang memungkinkan untuk menampilkan blog,podcast,dan major news /sport/cuaca/ apapun berita utama hanya tersedia dimana saja.

Dalam beberapa kasus Anda bisa menggunakan feed dengan men-Download icon.Tetapi kali kali Saya akan membahas cara menyimpan Kode Snippet pada Blogger,dengan menggunakan HTML dan CSS.Barangkali Anda ingin link ke feed dalam sebuah paragraf.Untuk menghilankannnya Anda harus menambahkam texs deskriftif agar pengguna mengetahui link tersebut ke feed.Anda dapat menepatkan icon sebelum texs yang terkait dengan pakan.

Live Demo

---

Tampilan Feed Icon Pada Blogger 

---

Jika WEbsite/Blog Anda memiliki lebih dari satu pakan,Anda bisa menyajikan semua feed yang ada sebagai daptar.

Contoh :

All Posts  Category 1  Category 2  Category 3

All Posts  Category 1  Category 2  Category 3

---

Bagaimana Cara Menampilkan Kode Snippets Pada Blogger ?

---

  Langkah 1. Anda masuk ke Blogger Account

  Langkah 2. Anda klik Layout

  Langkah 3. add gadget

  Langkah 4. COPAS kode HTML dibawah

KODE HTML
<ul class="feed-list">   <li><a href="#">All Posts</a></li>   <li><a href="#">Category 1</a></li>   <li><a href="#">Category 2</a></li>   <li><a href="#">Comments</a></li> </ul>

KODE CSS
.feed-list {   margin: 0 0 15px 15px;   padding: 0;   list-style-type: none; } .feed-list li {   margin: 0 0 10px 0;   padding: 0;   list-style-type: none; } .feed-list li a {   padding: 0 0 0 19px;   background: url("../images/feed-icon-14x14.png") no-repeat 0 50%;   list-style-type: none; }

Akhir Kata

Demikian Tutorial Menyimpan kode Snippets Feed Icon Pada Blogger Semoga bermanfaat untuk lebih jelas silahkan Anda mengunjungi www.feed.com

---

Cara Menambahkan Dengan Gaya Berbeda Recent Post Widget Pada Blogger

Cara Menambahkan Dengan Gaya Berbeda Recent Post Widget Pada Blogger

Written by Muhamad Hamdan on Minggu Jan 19th 2014

---

Cara meningkatkan tampilan dihalaman Blog Anda atau Website dengan menambahkan recent post gaya baru untuk mempermudah pengunjung dalam pencarian artikel yang terkait di suatu halaman Blog.Juga sangat bagus untuk mengurangi Bounce Rate Blog/Website Anda.Pada hari Saya akan menunjukan Cara Menambahkan Dengan Gaya Berbeda Recent Post Widget Pada Blogger Anda dengan tampilan yang lebih indah dan lebih menarik bagi pengunjung Blog Anda.Harapan Saya Anda menikmati tampilan yang multi warna Widget Recent Post dengan CSS dan jQuery dalam meningkatkan Page views pengunjung Anda.Semoga Blog/Website Anda lebih top dalam peringkat Google, Yahoo dan Bing.

---

Bagaimana Cara Menyipan Widget Recent Post Pada Blogger...?

---

Langkah 1. Anda Ligin Blogger Account
Langkah 2. Pilih Layout dan langsug klik
Langkah 3. Pilih Gadget dan klik tambah gadget
Langkah 4. Copypaste kode HTML dan simpan kolom popup HTML/JavaScript
Langkah 5. Sudah menyimpan kodenya lalu klik Save
Langkah 6. Selesai dan lihat hasilnya

---

 Anda ikuti langkah-selanjutnya cara menambahkan widget pada Blogger Anda

---

Live Demo

Silahkan Anda Sekarang Copypaste Kode HTML Ini

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><div id="recent-posts"><script language="JavaScript"> home_page = "http://cara-alfiyah.blogspot.com/"; numposts = 7; imgr = new Array();showRandomImg = false;boxwidth = 255;cellspacing = 6;borderColor  = "#232c35";bgTD = "#000000";thumbwidth = 0;thumbheight = 0;fntsize = 15;acolor = "#666";aBold = true;icon = " ";text = false;showPostDate = false;summaryPost = 0;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";</script><script  src="http://dl.dropboxusercontent.com/s/niuq8uqagunjvbq/recent-posts-min-1-ycode.js"  type="text/javascript"/><a href="http://cara-alfiyah.blogspot.com/" rel="dofollow" target="_blank" title=""><img alt="" border="0"  src="http://i1341.photobucket.com/albums/o741/bujangarab1/56bbf131-f319-4643-8c54-4ae97111d956_zps5c4c7e72.gif" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/> </a><a href="http://cara-alfiyah.blogspot.com/" rel="dofollow" target="_blank"  title="ALfiyah Info Blogger"><img alt="ALfiyah Info Blogger" border="0"  src="http://i1341.photobucket.com/albums/o741/bujangarab1/56bbf131-f319-4643-8c54-4ae97111d956_zps5c4c7e72.gif" style="position: fixed; bottom: 10%; right: 0%;"/> </a><a href="http://cara-alfiyah.blogspot.com/" rel="dofollow" target="_blank" title="ALfiyah Info Blogger"> <img alt="ALfiyah Info Blogger" border="0" src="http://i1341.photobucket.com/albums/o741/bujangarab1/56bbf131-f319-4643-8c54-4ae97111d956_zps5c4c7e72.gif" style="position:  fixed; bottom: 10%; left: 0%;"/></a><link rel="stylesheet" type="text/css" href="http://dl.dropboxusercontent.com/s/ecikvgo68yrfgps/recent-posts-min-1.css" /></script ></div>

Catatan : Kode HTML yang bertanda merah diganti dengan alamat Blogger Anda,Sedangkan warna biru bisa Anda rubah sesuai dengan selera yang Anda mau.Misalkan dirubah dengan 5,6,7 dan selanjutnya.

Demikian tutorial cara menambahkan widget semoga bermanfaat. Anda juga mungkin meminati Cara Memasang Auto Scroll Widget Pada Blogger

---

Membuat Blogger Template SEO Friendly

Membuat Blogger Template SEO Friendly

Written by Muhamad Hamdan on Sabtu Jan 18th 2014

---

Blogger adalah CMS yang paling populer yang sedang digunakan oleh ribuan bahkan jutaan Blogger. Hal yang terbaik dari itu adalah yang dimiliki oleh Google yang membantu Webmaster untuk melibatkan blog mereka dengan Google karena untuk mendapatkan lebih banyak lalulintas dengan Google.Disana kita dapat menginstal template kustom tapi kebanyakan template tidak Dioptimalkan secara SEO,dikarenakan dirancang oleh pengembang yang berbeda.Jadi jika Anda termasuk Saya juga menggunakan template kustom atau template Default maka Anda harus memeriksa maka kita harus memeriksa untuk mengoptimakan di mesin pencari,Jika tidak kita harus mengoptimakannya untuk mendapatkan lalulintas yang cerdik.Jadi dalam kesempatan ini kita belajar untuk Membuat Blogger Template SEO Friendly .

---

Tampilan Judul Postingan Pertama Dalam Search Results

---

Pernahkah Anda memperhatikan bahwa judul postingan muncul setelah judul blog dalam hasil pencarian...? jika betul terus ikuti bagian ini.Petama tama lihat contoh dibawah ini.

Setelah melihat gambar diatas mungkin Anda sudah mendapatkan point,dengan alasan mengapa paska judul harus muncul pertama dalam hasil pencarian adalah bahwa ketika sesorang akan mencari konten apapun Dia akan membaca beberapa kata judul jika cocok dengan konten yang dicari maka dia akan mengkliknya,kalau tidak cocok dia akan mengabaikannya.Dalam rangka untuk menggelar tampilan posting timbul pertama dalam hasil pencarian ikuti langkah dibawah ini.

♣

         Pergi Blogger >> Template >> Backup Template Anda

♣

         Klik Edite HTML Dan Cari Kode Dibawah Ini.

...          .           <title><data:blog.pageTitle/></title>            .                        ..

♣

        Ganti Kode Diatas Dengan Kode Berikut.

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

♣

        Simpan Template Anda Dan Klik Sive.

♣

        Sekarang Langkah Selanjunya.

---

Menambahkan Meta Deskription Dan Keyword Tags

---

Didalam bagian ini kita akan menambahkan meta deskription dan keyword tags,adapun gunanya adalah agar blog Anda mudah di Crawler oleh mesin pencari yang didasarkan dari kategori blog Anda.Ini juga akan membantu mesin pencari untuk menampilkan postingan blog pada kata kunci yang tepat.Untuk itu mari ikuti cara menambahkan deskripsi dan kata kunci berikut ini.

♣

         Pergi Blogger >> Template >> Edite HTML

♣

        Sekarang Cari Kode <head>, Kalau Sudah Ketemu Simpan Kode Dibawah Ini Tepat Setelah <head>

<meta content='TULIS DISINI DESKRIPSI BLOG'S ANDA' name='description'/>      <meta content='DiSINI TULIS KEYWORD ANDA' name='keywords'/> .

♣

        Catatan :"TULIS DISINI DESKRIPSI BLOG'S ANDA" Isi dengan diskripsi anda sebanyak 150 karakter,dan "DiSINI TULIS KEYWORD ANDA" ganti dengan kata kuci blogs Anda sebanyak 150 karakter.

♣

         Akhirnya Klik Simpan, Selesai!

---

Mengoptimalkan Judul Posting Dengan Tag H2

---

Para Blogger Profesional menganjurkan kita untuk menggunakan tag H2 yang bertujuan agar judul blog kita optimal dalam mesin pencari lebih bagus.Secara default di Blogger,tag H3 dijadikan judul posting,tetapi tag H2 lebih baik.Untuk menggunakan H2 dalam posting blog ikuti langkah berikut.

♣

         Pergi Blogger >> Template >> Edite HTML

♣

            Lalu Cari Kode Dibawah Ini

<b:if cond='data:post.title'>                   .

♣

            Sekarang Anda Akan Melihat Perbedaan Sesuatu Yang Tertera Pada Gambar Dibawah

♣

            Pada Gambar Diatas Anda dapat melihat bahwa dalam memulai judul postingan blog dimulai dengan tag H3. Sekarang Anda hanya perlu Mengganti tag H3 menjadi tag H2,dan juga tag akhir </ h3> dengan </ h2> .Setelah mengganti terlihat akan seperti gambar dibawah ini.

♣

            Setelah Mengoptimalkan Judul Posting ,Sekarang Yang Perlu Lakukan Anda Tinggal menyimpan Template.

♣

         Selamat ! Buat Template Anda Berhasil Dioptimalkan Mesin Pencari.

---

Tutorial Google's Halaman Unlock Captcha - ALfiyah

Tutorial Google's Halaman Unlock Captcha

Written by Muhamad Hamdan on Friday Jan 16th 2014

---

Dua hari yang lalu ada seorang yang menanyakan, bagaimana cara mengaktikan "imap gmai.com"..? yang karena dengan alasan terkunci. Saya mengintruksikan untuk mencoba membukanya kembali dengan menggunakan account google unlock captcha.

Seperti yang sudah dilakukan sebelumnya ketika akunnya terkuci dan ternyata mereka telah berhasil dengan cara menggunakan Google's Halaman Unlock Captcha untuk mengizinkan akses ke akun google anda kembali. Hararapan yang membantu seseorang yang lagi mendapat kesulitan semoga berhasil dalam jangka waktu sedikit. Demikin satu pengalaman yang jarang terjadi,tapi kita gak ada salahnya untuk berbagi ilmu,ada pepatah yang mengatakan "Carilah Ilmu Walaupun Sampai Ke Negri Cina".

---

---

Cara Membuat Makrup Blogger Dengan Schema.Org - ALfiyah

Cara Membuat Makrup Blogger Dengan Schema.Org

Written by Muhamad Hamdanon Tuesday Jan 15th 2014

---

---

Apakah Anda Ingin Melihat Dalam Hasil Pencarian Google Result Seperti Ini..?

---

Mari Kita Lihat Dengan Mengambil Metode Schema.Org

---

Mesin Pecari seperti Google,Yahoo,Dan Bing telah mendukung dengan adanya Potongan Tentang kaya dan data terstruktur/rich snippets.Baru baru ini merangkak dengan penggunaan Schema.Org sebuah metode yang menyediakan makrup terkaya dalam hasil mesin pencari dan bahwa yang terbaik dari semua itu juga paling mudah untuk penggunaannya.

---

Dalam Jangka Bebberapa Menit Kita Mendapatkan Blog Yang Sangat Hebat Dengan Menggunakan Kode HTML Sebelumnya

---

Live Demo

. <div id="blog_post">     <h2>Post Title</h2>     <div class="byline">Written by Muhamad Hamdan on Tuesday Jan 14th 2014</div>....     <div class="content">Content...</div> </div> .

Schema.Org banyak para blogger menggunakannya dengan jenis dan metode yang berbeda untuk membuat postingan blogger dengan Schema.Org. Tetapi saya akan memberi tahu mesin pencari bahwa ini adalah skema yangsaya gunakan dengan menambahkan itemtype dan itemscope halaman blogger postingan saya.

. <div id="blog_post" itemscope="" itemtype="http://schema.org/BlogPosting">....... <!-- --> </div> .

Selanjutnya kita tambahkan itemprop untuk judul dan konten. Disini saya akan menggunakan nama dan judul prperty untuk header, dan properti ArtikelBody untuk konten.

. <div id="blog_post" temscope="" itemtype="http://schema.org/BlogPosting">......     <h2 itemprop="name headline">Post Title</h2>     <!-- -->     <div class="content" itemprop="articleBody">Content...</div> </div> .

Bagian terakhir sedikit agak sulit tapi sangat bagus. Saya ingin menentukan tanggal dan penulis,ini akan memberikan tampilan photo dan diterbitakan 1 menit yang lalu,dengan adanya penampilan penulis akan lebih baik bagi mesin pencari seperti Google.Tentang Cara Menambahan Informasi Ada dua langkah yang bisa menentukan.Pertama tambahkan itemprop penulis,dengan itemtype dan itemscope.Hal ini menciptakan ruang lingkup bagi penulis.Kemudian disini ditambahkan rentang baru dengan itemprop nama dan juga ditambahkan link profil penulis Google+ dengan atributrell = "author" dan itemprop dari URL.

---

Ini Adalah Babak Terakhir Seperti Yang Bisa Anda Lihat Dibawah.

---

. <div id="blog_post" itemscope="" itemtype="http://schema.org/BlogPosting">     <h2 itemprop="name headline">Post Title</h2>     <div class="byline">         Written by         <span itemprop="author" itemscope="" itemtype="http://schema.org/Person">             <span itemprop="name">                 <a href="https://plus.google.com/110064667144377377705/" itemprop="url" rel="author">Muhamad Hamdan</a>             </span>         </span>         on         <time datetime="2014-01-14T22:00" itemprop="datePublished">Tuesday Jan 14th 2014</time>     </div>     <div class="content" itemprop="articleBody">Content...</div> </div> .

Selanjutnya gunakan Alat Penguji Google untuk memastikan kebenaran makrup Anda dan mendorong perubahan aktipitas kita. Berikan Google untuk menelusuri kembali halaman kita dan memperbaharui indeks mereka, dan selama beberapa hari kedepan Anda harus mulai melihat beberapa hasil yang lebih bagus mesin pencarian.

---