Cara Gampang Mengedit Postingan Artikel Blog AMP Agar Valid AMP HTML

Cara mengedit postingan blog amp ini kami tulis karena masih banyak para blogger pemula yang mengalami kebingungan di dalam mengedit artikel ketika ingin upgrade ke blog yang valid amp. kenapa saya bilang upgrade? karena memang menurut saya pribadi blog AMP adalah blog yang akan lebih maju dan lebih di utamakan google di dalam mesin pemcarian milik google.


Ketika dari awal menggunakan template blog amp tentu saja hal ini tidak akan terlalu merepotkan, karena hanya menulis artikel seperti biasa saja. kalaupun ada perubahan mungkin hanya di dalam pemasangan gambar dan video (memasukan video youtube ke dalam blog amp).

Tetapi bagi bloger yang sudah lama membuat blog dan tiba-tiba ingin menggunakan template amp untuk memenuhi recomendasi dari google maka akan mengalami kesulitan dalam mengedit setiap artikel yang telah di tulis dan di publish. karena jika artikel tersebut dibiarkan saja akan sangat mempengaruhi performace dari blog tersebut. dan takutnya posisi serp justru akan turun.
Nah agar hal tersebut tidak terjadi maka sekarang kita bahas bagaimana cara mengedit artikel postingan blog amp agar valid amp html. Lanjut...

Cara Mengedit Artikel Postingan Blog AMP

1. Pertama adalah cara mengedit artikel postingan blog amp : saya sarankan kepada teman-teman blogger untuk membuat catatan di dalam notepad laptop untuk mencatat (mengcopy) kode-kode amp html. supaya ketika kita membutuhkanya kita tidak perlu lagi browsing hanya sekedar untuk mencari tahu kode bagaimana cara memasang gambar misalnya. hal tersebut akan membuang banyak waktu. untuk mencari kode-kode amp, temen-temen bisa langsung mencarinya kesini https://www.ampproject.org/docs/reference/components.

Setelah mendapatkan kode-kode amp yang di perlukan, silahkan masuk ke postingan bloger dan edit postingan yang di inginkan. yang pertama dan merepotkan biasanya adalah menghilangkan CSS "Style" inline pada tag "div", misalnya adalah <div style="text-align: justify;"> dan msih banyak lagi.

Hal ini akan merepotkan dan memakan banyak waktu jika kita melakukanya secara manual, maka kami sarankan temen-temen semua untuk memakai dan memanfaatkan ekstensi browser dari google chrome yang namanya adalah ekstensi Search and replace klik disini untuk mendownloadnya.

Silahkan cari dan instal terlebih dahulu ekstensi tersebut, jika telah berhasil maka akan ada satu icon di pojok kanan dari broser kalian seperti pada gambar di atas.

Untuk cara menggunakanya silahkan kopi CSS style seperti <div style="text-align: justify;"> di paste pada kotak pertama dari ekstensi search and replace, lalu isi kotak kedua dengan "div", Jangan lupa untuk mencentang kedua kotak (match case? dan atau Input fields only?) pokoknya ikuti aja seperti gambar di atas.

hehe sudah bingung?? itu baru hal yang pertama, masih ada kelanjutanya bos. ayo simak lagi caranya!! harus semangat ya..

2. Cara memasukan gambar pada blog AMP. nah untuk memasukan gambar pada postingan blog maka pertama-tama silahkan masukan gambar seperti biasanya ketika kita mengedit atau membuat artikel blog pada template biasa (non amp).


Kemudian hilangkan link pada gambar tersebut (lihat gambar di atas!). dan selanjutnya untuk membuat gambar tersebut bisa valid amp, maka silahkan anda kopi Html di bawah ini

<amp-img src="gambar.jpg"width="1000"height="564"layout="responsive"alt="alt image"></amp-img>

Kemudian silahkan masuk ke mode HTML dan Copy kode tersebut pada tempat dimana kalian ingin memunculkan gambar tersebut. ganti tulisan yang "gambar.jpg" dengan alamat gambar ya ng tadi telah dimasukan di dalam blog. dan ganti "alt image" dengan tag atau keyword yang kalian inginkan untuk gambar tersebut. biar jelas silahkan lihat gambar dibawah. dan jangan lupa untuk menghapus gambar yang awal, karena sudah kita ganti dengan kode di atas.
Baca Juga : Keuntungan menjadi blogger


3. Cara memasukan video dari youtube ke dalam blog amp : selanjutnya terasa tidak lengkap jika blog tutorial tidak memasukan video kedalam postinganya, maka jika anda mempunyai blog tentang tutorial, anda wajib mengetahui tentang bagaimana cara meng-Embed video kedalam sebuah artikel pada blog amp ini. pertama silahkan anda masuk kedalam HTML mode pada editan postingan blogger. lalu silahkan anda copy CSS di bawah ini :

<amp-youtube data-videoid="19BRLBj7IYg" height="270" layout="responsive" width="480"></amp-youtube>

Silahkan ganti tulisan "19BRLBj7IYg" tersebut dengan id video yang ingin anda embed dari youtube. bagaimana?? mudah atau sulit? bagi anda yang pertama menggunakan template blog amp mungkin akan merasa kesulitan dalam mengedit postingan, namun seiring berjalanya waktu maka hal ini bukanlah hal yang sesulit seperti apa yang saya tulis ini hehe... untuk lebih mudahnya silahkan lihat video dari kompiAjaib ini tentang bagaimana mengedit postingan pada blog amp. karena saya pun belajar dari video ini juga Semoga bermanfaat dan terimakasih sudah berkunjung

Artikel Terkait

Cara Gampang Mengedit Postingan Artikel Blog AMP Agar Valid AMP HTML
4/ 5
Oleh

Berlangganan

Suka dengan artikel di atas? Silakan berlangganan gratis via email

Silahkan berkomentar dengan baik dan sopan :D