Cara Daftar Dan Membuat Facebook Instant Articles Untuk Blogger

Cara Daftar Dan Membuat Facebook Instant Articles Untuk Blogspot

Sebelumnya, saya sudah menjelaskan panjang lebar tentang pengertian Instant Articles. Maka artikel lanjutan ini hanya akan berfokus pada hal-hal berbau teknis tentang cara daftar Facebook Instant Articles di Blogspot. Nggak usah basa-basi, langsung sikat saja tutorialnya. Oya, untuk pengguna Wordpress bisa coba baca artikel Cara Setting Facebook Instant Articles Untuk Wordpress.

F.A.Q (Frequently Asked Question)

Ini buat Blogger alias Blogspot kan? Bukan Wordpress?
Iya. Ini buat Blogger / Blogspot. Bukan Wordpress.

Blognya harus pake custom domain atau TLD dulu?
Nggak. Pake subdomain bawaan semisal domain.blogspot.com juga bisa kok. Nggak mesti beli domain segala.

Site feed wajib diset ke Full ya?
Nggak juga. Bisa diset Full, bisa diset Short. Baca dulu aja sampe abis.

Katanya kalau pake Blogger alias Blogspot lebih ribet ya dibanding Wordpress?
Iya, memang. Namanya juga gratisan. Terima aja. Yang penting udah ada panduan lengkapnya di artikel ini.

Cara Setting Facebook Instant Articles Di Blogspot / Blogger

Kamu WAJIB mempunyai Fanspage karena Instant Articles hanya bisa dibuat melalui Fanspage. Install juga aplikasi Facebook mobile (versi normal, bukan versi Lite) atau Pages Manager di smartphone biar gampang ngecek hasilnya.

Instant Articles hanya akan terbuka di aplikasi Facebook mobile dan Pages Manager saja. Jadi kalau sedang buka Facebook di FB Lite, browser handphone, apalagi di PC, tanda petir Instant Articles nggak bakal muncul. Artikel akan terbuka normal seperti tampilan aslinya.
Instant Articles hanya tersedia di perangkat iPhone and Android. Software yang dibutuhkan adalah Facebook for iPhone Versi 30.0 dan OS iOS 7.0 ke atas, atau Facebook for Android Versi 57 dan OS Jelly Bean keatas.

1. Setting Fanspage

Kalau belum punya Fanspage ya bikin dulu dong. Ikuti panduan di artikel cara membuat Fanspage Facebook.

Setelah punya Fanspage, buka alamat https://instantarticles.fb.com.

Pilih Fanspage yang akan dibuatkan Instant Articles. Centang juga box persetujuannya. Lalu klik tombol Access Instant Articles Tools.

Jika sukses, akan muncul pop-up baru. Klik saja Continue. Maka Fanspage kamu sudah mendapatkan akses Instant Articles.

Buka Fanspage dan masuk ke menu Publishing Tools.

Pada menu Instant Articles, pilih submenu Configuration.

Pada bagian Connect Your Site, pilih Authorize your site.
Klik untuk melihat ukuran lebih besar.

Akan terdapat sebuah kode meta tag. Contohnya kaya gini nih:
```
<meta property="fb:pages" content="106660612706164"/>
```
Copy kodenya untuk dimasukkan ke blog.

2. Verifikasi Blog

Buka akun Blogger dan pergi ke pengaturan HTML. Taruh kode tersebut DIBAWAH / SESUDAH <head>. Jangan lupa simpan pengaturan dengan klik tombol Save theme.

Kembali ke Facebook. Kalau sudah melakukan langkah diatas, masukkan alamat blog dan klik tombol Claim URL.

Kalau masih pakai subdomain bawaan Blogspot, masukkan 3 jenis variasi domain berikut biar lebih afdol.
namakamu.blogspot.com namakamu.blogspot.co.id namakamu.blogspot.pe (kadang subdomain Blogspot berpindah sendiri ke .pe)

3. Upload Logo

Trus upload logo dulu, karena biasanya akan muncul notifikasi error kalau belum upload logo. Jadi mending setting diawal.

Scroll kebawah sampai ke bagian Tools. Pilih Styles dan klik tulisan default untuk mengedit template bawaan. Kalau mau bikin template baru, klik tombol +Add Style. Tapi saya lebih memilih mengedit template bawaan biar lebih simple.

Pilih Logo lalu klik tombol Choose Logo untuk mulai mengupload. Gambar harus berekstensi .PNG dengan background transparan. Ukuran dimensi minimalnya adalah 690 x 132 pixels. Setelah selesai, klik Save di pojok kanan atas.
Klik untuk melihat ukuran lebih besar.

4. Setting Artikel

Masuk ke bagian penting, yaitu setting RSS Feed agar setiap postingan blog masuk ke Instant Articles. Ada dua cara yang bisa kamu coba: Otomatis dan Manual. Masing-masing punya kelebihan dan kekurangan masing-masing.

