Cara membuat ekstensi SEO Chrome menggunakan ChatGPT

Ekstensi Chrome menyediakan cara cepat dan mudah untuk menjalankan tugas yang membosankan dan berulang. Ekstensi bisa menjadi penghemat waktu yang sangat besar dalam SEO. Namun masih banyak yang tidak fokus untuk membangunnya.

Salah satu alasannya adalah beberapa pemasar tidak dapat membuat kode alat yang rumit, sehingga mereka menggunakan alat apa pun yang tersedia. Meskipun demikian, Anda tidak selalu perlu menginvestasikan waktu untuk mempelajari keterampilan yang sulit atau membelanjakan uang untuk pengembang yang mahal untuk membuat alat baru yang rumit.

Sekarang, Anda dapat menggunakan ChatGPT untuk membuat ekstensi SEO kustom Anda sendiri, mengunggahnya di Google, dan menggunakannya setiap hari secara gratis. Begini caranya.

Langkah 1: Tentukan persyaratan

Memiliki pemahaman yang jelas tentang apa yang Anda ingin ekstensi Chrome Anda lakukan adalah langkah pertama dalam proses ini. Saya akan menyarankan pemasar konten untuk memikirkan hal ini sebelum mereka mulai meminta ChatGPT dan menuliskan persyaratan yang spesifik dan jelas.

Persyaratan biasanya terdiri dari dua jenis:

• Tugas : Apa yang perlu dilakukan ekstensi Anda?
• Fitur : Bagaimana Anda ingin ekstensi menyajikan informasi kepada Anda?

Penafian : Proses ini dimaksudkan untuk membuat ekstensi yang hanya berfungsi di komputer Anda, yang berarti Anda tidak akan dapat menjualnya atau membuatnya tersedia di Toko Web Chrome. Agar hal itu terjadi, Anda harus mematuhi pedoman Google, yang dapat ditemukan di sini.

Untuk panduan ini, kami akan menggunakan contoh ekstensi SEO Chrome sederhana yang saya buat sendiri. Jadi inilah persyaratan saya.

Persyaratan informasi

Saya ingin ekstensi SEO Chrome saya memberi tahu saya semua elemen halaman untuk ikhtisar singkat halaman, tanpa harus masuk ke kode backend halaman untuk memeriksanya:

• Judul halaman
• Deskripsi meta
• Salin tajuk
• Tautan Internal, termasuk daftar URL
• Gambar, termasuk URL
• URL kanonis

Persyaratan fitur dan perilaku

Saya ingin ekstensi saya menampilkan jendela munculan saat saya mengeklik ikon ekstensi di browser Chrome.

Di bawah ini Anda dapat melihat apa yang akan kami buat dan bagaimana tampilannya di Chrome.

Catatan: Ini adalah versi dasar ekstensi yang tidak menyertakan gaya CSS untuk kemudahan. Apa yang kami fokuskan dalam panduan ini adalah fungsionalitas sebenarnya, bukan gayanya.

Seperti yang Anda lihat pada gambar di atas, Anda harus memastikan bahwa hasil ekstensi akan terlihat oleh Anda di tab Chrome sebagai jendela munculan.

Sebagian besar ekstensi SEO bekerja dengan cara ini, mereka memberi Anda informasi yang Anda butuhkan di jendela pop-up saat Anda mengklik ikon ekstensi.

Langkah 2: Tulis deskripsi mendetail untuk ChatGPT

Sekarang setelah Anda siap untuk meminta ekstensi SEO potensial, Anda dapat menuju ke ChatGPT untuk menulis petunjuk mendetail. Sekali lagi, permintaan Anda harus sespesifik dan sedetail mungkin.

Kebanyakan prompt yang saya lihat digunakan pemasar tidak panjang, sangat pendek. Dan dari prompt singkat, Anda akan mendapatkan hasil yang buruk.

Inilah cara Anda melakukannya:

Pertama, Anda perlu memberi ChatGPT beberapa tujuan. Untuk melakukannya, Anda dapat menggunakan persyaratan yang sama seperti yang kita lihat di Langkah 1 selain baris perintah:

• “Tuliskan saya kode ekstensi Chrome yang membantu saya mengidentifikasi elemen SEO di halaman di situs web mana pun. Elemen untuk diidentifikasi: H1, H2, H3, judul halaman, deskripsi meta, URL kanonis, nomor H1 dan H2 dan jumlah tautan internal (termasuk URL).”

Sekarang setelah Anda memberi ChatGPT tujuan yang ingin Anda capai, saatnya untuk menentukan dengan tepat bagaimana Anda membutuhkan ekstensi Anda untuk berperilaku. Untuk ini, kami akan menggunakan fitur jendela pop-up dengan tombol. Inilah cara Anda dapat melakukan bagian ini:

• “Fitur dari ekstensi Chrome: ketika ekstensi diklik, sebuah jendela akan muncul. Jendela tersebut menyertakan menu yang dapat diklik. Di menu, Anda menunjukkan kepada saya tiga tombol. Tombol pertama menunjukkan kepada saya petunjuk tentang cara menggunakan ekstensi. Di tombol kedua, saya melihat H1, H2, H3, judul halaman, deskripsi meta, dan URL kanonis. Di tombol ketiga, saya melihat nomor H1 dan H2, jumlah tautan internal (termasuk URL).”

