AGcreator Blog

Daftar Lengkap Icon Font Awesome CSS + Value

Postingan Sebelumnya : Cara Pasang Icon Font Awesome di Blog

Pada postingan sebelumnya saya menjelaskan bagaimana cara pasang icon Font Awesome di Blog. Saat ini saya akan memberikan list lengkap icon Fon Awesome beserta Value Contentnya. Selain cara yang telah saya sebutkan sebelumnya, Font Awesome icon juga bisa disisipkan dengan pseudo elemen :before.

Untuk menambahkan icon Font Awesome pada pseudo elemen :before, tentunya sobat harus mengetahui value content dari icon tersebut. Contoh penggunaan :


.element {
    position: relative;
}
 
/*ganti conten value sesuai
dengan icon yang diperlukan*/
 
.element:before {
    content: "\f000"; 
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
/*--sesuaikan sebagai tambahan--*/
    color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;
}

Berikut ini list lengkap icon Font Awesome dan CSS value content

Icon Aplikasi Website

icon-adjust "\f042"
icon-anchor "\f13d"
icon-asterisk "\f069"
icon-ban-circle "\f05e"
icon-bar-chart "\f080"
icon-barcode "\f02a"
icon-beaker "\f0c3"
icon-beer "\f0fc"
icon-bell "\f0a2"
icon-bell-alt "\f0f3"
icon-bolt "\f0e7"
icon-book "\f02d"
icon-bookmark "\f02e"
icon-bookmark-empty "\f097"
icon-briefcase "\f0b1"
icon-bullhorn "\f0a1"
icon-bullseye "\f140"
icon-calendar "\f073"
icon-calendar-empty "\f133"
icon-camera "\f030"
icon-camera-retro "\f083"
icon-certificate "\f0a3"
icon-check-empty "\f096"
icon-check-minus "\f147"
icon-check-sign "\f14a"
icon-check "\f046"
icon-circle "\f111"
icon-circle-blank "\f10c"
icon-cloud "\f0c2"
icon-cloud-download "\f0ed"
icon-cloud-upload "\f0ee"
icon-code "\f121"
icon-code-fork "\f126"
icon-coffee "\f0f4"
icon-cog "\f013"
icon-cogs "\f085"
icon-collapse-alt "\f117"
icon-comment "\f075"
icon-comments "\f086"
icon-comments-alt "\f0e6"
icon-credit-card "\f09d"
icon-crop "\f125"
icon-dashboard "\f0e4"
icon-desktop "\f108"
icon-download "\f01a"
icon-download-alt "\f019"
icon-edit "\f044"
icon-edit-sign "\f14b"
icon-ellipsis-horizontal "\f141"
icon-ellipsis-vertical "\f142"
icon-envelope "\f003"
icon-envelope-alt "\f0e0"
icon-eraser "\f12d"
icon-exchange "\f0ec"
icon-exclamation "\f12a"
icon-exclamation-sign "\f06a"
icon-expand-alt "\f116"
icon-external-link "\f08e"
icon-external-link-sign "\f14c"
icon-eye-open "\f06e"
icon-eye-close "\f070"
icon-facetime-video "\f03d"
icon-fighter-jet "\f0fb"
icon-film "\f008"
icon-filter "\f0b0"
icon-fire-extinguisher "\f134"
icon-fire "\f06d"
icon-flag-alt "\f11d"
icon-flag-checkered "\f11e"
icon-folder-close "\f07b"
icon-folder-open "\f07c"
icon-folder-close-alt "\f114"
icon-folder-open-alt "\f115"
icon-food "\f0f5"
icon-frown "\f119"
icon-gamepad "\f11b"
icon-gift "\f06b"
icon-glass "\f000"
icon-globe "\f0ac"
icon-group "\f0c0"
icon-hdd "\f0a0"
icon-headphones "\f025"
icon-heart-empty "\f08a"
icon-heart "\f004"
icon-home "\f015"
icon-inbox "\f01c"
icon-info-sign "\f05a"
icon-info "\f129"
icon-key "\f084"
icon-keyboard "\f11c"
icon-laptop "\f109"
icon-leaf "\f06c"
icon-legal "\f0e3"
icon-lemon "\f094"
icon-level-up "\f148"
icon-level-down "\f149"
icon-lightbulb "\f0eb"
icon-location-arrow "\f124"
icon-lock "\f023"
icon-magic "\f0d0"
icon-magnet "\f076"
icon-mail-reply "\f112"
icon-mail-reply-all "\f122"
icon-mail-forward "\ff064"
icon-map-marker "\f041"
icon-meh "\f11a"
icon-microphone "\f130"
icon-microphone-off "\f131"
icon-minus "\f068"
icon-minus-sign "\f056"
icon-minus-sign-alt "\f146"
icon-mobile-phone "\f10b"
icon-money "\f0d6"
icon-move "\f047"
icon-music "\f001"
icon-off "\f011"
icon-ok "\f00c"
icon-ok-sign "\f058"
icon-ok-circle "\f05d"
icon-pencil "\f040"
icon-phone "\f095"
icon-phone-sign "\f098"
icon-picture "\f03e"
icon-plane "\f072"
icon-google-plus-sign "\f0d4"
icon-google-plus "\f0d5"
icon-print "\f02f"
icon-pushpin "\f08d"
icon-puzzle-piece "\f12e"
icon-qrcode "\f029"
icon-question-sign "\f059"
icon-question "\f128"
icon-quote-left "\f10d"
icon-quote-right "\f10e"
icon-random "\f074"