OTOMATIS
Kelebihan: Setiap artikel baru akan otomatis masuk ke Production Articles di Facebook Instant Articles.
Kekurangan: Saat ini Blogspot belum sepenuhnya mendukung konversi tag HTML biasa ke tag HTML Instant Articles. Meskipun artikel otomatis masuk ke Production Articles, kamu masih perlu kerja lagi untuk edit beberapa tag HTMLnya. Selain itu, Site Feed harus diset ke Full. Perlu dipikirkan matang-matang karena postingan blog bisa diambil seluruhnya oleh pencuri artikel (yang nggak tahu diri) kalau feed diset ke full.

MANUAL
Kelebihan: Feed nggak perlu diset full.
Kekurangan: Setiap artikel baru nggak bakal masuk otomatis ke Production Articles di Facebook Instant Articles. Kamu harus membuatnya manual seperti menulis artikel artikel dari awal.

Mau pilih yang mana? Itu sih terserah kamu. Kesamaan kedua metode diatas yaitu sama-sama harus kerja dua kali. Harap dimaklum ya kalau agak ribet. Blogspot nggak segampang Wordpress yang tinggal pake plugin dan semuanya bisa beres. Oke....lanjut ke penjelasan masing-masing metode.

4.1. Setting Metode Otomatis

Masuk ke akun Blogger. Pergi ke menu Settings » Other » Site feed » Allow Blog Feed » pilih Full. Kalau sudah, klik tombol Save settings.

Kembali ke pengaturan Instant Articles di Facebook. Di bagian Tools, pilih Production RSS Feed dan masukkan alamat RSS Feed ini:
```
https://www.igniel.com/feeds/posts/default?alt=rss
```
Ganti https://www.igniel.com dengan alamat blog masing-masing ya. Kalau sudah, klik tombol Save.

Tunggu beberapa saat sampai Facebook selesai merayapi blog lalu masuk ke submenu Production Articles. Taraaaa.....semua artikel sudah terimport secara otomatis. Biasanya nggak semua artikel bakal masuk sih. Contoh: artikel di blog ada 15. Bisa jadi yang masuk cuma 10.
Buat platform Blogspot sangat wajar kalau masih terdapat banyak error di artikel hasil import. Kaya screenshot dibawah ini nih, artikel saya masih banyak error yang ditandai dengan icon tanda seru berwarna kuning atau merah. Kalau iconnya disorot, akan muncul petunjuk bagian mana saja yang menjadi penyebab error. Tinggal dibenerin deh dengan mengklik icon pensil. Pastikan edit semua artikel yang terdapat icon tanda seru. Agar bisa diterima oleh Instant Articles, kamu harus mempunyai minimal 10 artikel yang nggak error.

Klik untuk melihat ukuran lebih besar.

4.2. Setting Metode Manual

Metode ini mengharuskan kamu menulis ulang semua artikelnya dari awal.

Kamu nggak perlu set Site feed ke Full. Cukup Short saja.

Masih di halaman pengaturan Instant Articles di Facebook, masuk ke submenu Production Articles.

Klik tombol +Create.

Akan muncul text editor. Tinggal tulis deh artikelnya disana. Tapi ingat hal wajib berikut:
1. Nggak bisa ngasal tulis artikel baru YANG BELUM DIPUBLISH DI BLOG karena di Instant Articles nanti kamu harus memasukkan URL canonical asli dari artikel.
2. Tag HTML harus diubah mengikuti format Instant Articles. Biar nggak pusing, saya kasih contoh dari tag HTML Instant Articles dibawah.

4.2.1. Contoh Tag HTML Instant Articles

