Loncat ke Konten Utama

Bagaimana untuk menyesuaikan bentuk komentar di WordPress

Divi: tema WordPress termudah untuk digunakan

Divi: Tema WordPress terbaik sepanjang masa!

lebih 901.000 unduhan, Divi adalah tema WordPress paling populer di dunia. Sudah lengkap, mudah digunakan dan dilengkapi dengan lebih dari 62 template gratis. [Direkomendasikan]

Komentar memainkan peran penting dalam membangun komunitas di internet. Komentar menyediakan platform untuk interaksi bagi pembaca Anda di mana mereka dapat membagikan pemikiran mereka yang seringkali membuat mereka kembali.

Ada beberapa cara untuk mendorong pengguna memberi komentar di blog Anda. Salah satunya adalah dengan membuat formulir komentar yang indah, dapat digunakan, dan dapat diakses.

Dalam tutorial ini, kami akan menunjukkan cara memberi gaya pada formulir komentar WordPress default, kami juga akan menunjukkan kepada Anda cara menambahkan fungsionalitas komentar melalui ID media sosial dan cara membuat fungsionalitas berlangganan komentar dan banyak lagi. lebih.

Tetapi sebelumnya, jika Anda belum pernah menginstal WordPress temukan Bagaimana menginstal sebuah blog WordPress langkah 7 et Bagaimana menemukan, menginstal dan mengaktifkan tema WordPress di blog Anda 

Lalu kembali ke mengapa kita ada di sini.

Bagaimana mengubah gaya komentar WordPress

Ketika kita berbicara tentang gaya, yang kita maksud adalah Sisi CSS hal itu. Di bawah ini, saya akan menunjukkan kepada Anda bagaimana menyesuaikan tampilan formulir komentar di WordPress. Setiap elemen secara default di WordPress memiliki kode CSS, ini adalah kasus daftar komentar, menu navigasi, formulir komentar, widget dan banyak lagi.

Di antara file tema WordPress, kami memiliki file yang bernama comments.php yang digunakan untuk menampilkan komentar dan formulir komentar pada posting dan halaman blog. Untuk menampilkan formulir komentar WordPress, tombol “comment_form ()" digunakan.

Temukan Bagaimana menemukan link ke halaman login WordPress

Secara default, fungsi ini menghasilkan formulir komentar Anda dengan tiga bidang teks (nama, email dan situs web), kotak teks besar, untuk konten komentar dan tombol kirim.

Anda dapat dengan mudah mengubah setiap elemen ini hanya dengan memanipulasi kelas dan pengenal CSS default. Berikut adalah daftar kelas CSS default yang ditambahkan WordPress pada setiap formulir komentar.

#respond {#} balasan-title {#} membatalkan-bagaimana-balasan-link {} {} #commentform #author #email {} {} {} #URL #comment #submit .comment Catatan {} {} .required .how-bentuk-penulis {} .comment-form-email} {.how-bentuk-url} {.how-bentuk-bagaimana {} .form-diperbolehkan-tag {} .form kirimkan

Dengan hanya menyesuaikan kelas CSS ini, Anda dapat sepenuhnya mengubah tampilan formulir komentar. Mari kita coba mengubah sesuatu untuk memberi Anda gambaran tentang apa yang bisa kami lakukan.

Temukan Bagaimana cara mengganti tautan gambar setelah menginstal SSL di WordPress

Pertama, kita akan mulai dengan menyorot bidang aktif formulir. Dengan menyorot bidang aktif, pengguna akan dapat dengan mudah melihat apa yang mereka ubah dan ini memberikan sedikit sisi dinamis ke situs web Anda.

#respond {background: #ececec; padding: 0 5 0px 5px; } / * Menyoroti bidang teks aktif * / #respond input [type = text] textarea {-webkit-transition: semua 0.30s kemudahan-in-out; -moz-transisi: semua 0.30s kemudahan-in-out; -MS-transisi: semua 0.30s kemudahan-in-out; -o-transisi: semua 0.30s kemudahan-in-out; garis besar: none; padding: 3px 0px 3px 3px; margin: 5px 1px 3px 0px; border: padat 1px #dddddd; } #respond input [type = text]: fokus, textarea: fokus {box-shadow: 0 0 5px RGBA (81, 203, 238, 1); margin: 5px 1px 3px 0px; border: padat 1px RGBA (81, 203, 238, 1); }

