Postingan website tidak muncul gambar dan deskripsi saat di share

Postingan website tidak muncul gambar dan deskripsi saat di share

Melakukan share setiap postingan di sosial media seperti whatsapp, facebook, twitter dan lain sebagainya mampu meningkatkan jumlah kunjungan pada website anda. Selain itu manfaat share cukup penting jika yang anda bagikan adalah produk maupun berita yang sedang viral. Namun pernahkan anda mengalami masalah ketika link anda bagikan di sosial media tidak ada gambar artikel, judul maupun deskripsi nya? ya tentunya ini akan membuat anda pusing dan menyebalkan. Namun anda tidak perlu pusing dan khawatir karena artikel ini akan membahas bagaimana cara mengatasi postingan website yang tidak muncul gambar dan deskripsi saat di share.

1. Langkah pertama anda harus menginstall plugin Yoast SEO.

Klik plugin lalu tambahkan plugin baru kemudian cari Yoast SEO, klik install kemudian aktifkan.

2. Setting pada Yoast SEO

Lakukan sedikit pengaturan pada yoast seo melalui menu Yoast SEO lalu pengaturan, kemudian pilih fitur situs dan gulir kebawah pada data open graph klik aktifkan.

apabila anda sudah selesai melakukan pengaturan singkat tersebut, anda dapat kembali ke postingan artikel untuk mengambil/copy link nya.

3. Masuk ke Facebook Debugger

Langkah selanjutnya anda dapat masuk ke facebook debugger, fungsi dari facebook debugger yaitu untuk melihat detail informasi seperti gambar, judul, deskripsi yang tayang di facebook, whatsapp dan lainya saat konten situs web Anda dibagikan. Kemudian disini anda juga dapat mengambil informasi terbaru sesudah anda menginstall Yoast SEO maupun jika ada perubahan konten seperti gambar.

masukkan link yang sudah kita copy tadi ke facebook debugger kemudian klik debug.

Hasil dari debug biasanya muncul seperti saat anda membagikan di whatsapp, facebook atau lainya dimana belum muncul foto, judul maupun deskripsi dengan benar. Apabila belum pernah dibagikan silakan klik mengambil informasi baru.

Apabila hasil debug tidak muncul gambar, judul, keterangan sesuai postingan silakan klik kurangi lagi untuk me refresh isi halaman yang ingin anda bagikan.

dengan klik kurangi lagi, maka meta facebook akan mengambil informasi ulang pada halaman website kita. Perbedaanya setelah menggunakan Yoast SEO dan tanpa yoast seo yaitu akan muncul gambar, judul, deskripsi sesuai isian post.

Langkah terakhir silakan share link artikel lagi maka sudah muncul gambar, judul dan keterangan sesuai di artikel.

 

Our Score
Click to rate this post!
[Total: 0 Average: 0]
Membuat Captcha Pada Contact Form 7 WordPress Plugin

Membuat Captcha Pada Contact Form 7 WordPress Plugin

Membuat captcha pada contact form bertujuan untuk melindungi dari spam yang sering masuk ke website kita. Spam yang sering masuk ke website juga dapat mengakibatkan penurunan rating dan peringkat website kita, sehingga pemasangan captha ini sangatlah penting. Artikel ini akan membahas cara membuat captcha pada website di contact form 7.

Contact form adalah plugin wordpress yang digunakan untuk membuat form kontak pada halaman website sehingga memudahkan pengunjung kita menghubungi melalui email. Contact form 7 adalah plugin yang ringan dan mudah digunakan sehingga penggunanya sangat banyak dan gratis.

Cara Membuat Captcha pada Contact Form 7

1. Integration

Integration yaitu untuk mengintegrasikan plugin dengan google recaptcha agar website kita terhubung dan dapat digunakan dengan benar. Untuk membuat captcha tentunya anda harus menginstall plugin contact form 7 dan mengaktifkanya. Apabila sudah mengaktifkan kemudian anda masuk ke menu contact kemudian klik integration.