icon-refresh "\f021"
icon-remove-sign "\f057"
icon-remove-circle "\f05c"
icon-remove "\f00d"
icon-reorder "\f0c9"
icon-reply "\f112"
icon-reply-all "\f122"
icon-resize-vertical "\f07d"
icon-resize-horizontal "\f07e"
icon-retweet "\f079"
icon-road "\f018"
icon-rocket "\f135"
rotate-left "\f0e2"
rotate-right "\f01e"
icon-rss "\f09e"
icon-rss-sign "\f143"
icon-screenshot "\f05b"
icon-search "\f002"
icon-share "\f045"
icon-share-alt "\f064"
icon-share-sign "\f14d"
icon-shield "\f132"
icon-shopping-cart "\f07a"
icon-sign-blank "\f0c8"
icon-signal "\f012"
icon-signin "\f090"
icon-signout "\f08b"
icon-sitemap "\f0e8"
icon-smile "\f118"
icon-sort "\f0dc"
icon-sort-down "\f0dd"
icon-sort-up "\f0de"
icon-spinner "\f110"
icon-star "\f005"
icon-star-empty "\f006"
icon-star-half-full "\f123"
icon-star-half-empty "\f123"
icon-suitcase "\f0f2"
icon-tablet "\f10a"
icon-tag "\f02b"
icon-tags "\f02c"
icon-tasks "\f0ae"
icon-terminal "\f120"
icon-thumbs-up "\f087"
icon-thumbs-down "\f088"
icon-ticket "\f145"
icon-time "\f017"
icon-tint "\f043"
icon-trash "\f014"
icon-trophy "\f091"
icon-truck "\f0d1"
icon-umbrella "\f0e9"
icon-unlock "\f09c"
icon-unlock-alt "\f13e"
icon-upload "\f01b"
icon-upload-alt "\f093"
icon-user-md "\f0f0"
icon-user "\f007"
icon-volume-off "\f026"
icon-volume-down "\f027"
icon-volume-up "\f028"
icon-warning-sign "\f071"
icon-wrench "\f0ad"
icon-zoom-in "\f00e"
icon-zoom-out "\f010"

Icon Teks Editor

icon-file "\f016"
icon-file-alt "\f0f6"
icon-cut "\f0c4"
icon-copy "\f0c5"
icon-paste "\f0ea"
icon-save "\f0c7"
icon-undo "\f0e2"
icon-repeat "\f01e"
icon-text-height "\f034"
icon-text-width "\f035"
icon-align-left "\f036"
icon-align-center "\f037"
icon-align-right "\f038"
icon-align-justify "\f039"
icon-indent-left "\f03b"
icon-indent-right "\f03c"
icon-font "\f031"
icon-bold "\f032"
icon-italic "\f033"
icon-strikethrough "\f0cc"
icon-underline "\f0cd"
icon-superscript "\f12b"
icon-subscript "\f12c"
icon-link "\f0c1"
icon-unlink "\f127"
icon-paper-clip "\f0c6"
icon-eraser "\f12d"
icon-columns "\f0db"
icon-table "\f0ce"
icon-th "\f00a"
icon-th-list "\f00b"
icon-th-large "\f009"
icon-list "\f03a"
icon-list-ul "\f0ca"
icon-list-ol "\f0cb"
icon-list-alt "\f022"