Seperti inilah bentuk komentar Anda dengan Twenty Twelve.

Buat situs web Anda dengan Elementor dengan mudah

Elementor memungkinkan Anda untuk dengan mudah membuat desain situs web apa pun dengan tampilan profesional. Berhentilah membayar mahal untuk apa yang dapat Anda lakukan sendiri. [Gratis]

sorot-aktif-bentuk-bidang

Dengan penggunaan kelas-kelas ini, Anda dapat mengubah cara teks muncul di dalam bidang. Inilah yang akan kita lakukan pada contoh berikut.

#author {font-family: Lobster "Lobster 1.4", "Droid Sans", Arial; font-size: 16px; Warna: #1d1d1d; letter-spacing: .1em; #URL} {color: #21759b; font-family: "Luicida Console", "Courier New", "Courier", minivan; } 

Ini adalah hasil yang akan dihasilkan oleh kode sebelumnya.

bagaimana bentuk-input-gaya

Anda juga dapat mengubah gaya tombol formulir komentar. Pada contoh berikut, kami akan memberinya latar belakang gradien.

#submit {font-family: Arial; Warna: #ffffff; font-size: 20px; padding: 10px; text-decoration: none; box-shadow: 0px 1px 3px #666666; -webkit-box-shadow: 0px 1px 3px #666666; -moz-box-shadow: 0px 1px 3px #666666; text-shadow: 1px 1px 3px #666666; background: -webkit-gradien (linear, 0 0, 0 100%, dari (#006ad4) ke (#003366)); background: -moz-linear-gradient (top, #006ad4, #003366); } #submit: hover {background: -webkit-gradien (linear, 0 0, 0 100%, dari (#003366) ke (#006ad4)); background: -moz-linear-gradient (top, #003366, #006ad4)}

Inilah hasil yang akan ditampilkan.

bagaimana kirimkan tombol

Bagaimana menambahkan interaksi sosial di komentar

Mari mulai dengan menambahkan login sosial ke formulir komentar WordPress. Hal pertama yang perlu Anda lakukan adalah menginstal dan mengaktifkan plugin sosial Login

Temukan Cara menginstal plugin di WordPress Untuk mengaktifkan plugin ini, Anda harus membuat akun gratis dengan masuk ke alamat berikut: https://app.oneall.com

Setelah selesai, Anda tidak perlu mengonfigurasi API untuk setiap jaringan yang ingin Anda gunakan agar pengguna Anda dapat terhubung melaluinya.

Meskipun API dari berbagai jejaring sosial terus berubah, Anda tidak perlu melakukan apa pun, pengembang plugin ini akan memperbarui API mereka untuk Anda. Yang perlu Anda lakukan hanyalah masuk ke OneAll API.

Apakah Anda mencari tema dan plugin WordPress terbaik?

Unduh plugin terbaik dan tema WordPress di Envato dan buat situs web Anda dengan mudah. Sudah lebih dari 49.720.000 unduhan. [EKSKLUSIF]

Beginilah tampilan formulir Anda.

cara menyesuaikan form komentar wordpress 2cara menyesuaikan formulir umpan balik wordpress 

Temukan juga beberapa plugin WordPress premium  

Anda dapat menggunakan plugin WordPress lainnya untuk memberikan tampilan modern dan mengoptimalkan cengkeraman blog atau situs web Anda.

Kami menawarkan kepada Anda beberapa plugin WordPress premium yang akan membantu Anda melakukannya.

1. Pencarian Instan WP & Saran Otomatis

Plugin “WP Instant Search & Auto Suggest” memungkinkan Anda untuk langsung mendapatkan saran untuk artikel, halaman, dan jenis posting khusus saat mencari blog WordPress Anda. Ini bekerja dengan WPBakery et Landasan. wp-time-search-wordpress-plugin-untuk-search