2. Setup Integration

Setelah anda klik Integration kemudian kita akan klik Setup Integration yang bertujuan untuk mulai menghubungkan website kita dengan google recaptcha.

setelah kita klik Setup Integration maka akan muncul seperti halaman seperti berikut.

 

3. Akses Google reCAPTCHA

langkah berikutnya anda harus mengakses google recaptcha kemudian mendaftarkan situs anda, berikut ini link yang dapat anda akses untuk mendaftarkan recaptcha : https://www.google.com/recaptcha/about/

setelah itu langsung kita klik v3 Admin Console

kemudian kita tambahkan situs kita dengan klik tanda + create

kemudian isi data-data berikut ini

  • Label : isikan judul atau nama situs anda
  • Recaptcha type pilih score based (v3)
  • Domain : masukkan url anda tanpa https, jadi cukup namadomainanda.com

Langkah berikutnya silakan klik submit.

4. Tempel code site key dan juga secret key

Setelah anda klik submit kemudian anda akan dibawa ke halaman site key dan secret key, yang harus anda lakukan adalah mengcopy 2 kode yang kemudian ditempelkan di halaman website anda.

setelah anda klik copy site key maupun copy secret key, kemudian paste pada halaman website anda.

paste kedua key tersebut kemudian klik save changes.

setelah klik save changes, kemudian lakukan edit pada form anda dan tambahkan kode [recaptcha] sebelum tombol submit.

setelah anda tambahkan code kemudian klik save, maka captcha pada kontak anda sudah muncul.

Demikianlah artikel cara memasang captcha pada contact form 7, semoga website anda menjadi lebih aman dari spam.

Our Score
Click to rate this post!
[Total: 0 Average: 0]
Video Cara Membuat Custom Style Login WordPress

Video Cara Membuat Custom Style Login WordPress

Halaman tampilan login standar WordPress terlihat polos dan kurang menarik, namun kita bisa membuat lebih menarik dengan Plugin tambahan. Hal tersebut karena memang bukan Worpress kurang menarik, namun WordPress adalah cms yang mudah untuk di customisasi sehingga pihak pengembang WordPress tidak perlu menambahkan style.

Kita dapat mengubah style login wordpress agar terlihat menarik mulai dari Logo, background, warna, tulisan, tombol dan lainya menggunakan plugin gratis. Mengapa harus mengubah style login di WordPress? hal ini dilakukan untuk meningkatkan daya tarik jika website kita digunakan banyak user. Bisa juga jika anda berperan sebagai web developer dapat berguna untuk menambah kredibilitas hasil pengerjaan anda.

Artikel kali ini akan membahas dan menerangkan cara Membuat Custom Style Login WordPress dengan mudah, cepat dan gratis tanpa anda harus menguasai code pemrograman.

Membuat Custom Style Login di WordPress

Plugin LoginPress cukup mudah dalam melakukan customisasi, plugin ini gratis dan mampu merubah style login wordpress kita diantaranya yaitu :

  • Mengubah logo secara kustom
  • Memberikan background pada halaman login.
  • Background bagian form
  • Kustomisasi form dan font login
  • Mampu menambahkan captcha

Berikut adalah langkah-langkah untuk melakukan customisasi login wordpress

  1. Install Plugin LoginPress

Pada menu login klik tambah baru kemudian ketik dan cari “LoginPress | wp-login Custom Login Page Customizer” by WPBrigade, setelah itu klik install kemudian klik aktifkan.

Apabila sudah terinstall kemudian akan muncul menu baru di sebelah kiri, klik login press kemudian klik izinkan dan lanjutkan.

setelah itu klik penyesuaian

Setelah anda klik Penyesuaian lalu akan muncul banyak menu pengaturanya seperti gambar berikut :