Icon Penunjuk

icon-angle-left "\f104"
icon-angle-right "\f105"
icon-angle-up "\f106"
icon-angle-down "\f107"
icon-arrow-left "\f060"
icon-arrow-right "\f061"
icon-arrow-up "\f062"
icon-arrow-down "\f063"
icon-caret-down "\f0d7"
icon-caret-up "\f0d8"
icon-caret-left "\f0d9"
icon-caret-right "\f0da"
icon-chevron-left "\f053"
icon-chevron-right "\f054"
icon-chevron-up "\f077"
icon-chevron-down "\f078"
icon-chevron-sign-left "\f137"
icon-chevron-sign-right "\f138"
icon-chevron-sign-up "\f139"
icon-chevron-sign-down "\f13a"
icon-circle-arrow-left "\f0a8"
icon-circle-arrow-right "\f0a9"
icon-circle-arrow-up "\f0aa"
icon-circle-arrow-down "\f0ab"
icon-double-angle-left "\f100"
icon-double-angle-right "\f101"
icon-double-angle-up "\f102"
icon-double-angle-down "\f103"
icon-hand-right "\f0a4"
icon-hand-left "\f0a5"
icon-hand-up "\f0a6"
icon-hand-down "\f0a7"

Icon Video Player

icon-play "\f04b"
icon-play-sign "\f144"
icon-play-circle "\f01d"
icon-pause "\f04c"
icon-stop "\f04d"
icon-eject "\f052"
icon-forward "\f04e"
icon-fast-forward "\f050"
icon-step-backward "\f048"
icon-step-forward "\f051"
icon-fullscreen "\f0b2"
icon-resize-full "\f065"
icon-resize-small "\f066"

Icon Merk

icon-css3 "\f13c"
icon-facebook-sign "\f082"
icon-facebook "\f09a"
icon-twitter-sign "\f081"
icon-twitter "\f099"
icon-github "\f09b"
icon-github-sign "\f092"
icon-html5 "\f13b"
icon-linkedin "\f0e1"
icon-linkedin-sign "\f08c"
icon-maxcdn "\f136"
icon-pinterest "\f0d2"
icon-pinterest-sign "\f0d3"
icon-google-plus "\f0d5"
icon-google-plus-sign "\f0d4"

Icon Kedokteran

icon-ambulance "\f0f9"
icon-beaker "\f0c3"
icon-h-sign "\f0fd"
icon-hospital "\f0f8"
icon-medkit "\f0fa"
icon-plus-sign-alt "\f0fe"
icon-stethoscope "\f0f1"
icon-user-md "\f0f0"

Repost from : http://blog.kangismet.net/2013/06/daftar-icon-font-awesome-lengkap-dan-css-content-value.html

Resource : http://astronautweb.co/snippet/font-awesome/ - http://fortawesome.github.io/Font-Awesome/icons/

Cara Pasang Plugin Font Awesome CSS3 di Blog

Font / Icon Awesome merupakan kumpulan icon dan tombol yang berbasis font. Artinya, ketika sobat membutuhkan ikon di blog, tidak lagi menggunakan gambar / image yang tentunya akan lebih mempercepat loading blog sobat.

Untuk bisa menggunakan Font Awesome ini, sobat harus menyimpan CSSnya di atas </head>

<link href='//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css' rel='stylesheet'/>

Berikut Cara Menggunakan Font Awesome

Untuk menggunakan Font Awesome, sobat harus menambahkan tag

<i>

kemudian class nya gunakan nama icon.

cara penulisannya :

cara penulisannya :

Memperbesar Ukuran

Bordered & Pulled Icons