Kita harus sangat spesifik tentang apa yang ingin kita capai. Untuk melakukan ini, Anda harus menambahkan paragraf terakhir dari perintah yang menentukan cara mengunggah perintah.

• "Beri saya setiap file secara terpisah dan dengan nama mereka."

Dengan cara ini, Anda meminta ChatGPT untuk membagi file menjadi beberapa bagian. Ini penting karena Langkah 4. Jadi bertahanlah di sana.

Langkah 3: Minta ChatGPT untuk menulis kode

Terakhir, saatnya untuk mengambil semua kalimat yang kita tulis, menyalinnya, dan menempelkannya ke ChatGPT:

Salah satu fungsi terbaik dari ChatGPT adalah kemampuan menulis kode tanpa masalah.

Itu sebabnya, menurut instruksi kami, ChatGPT akan memberi Anda empat kode terpisah.

Catatan : Saat Anda membuat ekstensi Chrome baru, biasanya Anda perlu menyediakan beberapa jenis file, tergantung seberapa rumitnya. Untuk contoh ini, kami hanya memerlukan empat jenis file untuk diunggah di dalam Akun Chrome:

• Manifest.json
• Munculan.html
• Munculan.js
• Konten.js

Menggunakan ChatGPT berarti pemasar tidak perlu mempelajari cara membuat file teknis ini, dan itulah inti dari panduan ini, tetapi tetap penting untuk mengetahui kegunaannya.

Selain itu, saya menyarankan pakar pemasaran digital untuk mempelajari sebanyak mungkin tentang file ini karena mereka perlu memecahkan masalah teknis yang mungkin terjadi dan mencari cara agar ekstensi mereka berfungsi lebih baik. Google memiliki panduan khusus tentang Tindakan Browser Chrome jika Anda ingin mempelajari lebih lanjut.

Manifest.json

File manifest.json adalah file konfigurasi yang diperlukan untuk setiap ekstensi Chrome.

Ini berisi metadata tentang ekstensi, seperti nama, versi, deskripsi, ikon, dan izinnya. Itu juga menentukan file popup default yang akan ditampilkan saat ekstensi diklik.

Munculan.html

File popup.html mewakili antarmuka pengguna (UI) ekstensi Chrome. Ini menentukan tata letak dan konten yang akan ditampilkan saat ikon ekstensi diklik.

Dalam hal ini, termasuk tombol untuk petunjuk, elemen SEO, dan statistik, serta bagian hasil untuk menampilkan informasi yang dikumpulkan.

Munculan JS

File popup.js berisi kode JavaScript yang berinteraksi dengan UI ekstensi Chrome.

Ini menangani klik tombol dan mengirim pesan ke skrip konten (tidak termasuk dalam kode yang disediakan) untuk mengambil elemen SEO dari halaman web yang sedang aktif.

Itu juga memperbarui UI untuk menampilkan informasi yang diambil di bagian hasil saat tombol yang sesuai diklik.

Konten.js

File content.js bertanggung jawab untuk berinteraksi dengan konten halaman web dan mengekstraksi data yang diperlukan.

Dalam hal ini, ia mendengarkan pesan dari sembulan dan melakukan tugas.

Dapatkan buletin pencarian harian yang diandalkan pemasar.

Memproses ... tunggu sebentar.

LANGGANAN

Lihat persyaratan.

Langkah 4: Ekspor kode ChatGPT ke dalam file

Sekarang setelah kami memiliki kode dan tiga jenis file, langkah selanjutnya adalah mengunduh informasi file ini ke dalam format yang dapat dicerna untuk Ekstensi Chrome.

Inilah cara Anda dapat melakukannya:

Unduh aplikasi Sublime Text

Sublime Text adalah editor yang dapat dibagikan yang secara native mendukung semua bahasa pemrograman dan bahasa markup. Pengguna dapat mengunduh file dan mengunggahnya di tempat lain.

Salin dan tempel kode

Sekarang setelah kita memiliki kode dan Sublime Text, kita perlu menyalin kode dari ChatGPT dan menempelkannya ke tab Sublime Text yang diperlukan, sebelum kita dapat mengunduhnya di desktop kita.

Di setiap tab terpisah, kami akan menempelkan kode:

Setelah Anda menekan "Tempel", terkadang akan ada tab tanpa judul yang terlihat seperti ini;

Perlu disebutkan bahwa dalam contoh kode yang saya gunakan untuk panduan ini, aplikasi Sublime Text tidak mengambil judul secara otomatis, jadi Anda harus menambahkannya secara manual.

Saat Anda menyimpan file di desktop, Anda dapat mengubah nama file. Namun, ini tidak akan memengaruhi ekstensi Anda.

Anda dapat menyimpan semua file ke dalam folder tertentu yang dapat Anda beri nama "Ekstensi SEO Saya" atau semacamnya.

Langkah 5: Unggah file ke akun ekstensi Chrome