Berikut ini adalah penjelasan di setiap menu pada penyesuaian :

  • Tema : Menu tema untuk memilih thema yang sudah di customisasi bawaan plugin, namun ftur ini hanya tersedia dalam versi premium. Jangan khawatir, anda dapat melakukan customisasi sendiri secara mudah.
  • Logo : Pada menu logo anda dapat memilih logo, menemtukan ukuran logo.
  • Latar belakang : memilih latar belakang dan anda dapat mengupload gambar dari laptop.
  • Formulir login : mengubah latar belakang form login, tata letak formulir dan warna
  • Latar belakang lupa kata sandi
  • Percantik tombol untuk mengatur style tombol logo
  • Font untuk mengatur jenis font login dan lainya.

Apabila sudah mengatur jangan lupa klik terbitkan untuk menyimpan perubahanya. Berikut ini adalah video mulai installasi sampai cara melakukan pengaturanya.

Our Score
Click to rate this post!
[Total: 0 Average: 0]
Cara Membuat diskon Persentase di Woocommerce

Cara Membuat diskon Persentase di Woocommerce

Pada kesempatan kali ini, kami akan membahas artikel tentang diskon WooCommerce menggunakan persentase. Pada pengaturan bawaan Woocommerce hanya menyediakan diskon dalam bentuk nominal saja, oleh karena itu dirasa kurang lengkap karena harga setiap produk berbeda tentunya. Diskon persentase untuk seluruh produk di toko, diskon persentase berdasarkan kuantitas, diskon persentase berdasarkan kategori produk, persentase berdasarkan subtotal keranjang, Persentase kupon WooCommerce dan banyak lagi yang ada pada woocommerce.

Apabila saat ini anda sedang mencari artikel Cara Membuat diskon Persentase di Woocommerce, kami akan membuat panduan dengan mudah dan lengkap. Untuk memulai kita harus menginstall plugin Woo Discount Rules terlebih dahulu.

Apa itu diskon persentase di WooCommerce?

Diskon persentase ini membuat pelanggan akan otomatis mendapatkan harga lebih murah dari harga awal. Diskon persentase membuat harga terpotong berdasarkan pengaturan yang sudah kita lakukan dan berdasarkan kebutuhan toko online anda. Plugin Woo Discount Rules sangat membantu anda dengan cepat dan gratis untuk melakukan itu.

Langkah membuat diskon presentase pada woocommerce

1. Masuk ke Dasbor WordPress Anda dan klik Plugin.

2. Klik tombol “Tambah Baru” kemudian cari plugin “Woo Discount Rules” kemudian klik install dan aktifkan.

3. Apabila sudah terinstall dan aktif, selanjutnya pada menu woocommerce kita klik wo discount rules.

4. Tambahkan Rule Baru

Klik add new rule untuk membuat pengaturan diskon baru, anda dapat menambahkan beberapa rule diskon menggunakan plugin ini yang dapat disesuaikan dengan kebutuhan toko online anda.

5. Isi rule diskon

Isikan judul rule, pilih model diskon, filter produk yang ingin diberi diskon, masukkan persentase diskon kemudian klik simpan.

6. Memasukkan kode kupon

Apabila anda ingin menggunakan diskon ini dengan cara memasukkan kode kupon caranya cukup mudah.

Centang pada pilihan shw discount lalu masukkan kode diskon seperti gambar di atas kami menggunakan kode Discount20.

Jenis diskon pada plugin Woo Discount Rules

Berikut ini adalah jenis-jenis diskon yang terdapat pada plugin Woo Discount Rules.