<!doctype html>
<html lang="en" prefix="op: http://media.facebook.com/op#">
  <head>
    <meta charset="utf-8">
    <!-- URL asli dari artikel yang sudah diterbitkan di blog. Ganti dengan URL artikel kamu sendiri -->
    <link rel="canonical" href="https://www.igniel.com/article.html">
    <meta property="op:markup_version" content="v1.0">
  </head>
  <body>
    <article>
      <header>
        <!-- Judul dan sub judul utama dari Instant Articles -->
        <h1>Judul Artikel</h1>
        <h2>Sub judul atau deskripsi</h2>
        <!-- Kicker. Biasanya dipakai untuk menuliskan kategori -->
        <h3 class="op-kicker">Kategori</h3>

        <!-- Tanggal dan waktu ketika artikel pertama kali diterbitkan di blog -->
        <time class="op-published" datetime="2019-01-10T08:00Z">10 Januari 2019, 8:00 AM</time>

        <!-- Tanggal dan waktu ketika artikel terakhir kali diupdate atau diedit -->
        <time class="op-modified" dateTime="2014-01-17T04:44:16Z">17 Januari 2019, 4:44 PM</time>

        <!-- Nama author -->
        <!-- Versi Satu: Pake URL profil Facebook -->
        <address>
          <a rel="facebook" href="http://www.facebook.com/ignielcom">igniel.com</a>
          igniel.com adalah blog yang berisi info seputar media sosial dan tutorial Blogspot.
        </address>
        <!-- Versi Dua: Nggak pake URL profil Facebook -->
        <address>
          <a>igniel.com</a>
          igniel.com adalah blog yang berisi info seputar media sosial dan tutorial Blogspot.
        </address>

        <!-- Gambar yang menjadi cover utama dari Instant Articles -->
        <figure>
          <img src="https://www.igniel.com/gambar/cover.jpg"/>
          <figcaption>Caption dari gambar</figcaption>
        </figure>     

      </header>

      <!-- START: ISI UTAMA ARTIKEL -->

      <!-- Semua text harus terbalut dalam tag <p> -->
      <p>Paragraf satu. Blablablablabla....</p>
      <p>Paragraf dua. Blablablba.....</p>
      <p>Paragraf tiga. Terus kaya gini sampai kelar.</p>

      <!-- Jika ingin masukkan gambar -->
      <figure>
          <img src="http://www.igniel.com/gambar/gambar1.jpg"/>
      </figure>

      <!-- Jika ingin masukkan video -->
      <figure>
        <video>
          <source src="http://www.igniel.com/video/video.mp4" type="video/mp4" />
        </video>
      </figure>

      <!-- Jika ingin masukkan list -->
      <ol>
        <li>Tag HTMLnya saja saja sih.</li>
        <li>Tapi biasanya nggak bisa banyak-banyak kasih list.</li>
      </ol>

      <!-- STOP: ISI UTAMA ARTIKEL -->

      <footer>
        <!-- Copyright atau tambahan tulisan kecil di footer -->
        <small>© Igniel</small>
      </footer>
    </article>
  </body>
</html>

Ganti dan sesuaikan isinya dengan artikel punya kamu sendiri ya. Dan pastinya nggak semua tag HTML diatas perlu dipake. Kalau nggak mau pake video, tinggal hapus tag HTML videonya. Begitupun kalau nggak mau pake copyright, ya tinggal hapus. Kalau sudah membuat artikel dengan format Instant Articles, copy tulisannya ke text editor yang tadi muncul trus simpan dengan klik tombol Save di pojok kanan atas.

Cara Membuat Facebook Instant Articles Di Blogger

Klik untuk melihat ukuran lebih besar.

5. Submit dan Ajukan Review

Setelah ada 10 artikel yang nggak error, kamu bisa mengajukan review. Masuk ke submenu Configuration dan klik tombol Submit for Review. Disana tertulis prosesnya butuh waktu 3-5 hari kerja. Tapi menurut pengalaman pribadi, cuma sehari juga udah keluar hasilnya.

Selama masa review, rajin-rajinlah cek halaman Configuration karena nggak ada notif ketika diterima, ditolak, atau diminta submit ulang. Kadang masih terdapat sedikit kesalahan di format penulisan artikel yang menyebabkan proses review tertunda. Kamu harus mengedit artikelnya lebih dulu untuk bisa mengajukan review ulang. Setelah diedit, klik tombol Resubmit for Review. Kalau diterima, ya Alhamdulillah. Kalau ditolak, ya coba terus.

Kalau diterima, tampilannya bakal kaya gini.

6. Terbitkan Artikel

Ingat, artikel yang sudah dibuat di tahap nomor 4 belum diterbitkan lho. Karena saat itu artikelnya hanya dibuat untuk proses review saja. Sekarang setelah diterima, kamu sudah bisa menerbitkannya agar bisa dibaca orang lain. Caranya kaya gini:

Masuk ke submenu Production Articles.

Centang kotak checkbox yang ada di paling atas tabel agar artikel terpilih semua.

Pada tombol Actions, pilih Publish. Maka semua proses telah selesai.

Cara Buat Instant Articles Facebook Untuk Blogger

Klik untuk melihat ukuran lebih besar.

Perbandingan artikel sebelum dan sesudah diaktifkan Instant Articles. Akan muncul tanda petir ketika dilihat di aplikasi Facebook mobile.

How To Setup Facebook Instant Articles For Blogger Blogspot

7. Monetasi Dengan Audience Network

Bagian ini pasti kamu suka dan paling ditunggu. Yang membuat Instant Articles dapat menghasilkan dollar adalah program yang bernama Audience Network. Kamu bisa baca di artikel lanjutan Cara Pasang Iklan Audience Network Di Instant Articles Untuk Blogger.

Sekian tutorial lengkap tentang cara membuat Instant Articles di Blogger yang baik dan benar. Semoga komplit dan jelas banget. Budayakan komen kalau sudah mampir.

https://developers.facebook.com/docs/instant-articles/guides/articlecreate