Sekarang setelah kita menyelesaikan bagian tersulit dari panduan ini, menulis kode, saatnya mengunggah file ke akun Anda.

Untuk melakukannya, Anda perlu membuka dasbor ekstensi Chrome di sini: chrome://extensions/

Begitu masuk, ikuti langkah-langkah ini untuk mengunggah file Anda dengan benar:

• Aktifkan "Mode pengembang" di kanan atas browser Anda. Ini akan memungkinkan Anda untuk membuka fungsi unggah.

• Klik "Load Unpacked" untuk menemukan dan memilih 4 file Anda untuk diunggah.

Saat Anda menekan "Load Unpacked", jendela ini akan terbuka jika Anda menggunakan Mac.

Unggah keempat file ke dasbor ekstensi Chrome. Jika Anda telah melakukan semuanya dengan benar, Anda akan melihat ekstensi Anda dalam daftar seperti ini:

Pada titik ini, ekstensi Anda hampir siap untuk diuji.

Kami membuat ekstensi dengan tiga tombol:

• Tombol instruksi untuk mempelajari cara menggunakannya.
• Tombol elemen SEO pada halaman.
• Tombol Tautan.

Setiap tombol yang Anda klik akan memberi Anda kemampuan untuk membaca informasi di halaman dan membuat penilaian cepat apakah halaman dioptimalkan dengan benar untuk pencarian.

Langkah 6: Memecahkan masalah dan membersihkan kode

Jangan khawatir jika Anda melihat kesalahan pada ekstensi Chrome Anda, ini tidak dapat dihindari tetapi dapat diperbaiki dengan mudah.

Dengan versi ChatGPT saat ini, kode mengacu pada pedoman Google sebelum Desember 2021, dan banyak hal berubah sejak saat itu.

Versi manifes yang tidak digunakan lagi

Ini berarti kode tersebut mungkin sudah lama dan tidak diperbarui ke versi terbaru persyaratan ekstensi Chrome untuk file manifes Anda.

Salah satu kesalahan ini menunjukkan bahwa file Manifest.json tidak digunakan lagi, yang berarti Google ingin Anda memperbarui mulai Januari 2023.

Sangat mungkin Anda mengalami jenis kesalahan ini:

Untuk memperbaiki masalah ini, yang harus Anda lakukan adalah memilih "manifest_version": 2 di file Sublime Text Anda dan mengganti "2" dengan "3", yang merupakan versi terbaru.

Setelah selesai, unggah ekstensi lagi.

Gagal memuat ekstensi

Sangat penting untuk menghapus referensi apa pun ke ikon dan gambar.

Jika tidak, Anda akan mendapatkan pesan kesalahan yang mengatakan "gagal memuat ekstensi". Ini karena kami belum menentukan URL untuk ikon dan gambar ekstensi.

Namun dalam contoh ini, kita tidak perlu menambahkan gambar atau ikon apa pun, jadi masuk akal untuk menghapus bagian kode yang memerlukannya.

Inilah cara Anda melakukannya:

• Buka file Manifest.json.
• Temukan baris kode yang mengacu pada ikon. Dalam contoh saya, garisnya adalah 6 sampai 10 dan 16 sampai 20

• Hapus baris ini dari kode dan simpan file Anda.
• Kemudian upload lagi di dashboard.

Kali ini, tanpa kesalahan ChatGPT, kita harus memiliki ekstensi yang bersih dan benar yang siap diuji lagi.

Jika Anda melakukan semuanya dengan benar, inilah yang akan Anda lihat – atau sesuatu yang sangat mirip:

Mulailah membuat ekstensi SEO Chrome Anda sendiri

Jika Anda gagal lagi dan lagi, banyak hal bisa menjadi sangat membuat frustrasi, terutama jika Anda tidak tahu cara membuat kode. Saya tahu karena saya pernah ke sana.

Juga, ingatlah bahwa dengan AI, tidak ada aturan khusus untuk menulis deskripsi yang tepat tentang apa yang Anda butuhkan. Anda mungkin perlu memperbarui permintaan Anda beberapa kali agar berfungsi sesuai kebutuhan.

Inilah yang dapat Anda lakukan untuk mengurangi kesalahan dan mencoba memperbaikinya:

• Salin kesalahan dan tempel langsung ke ChatGPT, minta untuk memperbaikinya. Biasanya alat ini sangat bagus dalam menjelaskan apa yang salah dengan kode secara sederhana. Kemudian lakukan perbaikan yang direkomendasikan.
• Coba hapus beberapa persyaratan ekstensi jika Anda merasa kode Anda terlalu panjang dan rumit. Mulai dari yang kecil. Mungkin buat ekstensi saja untuk mengetahui judul halaman. Setelah berhasil diuji, tambahkan persyaratan baru dan uji lagi.
• Jika ChatGPT tidak memberi Anda solusi yang baik, gunakan Google lama yang baik. Kemungkinan banyak orang sebelum Anda menyelesaikannya.

Mudah-mudahan, dengan panduan mendetail ini, Anda dapat mulai memanfaatkan kekuatan ChatGPT dan mempelajari cara membuat ekstensi SEO berikutnya.