Fitur-fiturnya meliputi: rcari dalam mode layar penuh, rPencarian instan untuk jenis publikasi khusus, kompatibilitas dengan Visual Composer, Ttiga gaya desain terintegrasi, skema warna 5 untuk dipilih, haldukungan keyboard dan mouse, esepenuhnya dapat disesuaikan melalui parameter dll ...

Download | Demo | Hébergement Web

2. Halaman Kesalahan 404 Redirect ke Homepage atau Halaman Kustom

Berikut adalah salah satu cara terbaik untuk dengan mudah menambahkan halaman kesalahan 404 yang akan mengarahkan pengunjung ke halaman rumah atau halaman kustom, setelah mengaktifkan plugin WordPress ini.Halaman Kesalahan 404 Redirect ke Homepage atau Halaman Kustom

Semua halaman kesalahan 404 akan diarahkan ke halaman rumah atau ke URL kustom. Dengan menggunakan plugin WordPress ini, Anda akan mengizinkan Google untuk mengurangi pagerank situs Anda jika memiliki banyak 404 halaman kesalahan.

Plugin WordPress ini tidak hanya mengarahkan tetapi juga dapat menjadi solusi yang cocok untuk meningkatkan peringkat situs web Anda dalam hasil mesin pencari.

Download | Demo | Hébergement Web

3. Posting terkait Pro 

Related Posts Pro memberikan solusi sederhana namun kuat untuk semua jenis konten serupa di WordPress. Ini mendukung jenis posting kustom, multisite, kategori, konten campuran, konten kustom, dan banyak lagi ...Posting Terkait Pro

Seperti fitur yang ditawarkannya antara lain: 3 berbagai jenis tata letak, 65 templat yang telah ditentukan untuk setiap tata letak, atidak perlu coding, dukungan tpenjelajahan dan Putar otomatis, kompatibilitas dengan jenis posting kustom yang digunakan oleh plugin WooCommerce, WP eCommerce, bbPress dll ..., a bilah pencarian dengan filter, a ddokumentasi yang sangat deskriptif dan banyak lagi.

Download | Demo | Hébergement Web

Buat Toko Online Anda dengan mudah

Unduh WooCommerce gratis, plugin e-commerce terbaik untuk menjual produk fisik dan digital Anda di WordPress. [Rekomendasi]

Sumber Daya yang Direkomendasikan

Cari tahu tentang sumber daya lain yang direkomendasikan untuk membantu Anda membangun dan mengelola situs web Anda.

Kesimpulan

Sini! Itu saja untuk tutorial ini. Kami harap artikel ini membantu Anda membuat formulir umpan balik Anda lebih menarik. Jangan ragu juga untuk memberi kami tip Anda tentang menyesuaikan WordPress, dan khususnya bagikan artikel ini dengan teman-teman Anda di jejaring sosial favorit Anda

Namun, Anda juga akan dapat berkonsultasi dengan kami ressources, jika Anda memerlukan lebih banyak elemen untuk melaksanakan proyek pembuatan situs Internet Anda, dengan membaca panduan kami di Pembuatan blog WordPress.

Jika Anda memiliki saran atau komentar, tinggalkan di bagian kami komentar.

...

Artikel ini berisi komentar 5

  1. Terima kasih untuk tutorial ini, tetapi bagaimana memodifikasi terjemahan awal
    Misalnya Kirim Komentar diterjemahkan oleh Posting komentar
    Saya ingin mengubah di Posting komentar
    Saya tidak menemukan .po di mana teks ini ditemukan yang muncul di file comments.php

    Terima kasih atas bantuan Anda

Tinggalkan komentar

Alamat email Anda tidak akan dipublikasikan. Bidang yang harus diisi ditandai *

Situs ini menggunakan Akismet untuk mengurangi yang tidak diinginkan. Pelajari lebih lanjut tentang bagaimana data komentar Anda digunakan.

Kembali ke atas
1 saham
saham1
menciak
Register