Gunakan kode pull-right atau pull-left untuk disimpan di kanan atau dikiri, dan icon-border untuk membuat kotak diluar icon bendera. Ini hanya sekedar contoh, untuk lebih variatif silahkan dicoba sendiri.

Gunakan kode pull-right atau pull-left untuk disimpan di kanan atau dikiri, dan icon-border untuk membuat kotak diluar icon bendera. Ini hanya sekedar contoh, untuk lebih variatif silahkan dicoba sendiri.

Gunakan kode pull-right atau pull-left untuk disimpan di kanan atau dikiri, dan icon-muted untuk membuat ikon menjadi warna muda.

Gunakan kode pull-right atau pull-left untuk disimpan di kanan atau dikiri, dan icon-muted untuk membuat ikon menjadi warna muda.

Animated Spinner

Untuk membuat ikon berputar, seperti animasi loading gunakan kode icon-spin bagus digunakan pada icon-spinner dan icon-refresh

Ini contoh icon-spinner yang diputar.

Ini contoh <code>icon-spinner</code> yang diputar.

Rotated & Flipped

Ikon juga dapat diputar dengan menentukan derajat putaran, juga bisa dibalik secara vertikal atau horizontal.

ikon normal
ikon diputar 90 derajat
ikon diputar 180 derajat
ikon diputar 270 derajat
ikon dibalik secara horizontal
ikon dibalik secara vertikal

ikon normal
  ikon diputar 90 derajat
  ikon diputar 180 derajat
  ikon diputar 270 derajat
  ikon dibalik secara horizontal
  ikon dibalik secara vertikal

Stacked Icons

Ikon juga dapat ditumpuk, Gunakan kode icon-stack sebelum tag ikon, dan kode icon-stack-base sebagai background / di bawah.

icon-twitter di atas icon-check-empty
icon-flag di atas icon-circle

icon-twitter di atas icon-check-empty 

icon-flag di atas icon-circle

Button

Icon juga dapat diterapkan pada button / tombol.

<ul class="button"> <li><a class="btn1" href="#">
 Reload</a></li> <li><a class="btn2" href="#">
 Checkout</a></li> <li><a class="btn2" href="#">
 Info</a></li> <li><a class="btn1" href="#">
 Delete</a></li> </ul>

Bukan hanya pada button, icon Font Awesome ini bisa disimpan di berbagai tempat, seperti menu, menu dropdown, form, dan-lain-lain...

Penambahan Efek

Ikon Font Awesome juga bisa dikombinasikan dengan efek yang lainnya, seperti rotation pada contoh di bawah, silahkan arahkan mouse pada logo twitter di bawah ini :

Untuk CSS dan HTMLnya silahkan diacak2 sendiri sob.... Semoga bermanfaat, dan slamat berkreasi....

Lihat Daftar Lengkap Icon FONT AWESOME Klik Disini

Repost from : http://blog.kangismet.net/2013/06/daftar-icon-font-awesome-lengkap-dan-css-content-value.html

Resource : http://astronautweb.co/snippet/font-awesome/ - http://fortawesome.github.io/Font-Awesome/icons/

Cara Upload File CSS & JS (JavaScript) Gratis di Tumblr

Pada kesempatan ini saya akan memberitahukan Hosting Gratis dari Tumblr , yang mungkin bisa membantu anda dalam menyimpan sebuah file CSS dan JavaScript online selain di Google Code ..

Untuk Gambaran-nya silahkan lihat di bawah ini :

Cara Upload File CSS & JS (JavaScript) Gratis di Tumblr

Cara nya :

1. Masuk dulu ke Halaman Upload File Tumblr : Klik Disini

2. Daftar / Masuk Tumblr , dan Hosting Gratis dari Tumblr pun siap di akses ..

3. Selesai , selamat menikmati hosting gratisan dari Tumblr.com ^-^

Mudah bukan? hehe , semoga bermanfaat ! ..

Hargai setiap Tutorial yang original ! berikan sumber link jika anda berminat untuk berbagi tutorial dari blog saya .. terima kasih

Membuat Effect Loading Blog dengan jQuery