Diskon Skenario
Diskon persentase seluruh produk di WooCommerce Diskon berdasarkan % untuk semua produk di toko WooCommerce
Diskon persentase WooCommerce untuk kategori tertentu Hanya kategori yang kita pilih untuk mendapatkan diskon %
Diskon persentase WooCommerce untuk produk tertentu Hanya produk tertentu sesuai yang kita atur untuk mendapatkan diskon %
Diskon persentase WooCommerce untuk atribut tertentu Beli produk dengan atribut yang kita tentukan misalkan warna Biru dan dapatkan diskon 20%
Penjualan persentase kupon WooCommerce Dapatkan diskon % di seluruh toko menggunakan kode kupon
Diskon persentase berdasarkan jumlah barang Beli 5 produk mendapatkan diskon 10%
Beli 10 produk mendapatkan diskon 20%
Beli 15 produk mendapatkan diskon 30%
Penawaran persentase BOGO WooCommerce Beli item apa saja dari Kategori A dan B dan dapatkan produk termurah dari Kategori B dengan diskon 20%
Diskon persentase berdasarkan Pengguna “Pelanggan Grosir” mendapatkan diskon 30% untuk pembelian jumlah minimal 2 dari toko
Diskon persentase keranjang berdasarkan subtotal jumlah pembelian barang Dapatkan diskon 20% bila pelanggan membelanjakan lebih dari harga yang sudah kita tentukan

Woo Discount Rules versi gratis sudah cukup lengkap untuk toko anda. Apabila dirasa kurang dan ingin mendapatkan fitur lengkap pada tabel diatas tentunya anda harus menggunakan plugin Woo Discount Rules versi pro.

Untuk lebih lengkap anda dapat menyimak video berikut ini.

Our Score
Click to rate this post!
[Total: 200 Average: 5]
Cara Memasukkan Website ke Google Analytics

Cara Memasukkan Website ke Google Analytics

Fungsi Google Analytixs yaitu untuk memantau trafik website dengan lengkap dan detail. Untuk itu penting kita mendaftarkan website ke google analytics supaya kita dapat memantau performanya. Pada kesempatan kali ini kita akan membahas Cara Memasukkan Website ke Google Analytics. Berikut adalah langkah-langkahnya :

1. Akses google analytics -> https://analytics.google.com/analytics/web/

dashboard google analytics

2. Pilih menu admin dan membuat akun baru.

Selanjutnya kita klik menu admin/icon gear lalu klik buat akun

3. Mulai buat akun

Langkah berikutnya mulai buat akun dengan mengisi nama akun dan beberapa pilihan lainya dan centeng semua pilihan, lalu klik berikutnya.

4. Buat Properti

Membuat properti ini tujuanya untuk mengukur data web dan aplikasi. Setiap properti yang Anda buat menyimpan semua data pengukuran untuk setiap situs dan aplikasi yang Anda pilih. Isi detail nama properti, zona waktu dan mata uang. Setelah di isi lalu klik berikutnya.

5. Menjelaskan bisnis anda

Mulai mengisi beberapa pertanyaan yang diajukan google lalu klik berikutnya.

6. Tujuan Bisnis

Pilih tujuan bisnis anda dengan mencentang pilihan-pilihan.

7. Pengumpulan Data

Selanjutnya anda dapat memilih berbagai jenis pengumpulan data mulai dari web, ios, maupun aplikasi android. Pada artikel ini cara menambahkan situs website maka kita akan memilih web seperti gambar dibawah ini.

8. Masukkan alamat website

Masukkan website dan klik buat aliran data.

9. Berhasil dimasukkan di google analytics

Apabila cara sudah anda ikuti dengan benar, maka situs website anda berhasil dimasukkan dan akan muncul seperti gambar dibawah ini.

Memasang Code Google Analytics di Website

Apabila langkah diatas sudah selesai, maka berikutnya anda dapat menerapkan atau memasang code pada website anda. Langkah pertama yang harus anda lakukan adalah mengcopy code dengan cara klik Lihat petunjuk tag.

Lalu pilih cara Install Secara manual

Copy code diatas kemudian tempelkan di google diantara <head> dan jangan menambahkan lebih dari satu di setiap halaman. Apabila anda bingung dengan cara ini, kita dapat menggunakan bantuan plugin agar lebih mudah.

