Meskipun disarankan untuk menggunakan teks sebagai tautan, daripada gambar, karena menawarkan kemudahan untuk ditemukan dengan lebih baik, sedikit variasi juga tidak akan merugikan siapa pun.
Menyiapkan gambar HTML yang dapat diklik memberi pengunjung blog atau situs web Anda sedikit bakat visual sambil memberikan cara untuk menautkan ke halaman terkait
Jika Anda ingin membuat tautan gambar HTML, kami akan menunjukkan kepada Anda metode paling mudah yang tersedia untuk melakukannya
Isi
Kode HTML Gambar yang Dapat Diklik
Jika Anda ingin menggunakan gambar untuk HTML yang dapat diklik, ikuti langkah-langkah dalam tutorial di bawah ini
Atau, tonton video ikhtisar tentang cara membuat gambar yang dapat diklik menggunakan kode HTML
1. Pilih gambar yang sesuai
Sebaiknya pilih gambar yang mencerminkan tautan yang ingin Anda arahkan
Tautan tombol HTML paling baik disajikan dengan gambar tombol bersama dengan nama halaman tempatnya berada
Ikon amplop atau pesan paling baik mewakili tautan email HTML, dan seterusnya
Tidak ada yang menghentikan Anda untuk menggunakan gambar apa pun yang Anda inginkan, tetapi lebih baik pikirkan tentang pengunjung situs Anda dan bagaimana Anda ingin mengarahkan mereka
2. Optimalkan ukuran gambar
Jika Anda sering berencana menambahkan file HTML gambar, sebaiknya kurangi ukuran gambar yang Anda gunakan
Ukuran file yang besar akan memperlambat halaman web, dan ini akan mulai bertambah pada akhirnya
Setiap editor gambar yang bagus akan memiliki pengubah ukuran gambar
Jika Anda tidak memiliki editor gambar, Anda dapat menggunakan editor online gratis, seperti PicResize. com atau ResizeImage. bersih untuk melakukannya untuk Anda
3. Unggah gambar ke Situs Hosting gambar
Untuk menggunakan gambar sebagai tautan yang dapat diklik, Anda harus mendapatkan kode tautan HTML-nya
Untuk melakukan ini, Anda harus mengunggah gambar secara online
Ada banyak opsi untuk melakukan ini, seperti Dropbox, Imgur, atau bahkan Foto Google
Selama Anda bisa mendapatkan URL gambarnya, maka tidak apa-apa
Dapatkan URL yang ingin Anda tautkan
4. Masukkan kode HTML berikut
Setelah Anda memiliki tautan gambar dan URL halaman yang ingin Anda tautkan, Anda harus mengetikkan kode ini
<a href=”URL of Website You want to Link”> <image src=”URL of your image” alt=”an image description”> </a>Ini adalah kode HTML gambar sisipan yang memberikan alamat URL ke gambar itu sendiri
Ganti URL seperti yang ditunjukkan pada kode di atas, tetapi pastikan untuk tetap menggunakan tanda kutip
Teks alternatif ditujukan bagi mereka yang tidak dapat melihat gambar untuk mengetahui tentang tautan yang seharusnya
Metode Alternatif
Jika Anda menggunakan WordPress sebagai platform manajemen konten, maka metode yang lebih mudah tersedia untuk Anda
Teknik ini adalah sebagai berikut
- Unduh gambar yang ingin Anda gunakan di komputer Anda. Pastikan untuk mengoptimalkan ukuran gambar karena akan bertambah seiring waktu
- Buka Dasbor WordPress Anda
- Pada menu Dasbor di sebelah kiri, klik Posting
- Klik Add New, baik pada menu atau pada tombol di sebelah kanan
- Klik tombol + di bawah teks Tambahkan Judul
- Klik pada Gambar. Jika Anda tidak dapat melihat ikon Gambar, klik Telusuri Semua dan gulir ke bawah hingga Anda menemukannya
- Unggah gambar yang Anda pilih. Alternatifnya, jika gambar ada di folder media Anda, atau Anda mengetahui URL gambar Anda, Anda juga dapat menggunakannya
- Setelah diunggah, klik ikon Edit Tautan di atas gambar
- Ketikkan URL tempat Anda ingin menautkan gambar
- Tekan Enter untuk menerapkan. Anda dapat menekan Pratinjau di sudut kanan atas untuk melihat gambar yang dapat diklik seperti yang akan muncul di halaman web Anda
Terbaik Digunakan dalam Moderasi
Menggunakan gambar HTML yang dapat diklik adalah cara yang bagus untuk membumbui blog atau halaman web
Itu menarik perhatian pengunjung dan dapat mengarahkan aliran lalu lintas situs web Anda ke tempat yang Anda inginkan
Membuat gambar Anda dapat diklik dapat menambahkan fungsionalitas ekstra ke proyek atau halaman Anda di EngagementHQ. Dengan melakukan ini, Anda akan dapat mengarahkan komunitas Anda ke informasi tambahan untuk membantu memberi tahu mereka tentang tujuan proyek Anda
Ada dua cara utama untuk membuat gambar dapat diklik di EngagementHQ.
Gunakan editor teks dan ikon sisipkan gambar
Gunakan Kode HTML di dalam tampilan kode
Memutuskan opsi mana yang akan dipilih akan bergantung pada tempat Anda mencoba membuat gambar Anda dapat diklik. Namun untuk bagian terbaiknya, hanya ada sedikit perbedaan antara kedua metode tersebut, kecuali yang satu mengharuskan Anda untuk memahami sintaks HTML dasar dan yang lainnya hanya membuatnya untuk Anda.
Menggunakan Editor teks
Untuk menggunakan editor teks agar gambar Anda dapat diklik, Anda perlu melakukan hal berikut;
Klik di area deskripsi halaman proyek Anda
Gunakan ikon gambar untuk menyisipkan gambar Anda
Klik pada gambar, dan di opsi, klik 'Sisipkan tautan'
Tambahkan URL tempat Anda ingin gambar ditautkan dan pilih opsi untuk membuka di tab baru jika diperlukan
Menggunakan Kode HTML
Menambahkan kode HTML ke proyek Anda adalah cara lain untuk membuat gambar dapat diklik. Untuk melakukan ini, Anda perlu memahami sintaks dasar. Anda dapat menggunakan HTML di mana pun Anda dapat beralih ke tampilan kode termasuk;
Editor teks
Menggunakan widget khusus
Dalam jenis pertanyaan tajuk survei
Widget gaya bebas beranda
Sebelum Anda dapat menyisipkan gambar yang dapat diklik menggunakan HTML, Anda harus memastikan bahwa gambar Anda sudah tersedia online karena Anda perlu menyalin URL gambar. Ini bisa di galeri foto Anda atau situs eksternal. Jika ada di galeri foto, silakan merujuk ke artikel ini tentang cara mendapatkan lokasi gambar yang benar
Untuk menambahkan gambar yang dapat diklik menggunakan HTML, Anda dapat menggunakan kode berikut
<a href="insert destination URL here"><img src="insert image location here" title="insert title" alt="insert description here"></a>_Ganti teks dalam tanda kutip seperti di bawah ini
masukkan URL tujuan di sini. Ganti ini dengan tautan sebenarnya, tempat Anda ingin mengarahkan pengunjung saat mereka mengeklik gambar
masukkan lokasi gambar di sini. Ganti ini dengan lokasi gambar yang ingin Anda buat dapat diklik (karenanya 'img src'. src adalah singkatan dari sumber).
masukkan judul. ini untuk aksesibilitas - untuk e. g. orang yang menggunakan pembaca layar, oleh karena itu kami merekomendasikan sebagai praktik yang baik untuk memberi judul pada gambar
masukkan deskripsi di sini. Ganti ini dengan deskripsi alternatif. Ini juga penting untuk alasan aksesibilitas seperti di atas
Salin dan tempel kode ini, setelah mengeklik ikon di editor.
Temukan detail berbagai jenis file yang kompatibel dengan EnagementHQ di sini
CATATAN - Anda juga memiliki opsi untuk menggunakan widget khusus untuk membuat gambar yang dapat diklik seperti yang dijelaskan secara mendetail di artikel Menggunakan widget khusus untuk menampilkan gambar yang dapat diklik
Hubungi tim dukungan kami jika Anda memerlukan bantuan lebih lanjut melalui obrolan atau email support@engagementhq. com