Bagaimana Cara Membuat Tombol Berbagi Sosial di GeneratePress?

Dalam tutorial ini, kita akan melihat Cara Membuat Tombol Berbagi Sosial di GeneratePress?

Ini pasti akan membantu Anda dalam meningkatkan promosi lintas saluran postingan blog Anda. Hal itu pada gilirannya akan meningkatkan kehadiran web Anda.

Saya akan menunjukkan cara membuat tombol berbagi sosial yang melekat di bagian depan entri blog Anda. Artinya, mereka akan selalu terlihat oleh audiens Anda.

Kita dapat mencapainya melalui plugin, tetapi bagian terbaiknya adalah membuatnya secara manual. Dengan begitu, Anda tahu bahwa Anda menghindari penambahan JavaScript (mematikan kinerja situs web) di situs Anda.

Pelajaran ini mengharuskan Anda memiliki GeneratePress premium, karena kita akan menggunakan modul Elements.

Buat Tombol Berbagi Sosial Di GeneratePress Tanpa Plugin

Membuat tombol berbagi sosial di tema GeneratePress tanpa plugin mengharuskan Anda mengetahui tentang ikon SVG.

SVG adalah Grafik Vektor yang Dapat Diskalakan. Itu adalah visual standar terbuka (terutama digunakan sebagai ikon) yang dikembangkan oleh W3C (World Wide Web Consortium) (World Wide Web Consortium).

Manfaat Menggunakan SVG

• Mereka memiliki ukuran file kecil yang tidak pernah mempengaruhi kecepatan situs.
• Anda dapat dengan mudah menambahkan hyperlink ke ikon SVG.
• Mereka mudah dimodifikasi dengan perangkat lunak grafik vektor apa pun.
• Ikon SVG tidak bergantung pada resolusi, menjadikannya sempurna untuk tampilan desktop, tablet, dan seluler.
• Gambar SVG lebih SEO-friendly dibandingkan gambar konvensional.

Kami akan menggunakan SVG dari Iconmonstr. Artinya, bukan hanya iconnya saja tapi icon dengan kode XML-nya juga.

Langkah 1: Tambahkan Kode Tombol Berbagi Sosial Untuk Menghasilkan Kait Elemen Pers

Untuk mencapai hal ini, pertama-tama Anda harus membuat Elemen Baru di GeneratePress. Buka Dasbor WordPress Anda, di bawah Penampilan, Klik Elemen. Ini akan membuka halaman Elemen, klik Tambahkan Elemen Baru.

Segera setelah Anda mengklik Tambahkan Elemen Baru, HasilkanTekan akan menampilkan jendela dialog. Klik pada Kait. Itu akurat, Anda memerlukan pengait khusus GeneratePress untuk tindakan ini.

Beri nama pada Elemen baru dan tambahkan kodenya.

Pilih hook sebagai generate after header, jalankan PHP, dan atur aturan tampilan ke Posting – Semua Posting.

Karena kita memerlukan ikon berbagi sosial untuk mengapung di area pandang layar kita. Sebaiknya pilih Generate After Header Hook.

Alasan kami memilih pengaturan tampilan sebagai Semua Postingan adalah karena Anda ingin pengguna Anda membagikan konten Anda di situs sosial mereka.

Jangan lupa menekan tombol Publikasikan.

Salin kode berikut untuk menerapkan hal yang sama di situs web Anda.

Langkah 2: Lakukan Styling CSS Pada Ikon Berbagi Sosial

Untuk melakukannya, buka dashboard WordPress, di bawah Appearance, klik Customize.

Ini akan membuka penyesuai tema GeneratePress. Di sini turun ke bawah dan klik CSS Tambahan.

Rekatkan kode CSS berikut untuk gaya yang sebanding. Anda diperbolehkan untuk menyesuaikan CSS sesuai kebutuhan Anda.

Langkah 3: Hasil akhir dari Tombol Berbagi Sosial di GeneratePress

Akhirnya, begini caranya berbagi sosial ikon akan terlihat seperti di situs web Anda. Ingatlah bahwa kami telah membuatnya mengambang dari atas pada 70% area pandang layar.

Manfaat Tombol Social Sharing Di GeneratePress (Tanpa Plugin) (Tanpa Plugin)

Penggunaan SVG dari Iconmonstr menjadikan ikon Anda sangat ringan
Tidak ada kode JavaScript apa pun yang terlibat.

Dengan menggunakan strategi ini, Anda tidak menginstal plugin pihak ketiga apa pun
Ini responsif.

Semua tombol akan bekerja sangat cepat untuk tujuan berbagi.

Kesimpulan : Bagaimana Cara Membuat Tombol Berbagi Sosial di GeneratePress?

Sekarang Anda telah menemukan cara membuat tombol berbagi sosial di GeneratePress menggunakan kode dan plugin.

Gunakan opsi yang mudah bagi Anda dan yang memenuhi kebutuhan Anda. Silakan mengedit kode PHP dan/atau CSS dari artikel tersebut.