Kali ini kita akan membuat Effect Loading Halaman menggunakan Fitur jQuery dengan tambahan ke-2 bumbu coding CSS & JavaScript , akan kita buat menjadi sebuah resep efek loading page / loading halaman yang akan tampil ketika berpindah halaman ..

Pada Kesempatan ini saya akan membuat ke-2 coding nya terpisah , agar mudah di pahami oleh anda yang ingin mencoba resep " Membuat Effect/Efek Loading Halaman " dengan Bumbu CSS & Javascript ini ..

Langkah-1 : Pastikan sobat sudah memasang jQuery Library! jika sobat belum memasang jQuery Library, silahkan simpan kode di bawah ini tepat di atas kode </head> :

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"/>

Catatan Penting! : Pemasangan jQuery dalam Blog hanya boleh 1x saja, jika lebih dari 1 maka Efek-efek yang mengandalkan fungsi jQuery tidak akan berfungsi.

Langkah Ke-2 perhatikan Bumbu CSS dibawah ini , jika sudah dirubah lalu simpan tepat sebelum kode ]]></b:skin> :

#page-loader {
    position: fixed!important;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #f2f2f2 url(//googledrive.com/host/0B7H_GQEvKCj1Rmh1blVLZV9fSlk/Gambar/kr-loading.gif) no-repeat 95% 95%;
    color: #fff;
    padding: 1em 1.2em;
    display: none;
}

Keterangan CSS :

1. #f2f2f2 → Diganti dengan Code HEX Warna Background untuk loading sesuka anda. Menggunakan Color Picker →

2. //googledrive.com/host/0B7H_GQEvKCj1Rmh1blVLZV9fSlk/Gambar/kr-loading.gif → Diganti dengan Alamat Gambar/Animasi berformatkan (.GIF) sesuka anda , dan anda pun bisa membuat Animasi Loading sendiri , silahkan Klik disini .

Langkah Ke-3 : Simpan bumbu JavaScript di bawah ini Tepat sebelum kode </body> :

<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="page-loader"></div>');
$(window).on("beforeunload", function() {
    $('#page-loader').fadeIn(500).delay(1000).fadeOut(1000);
});
//]]>
</script>

► Selesai, Save Template! dan sekarang tinggal "REFRESH [F5]" pada halaman blog anda .. Semoga Berhasil!

Catatan: BUMBU = CSS & JavaScript ( CSS & JavaScript itu Bagaikan Bumbu-nya HTML. :D )

Semoga postingan saya tentang Cara Membuat Loading Blog dengan CSS & JavaScript yang saya bagikan ini bermanfaat untuk sobat blogger yang membutuhkan. Terima kasih telah meluangkan waktu untuk membaca Kumpulan Tutorial Blog 2014 yang saya bagikan ini.
Salam Blogger,
Kang Rian

Cara Membuat Archive/Sitemap Blog yang Responsive

Cara membuat Archive/Sitemap Blog yang Responsive- Blog yang baik, pasti memberikan kemudahan bagi pengunjung untuk menelusuri dan mencari berbagai artikel di blognya. Tidak hanya menggunakan widget archive default yang di sediakan oleh blogger, tetapi lebih baik dengan memasang archive/sitemap tersebut di halaman statis blog. Ini diperlukan untuk menampilkan secara keseluruhan artikel yang ada dengan di kelompokkan berdasarkan label/kategori yang kita berikan sebelumnya.

Hasil yang sudah jadi

PENTING! Bagi blog yang belum GO RESPONSIVE sebaiknya baca terlebih dahulu artikel cara membuat archive blog yang lebih baik. Mengapa? Karena archive/sitemap tersebut lebih cepat dibandingkan dengan sitemap yang lainnya.

Tak terbantahkan lagi, perkembangan zaman juga memberikan dampak terhadap perkembangan desain blog. Salah satunya dengan adanya responsive web design. Resposive web design adalah suatu methode pendekatan dalam proses design web site yang bertujuan untuk menghadirkan kemudahan dalam membaca dan melakukan navigasi dengan meminimalisasi proses resize, panning, dan scrolling baik saat website dilihat dari dekstop (PC) ataupun perangkat mobile lainnya (tablet dan smartphone) [sumber: ryanardi.com]. Maka bila ada orang yang menggunakan device seperti hp, PC, maupun smartphone, tampilan web tersebut akan menyesuaikan dengan sendirinya.