Plugin yang digunakan yaitu header footer code manager yang dapat anda install malalui menu Plugin lalu tambah baru kemudian cari header footer code manager kemudian klik install lalu aktifkan.

Apabila sudah terinstall kemudian silakan klik menu HFCM kemudian klik add new, lalu isikan code yang mau dipasang dengan pengaturan seperti gambar berikut :

Lalu pada snipet code, paste code yang kita copy dari google analytics tadi saat kita memilih cara manual.

Setelah selesai lalu klik simpan/save dan secara otomatis situs anda akan terhubung dan tunggu beberapa jam untuk menerima laporan.

Masih banyak plugin lain yang bisa kita gunakan untuk memasang google analytics seperti plugin Site Kit by Google yaitu plugin buatan google yang bisa anda coba dan utak-atik serta pelajari sendiri,

Our Score
Click to rate this post!
[Total: 0 Average: 0]
Jumlah kolom berbeda pada hp dan laptop dengan elementor

Jumlah kolom berbeda pada hp dan laptop dengan elementor

Cara membuat jumlah kolom yang berbeda pada hp dan laptop atau responsive menggunakan elementor. Page builder yang sangat memudahkan kita untuk membuat halaman tanpa susah-susah mempelajari kode pemrograman.

Dengan hadirnya elementor saat ini membuat website menjadi lebih cepat dan mudah tanpa harus mempelajari teknisnya seperti css, php dan mysql. Bahkan untuk membuat kolom yang berbeda saja jika kita tidak menggunakan elementor akan memakan waktu yang lama bagi para pemula.

Dengan menggunakan elementor kita dapat memilih berapa saja kolom dengan ukuran yang dapat kita sesuaikan dengan mudah dan cepat. Selain gratis plugin ini juga sangat membantu bagi para perancang website untuk tampilan yang cantik cukup dengan cara drag and drop.

Apakah saat ini anda pengguna baru yang sedang dipusingkan untuk membuat tabel responsive? sebenarnya cara ini cukup mudah dengan plugin elementor masalah anda akan terselesaikan dalam hitungan menit saja.

Membuat jumlah kolom berbeda dengan elementor

Pada pengaturan standar elementor jika kita membuat misalkan 5 kolom, maka tampilan di hp akan berubah menjadi 1 kolom dengan posisi menurun. Oeleh karena itu simak bagaimana cara untuk membuat kolom di hp menjadi jumlah yang kita inginkan.

2 kolom elementor

2 kolom elementor pada hp

untuk melakukan pengaturan tersebut langkah pertama anda harus ke mode responsive dengan cara klik mode responsive.

1. Buka editor halaman anda dengan Elementor

2. klik pada titik 6 atau sunting bagian

3. klik mode responsive seperti gambar diatas

4. klik icon ponsel seperti gambar diatas.

kemudian akan muncul seperti gambar dibawah ini :

5. setelah klik kolom, lalu isikan pada angka 100 diubah ke 50

6. langkah selanjutnya klik kanan pada sunting kolom, kemudian tambah kolom baru. lalu pada kolom baru yang dibuat tadi isikan dengan nilai 50. Maka hasilnya seperti gambar dibawah ini kemudian anda tinggal mengisi kolom tersebut dengan gambar, tulisan, widget atau lainya.

7. Apabila anda sudah menambahkan isian untuk kolom ke 2 lalu dapat dicek melalui handphone dan laptop untuk melihat pengaturanya.

Kesimpulan

Menggunakan elementor sangat mudah, ringkas dan cepat meski kadang kita harus mempelajarinya terlebih dahulu. Anda dapat membuat berbagai tampilan yang canti tanpa harus memahami kode pemrograman seperti jaman dulu.

simak video berikut untuk lebih jelasnya.

Our Score
Click to rate this post!
[Total: 0 Average: 0]