Memang bayak yang sudah membahas cara ini, tetapi kebanyakan cara yang disampaikan tidak mendukun desain web yang responsive. Oleh karena itu, di sini saya akan menjelaskan bagaimana cara membuat sitemap/archive/daftar isi di halaman statis tetapi juga responsive. Silahkan dilihat terlebih dahulu demonya.

PreviewResponsive Archive for Blogger
Untuk Melihat Tampilan Responsive dapat melihat di sini.

Cara Membuat Responsive Archive/Sitemap for Blogger di halaman statis

Login Blogger.com > Laman/Pages
Laman Baru/New Page > Blank Page/Laman Kosong
Masukkan judul yang sesuai, contoh: Daftar Artikel, Daftar Posting, Archive Blog, dll.
Tulis kata pengantar yang sesuai (boleh tidak diberikan).
Masuk ke dalam tab “HTML” yang beradap di samping kiri icon “Undo”
Masukkan kode di bawah ini:

<script src="https://googledrive.com/host/0BwGpfL5YSUPlckNBdDFQYjZlXzg" type="text/javascript"></script>
<script src="http://netfori.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
<style type="text/css">
.post-archive { width: 100%; padding: 20px 0; text-transform: capitalize; }
.post-archive h4 { border-bottom: 2px solid #EEEEEE; color: #333333; font-size: 20px; margin: 0 0 10px 2px; padding: 0 0 10px; }
.ct-columns-3 { -moz-column-count: 3; -moz-column-gap: 10px; -moz-column-rule: none; -webkit-column-count: 3; -webkit-column-gap: 10px; -webkit-column-rule: none; column-count: 3; column-gap: 10px; column-rule: none;}
.ct-columns-3 p { padding: 5px 0px; -moz-column-break-inside: avoid; -webkit-column-break-inside: avoid; -o-column-break-inside: avoid; -ms-column-break-inside: avoid; column-break-inside: avoid; display: inline-block; width: 100%; }
.ct-columns-3 p a { background: #fafafa; color: #333; display: block; border: 1px solid #FFFFFF; font-size: 14px; line-height: normal; outline: 1px solid #EEEEEE; padding: 10px 15px; -webkit-transition:all .25s ease-in-out; -moz-transition:all .25s ease-in-out; -o-transition:all .25s ease-in-out; transition:all .25s ease-in-out; }
.ct-columns-3 p a:hover { background: #4d90fe; color: #fff; }
@media screen and (max-width: 768px){ .ct-columns-3 { -moz-column-count: 1; -moz-column-gap: 0px; -moz-column-rule: none; -webkit-column-count: 1; -webkit-column-gap: 0px; -webkit-column-rule: none; column-count: 1; column-gap: 0px; column-rule: none; } } 
</style>

Ganti kode yang berwarna merah dengan url blog anda.
Ganti kode yang berwarna biru dengan kode warna html agar tampilan sesuai dengan warna template sobat. Untuk mendapatkan kodenya klik di sini. (disarankan)

7. Pada bagian “Options” pilih “Don't allow, hide existing”

8. Klik “Publish” dan selesai. Cek halaman tersebut untuk melihat hasilnya.

Demikian tutor singkat ini. Bila ada saran/masukan/pujian/kritikan silahkan komen di kotak komentar google+ di bawah ini. Terimakasih. Sumber di sini.

Cara Mengetahui Jumlah Subscribers Blog/Web Orang Lain

Cara mengetahui jumlah subscribers web/blog orang lain-Kita semua tahu kekuatan dari RSS (Rich Site Summary/Really Simple Syndication) Feed. RSS Feed berfungsi untuk mengirimkan artikel terbaru dari blog melalui email. Untuk berlangganan, pengunjung harus memasukkan emailnya di form yang sudah disediakan. Contahnya kotak warna biru di paling bawah postingan ini. Itu adalah kotak untuk berlangganan artikel dari Blog Netfori. Setelah memasukkan alamat email dan mengkonfirmasinya, maka RSS Feed akan menjalankan fungsinya sebagai pengantar artikel ke email tujuan.

Begitu pentingnya RSS Feed, maka hampir semua web/blog harus memilikinya.

Bagi para blogger dan admin web, semakin banyak jumlah subscribers semakin banyak pula yang akan membaca artikel blog kita secara konsisten. RSS subscribers akan mengirimkan artikel terbaru dari sang pemilik web tanpa memedulikan sang subscribers akan membacanya atau tidak. Jadi, interaksi itu dapat menciptakan dan memelihara hubungan dengan para pembaca/pengunjung blog.
Bagi para pengunjung, jika web/blog menawarkan RSS subscription, mereka dapat berlangganan blog tersebut, dan ketika blog tersebut meng-update artikelnya maka akan mendapatkan pemberitahuan ke email mereka. Ini menguntungkan pengunjung yang ingin mengetahui update artikel terbaru tanpa harus mengunjungi web terlebih dahulu. Cukup melihat notifikasi ada artikel terbaru lewat email.

Jumlah subscribers yang banyak juga dapat menarik perhatian para pengiklan dan sponsor blog. Semakin banyak jumlah subscribers semakin banyak pula yang akan membaca artikel terbaru blognya, ini logika sederhana. Maka dengan jumlah subscribers yang banyak akan berpengaruh positif terhadap blog atau web tersebut.

Banyak pemilik blog yang meletakkan FeedCount widget di blog mereka untuk menunjukkan jumlah subscribersnya. Tetapi apakah itu benar-benar asli? Bagaimana jika itu hanya bohongan? atau Bagaimana kita bisa percaya dengan jumlah tersebut? Itu lah beberapa pertanyaan keraguan ketika kita melihat suatu blog/web mempunyai jumlah subscribers yang sangat banyak. Mungkin mereka berbohong!

Dikarenakan beberapa masalah di atas, saya akan memebeberkan solusi jitu untuk mengetahui jumlah subscribers blog tersebut sebenarnya. Maka bagi siapapun yang ingin mengetahui jumlah asli subscibers (jumlah pelanggan) suatu blog atau web dapat mengikuti beberapa cara yang sangat mantab berikut ini:

Trik #1: URL Trick

Trik ini sangat sederhana, hanya saja kita harus mengetahui nama id feedburner blog/webnya. Untuk mengetahuinya lakukan cara-cara berikut ini.

Bagi yang sudah tahu silahkan loncat ke tahap selanjutnya.

Tentukan web yang ingin kita ketahui jumlah subscribersnya.
Temukan widget FeedCount pada blog tersbut. Contohnya gambar berikut. Setelah itu kita klik.

Lalu lihat url yang kita klik tadi. Contoh, http://feeds.feedburner.com/blogmashanif. Maka id tersebut adalah "blogmashanif"

Jika website yang ingin kita tahu telah tersinkron dengan RSS Feed via feedburner dan juga telah menggunakan FeedCount, maka kita dapat megetahui jumlah RSS Subscribers-nya dengan cara memasukkan URL ini:

http://feeds.feedburner.com/~fc/nama-id-feedburner

Hanya dengan memasukkan nama id feedburner setelah tulisan /~fc/ maka akan muncul jumlah subscribers-nya. Contoh punya saya, http://feeds.feedburner.com/~fc/netfori. Berikut gambarnya:

Gambar tersebut menunjukkan jumlah asli subscribers suatu blog dengan id yang sesuai. Ini lah data yang valid dan terpercaya.

Trik #2: Google Reader Trick

Cara di atas bekerja dengan baik bagi kebanyakan blog, tetapi bagi blog yang tidak menggunakan jasa feedburner, cara di atas tidak dapat berjalan. Maka solusinya adalah dengan menggunakan Google Reader. Berikut cara dan pembahasannya:

Pertama yang dilakuka sign-in dengan akun google anda ke google reader. Klik di sini
Lalu sebelah kiri ada tulisan All Items > Browse For Stuffs > Pilih Search (TAB) > Search By Keyword.

Masukkan kata kunci untuk web yang ingin kita ketahui jumlah subscribers-nya. Kata kuncinya sebagai berikut: http://example.com/feeds/posts/default. Contoh punya saya, http://netfori.blogspot.com/feeds/posts/default. Berikut gambarnya:

Setelah itu klik enter. Maka akan muncul data jumlah subscribers.

Google Reader akan menampilkan hasil datanya. Perhitungan Feed Subscribers Count yang muncul dalam Google Reader berdasarkan Google Reader + iGoogle + Google Desktop. Ini memang tidak dapat memberikan jumlah yang tepat tetapi paling tidak dapat memperkirakan banyaknya orang yang berlangganan.

Sekian pembahasan yang dapat saya sampaikan, mohon maaf jika terdapat kekurangan. Terimakasih ucapkan kepada Tuhan YME dan juga kepada blogmashanif, yang telah sudi berkenan menjadi contoh pembelajaran dalam artikel ini. Dapatkan artikel lainnya dengan subscibe email anda dalam kotak biru di bawah yang telah tersedia. Trik ini disarikan dari sini. Lihat juga Cara Membuat Gallery Gambar dengan Efek Keren Accordion dan 1001 Daftar Situs Social Bookmark Pagerank Tinggi 2013. Terimakasih.

Dunia Maya emang lebih #CARE dari pada Dunia Nyata !

Selamat malam sobat blogger , kali ini Beta sekedar mau curhat ! .. pusing mau posting juga posting apa .. :(

well, back to topic " Dunia Maya emang lebih Peduli dari pada Dunia Nyata ! " , waduh ? emang dunia nyata apa bedanya sama Dunia Maya yah ?

Hehe gini sob , setelah beta pikirkan selamaaaaaaaaaaa ini ! hidup mengalir di antara 2 dunia , yaitu dunia nyata dan dunia maya, ternyata di dunia maya beta jauh lebih banyak dapet ilmu pengetahuan ketiban di dunia nyata ..
mungkin karena dunia maya lebih kumplit kali yah media buat sharing nya ? jadi semua orang yang emang bener2 ikhlas buat berbagi bisa dengan mudahnya memberikan informasi / ilmu / dsb kepada orang-orang yang membutuhkan hal tersebut ..?

Tapi sob, setelah beta bandingin dengan kehidupan di dunia nyata .. ternyata jauh banget sama dunia maya yang asyik ini .. di dunia nyata banyak orang2 katakanlah yang mencampuri / hadir di hidup beta sendiri , susah banget dalam berbagi .. contohnya : " Si temen punya ilmu yang mereka miliki , tapi kok sama temen sendiri susah yah berbagi ilmu " bukan nya ilmu buat di amalkan kan ya sob? oke fine , mungkin Ilmu yang terklaim menjadi Jasa , haram hukum nya bila di amalkan .. yah , se'enggaknya kan kalo berbagi di dunia nyata lebih enak ! iya gak sob ? bisa sambil praktek .

balik ke dunia maya » Hmm, disini beta kebalik ! bukan temen , kenal pun cuman liat nickname + foto nya doang , kok disini beta ngerasa heran yah ? beliau ( orang yang suka berbagi di dunia maya ) kok dengan segitu ramah nya , baik nya , detail nya , membagikan ilmu2 yang emang bermanfaat buat beta / semua orang yah ? .. apa karena mereka rela berbagi demi Jumlah Visitor di blog nya dan Kualitas Adsense Space di blog nya ? .. hmm , beta rasa itu belum sebanding deh dengan jasa dari semua ilmu yang telah mereka berikan ..

yah .. jadi seperti itu lah gambaran tentang curhatan beta kali ini , dan mohon maaf kalo curhat.an beta gak mudah di mengerti ! sebab beta pun pusing harus mulai dari mana .. dan mengakhiri sampai mana ..

Curhatan beta ( Kang Rian on Blogger dari Bandung ) kali ini , terinspirasi dari sahabat blogger yang menginspirasi beta , katakanlah : Kang Ismet , Kang Satrio , Kompi Ajaib , dan masih banyak lagi .. hhe maaf , beta ngantuk gak bisa sebutin satu2 .! :D

sebelumnya terima kasih sudah membaca curhatan beta kali ini .. Salam blogger sob ! :)