{"id":48511,"date":"2024-07-22T08:07:00","date_gmt":"2024-07-22T01:07:00","guid":{"rendered":"https:\/\/www.rumahweb.com\/journal\/?p=48511"},"modified":"2024-07-19T14:06:32","modified_gmt":"2024-07-19T07:06:32","slug":"cara-setting-smtp-pada-contact-form-theme-divi-di-wordpress","status":"publish","type":"post","link":"https:\/\/www.rumahweb.com\/journal\/cara-setting-smtp-pada-contact-form-theme-divi-di-wordpress\/","title":{"rendered":"Cara Setting SMTP Pada Contact Form Theme Divi di WordPress"},"content":{"rendered":"\n

Divi adalah salah satu tema WordPress populer di kalangan developer <\/em>untuk membuat layout <\/em>dengan mudah dan cepat. Selain kemudahan penggunaan, Divi dilengkapi berbagai fitur, termasuk pembuatan formulir kontak tanpa plugin tambahan. Dalam artikel ini, kami akan membagikan cara setting SMTP pada tema Divi, agar halaman formulir kontak di website Anda berfungsi dengan baik.<\/p>\n\n\n\n\n\n

Divi menyediakan fitur contact form<\/em> pada premade layout maupun menu editornya. Dengan demikian, Anda tidak perlu menginstall plugin untuk membuat form tambahan di website. Cukup masukkan menu form, lalu buat desain form sesuai kebutuhan.<\/p>\n\n\n\n

Setelah mendesain halaman form, Anda perlu melakukan konfigurasi tambahan yaitu dengan melakukan setting SMTP. Hal ini perlu dilakukan, karena secara default form dari WordPress<\/a> membutuhkan function mail(), sedangkan function <\/em>ini termasuk salah satu yang sering masuk dalam daftar disable. Karena itu, Anda perlu melakukan setting SMTP agar email dari website dapat berfungsi.<\/p>\n\n\n\n

Mengenal fitur contact form<\/em> pada Theme Divi<\/h2>\n\n\n\n

Menu contact form di theme Divi memungkinkan user membuat formulir kontak dengan mudah tanpa perlu plugin tambahan. Anda dapat membuat formulir custom, sesuai dengan kebutuhan dengan pilihan desain yang menarik. <\/p>\n\n\n\n

Anda dapat membuat form melalui Divi editor, atau Anda juga bisa memanfaatkan fitur premade layout<\/a> yang tersedia.<\/p>\n\n\n

\n
\"menu<\/a><\/figure>\n<\/div>\n\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n

Keterangan:<\/p>\n\n\n\n

    \n
  1. Customize Form<\/strong> : Anda dapat menambah dan mengatur berbagai jenis input, seperti teks, email, nomor telepon, dropdown, checkbox, dan masih banyak lagi.<\/li>\n\n\n\n
  2. Desain Responsif<\/strong>: Modul dirancang agar responsif dan dapat menyesuaikan dengan berbagai ukuran layar.<\/li>\n\n\n\n
  3. Validasi Formulir<\/strong>: Validasi otomatis untuk memastikan bahwa input yang dimasukkan oleh pengguna valid, seperti memastikan alamat email memiliki format yang benar.<\/li>\n\n\n\n
  4. Pemberitahuan Email<\/strong>: Kirim pemberitahuan email otomatis setiap kali seseorang mengirimkan formulir.<\/li>\n\n\n\n
  5. Pesan Konfirmasi<\/strong>: Tampilkan pesan konfirmasi setelah formulir dikirimkan untuk memberi tahu pengguna bahwa pesan mereka telah diterima.
    Proteksi Spam:<\/li>\n\n\n\n
  6. Tersedia opsi untuk menambahkan Google reCAPTCHA untuk melindungi dari spam.<\/li>\n<\/ol>\n\n\n\n

    Setelah form selesai dibuat, Anda bisa mengikuti panduan berikut untuk melakukan setting SMTP pada form yang telah dibuat. <\/p>\n\n\n\n

    Setting Form SMTP WordPress Pada Theme Divi<\/h2>\n\n\n\n

    Berikut adalah contoh tampilan website dengan Tema Divi yang menggunakan fitur Contact Form.<\/p>\n\n\n\n

    \"website<\/a><\/figure>\n\n\n\n

    Untuk memulai seting SMTP pada form Divi theme, silahkan ikuti langkah berikut:<\/p>\n\n\n\n

      \n
    1. Login ke administrator WordPress Anda.<\/li>\n\n\n\n
    2. Instal plugin SMTP seperti WP Mail SMTP dan konfigurasi plugin WP Mail SMTP tersebut. Untuk detailnya, silakan mengikuti panduan berikut<\/a>.<\/li>\n\n\n\n
    3. Lakukan testing pada plugin WP Mail SMTP dan pastikan berhasil.<\/li>\n\n\n\n
    4. Langkah selanjutnya, klik menu Pages > pilih pages yang akan diseting > klik Edit With Divi.<\/li>\n<\/ol>\n\n\n
      \n
      \"edit<\/a><\/figure>\n<\/div>\n\n\n
        \n
      1. Klik pada Contact Form, lalu klik ikon roda gigi untuk membuka pengaturan modul.<\/li>\n<\/ol>\n\n\n
        \n
        \"module<\/a><\/figure>\n<\/div>\n\n\n
          \n
        1. Pada tab Content, scroll ke bawah ke opsi Text > Success Message . Isikan informasi bahwa formulir berhasil dikirimkan ke pemilik website. Contoh seperti screenshot dibawah.<\/li>\n<\/ol>\n\n\n
          \n
          \"Setting<\/a><\/figure>\n<\/div>\n\n\n
            \n
          1. Scroll ke bawah ke opsi Spam Protection dan klik pada Use Basic Captcha. Selesai setting klik tombol Save atau centang.<\/li>\n<\/ol>\n\n\n
            \n
            \"Setting<\/a><\/figure>\n<\/div>\n\n\n

            Pastikan Anda juga telah klik Save di editor pages Divi.<\/p>\n\n\n\n

            \"\"<\/a><\/figure>\n\n\n\n

            Pengujian Contact Form Pada Website<\/h2>\n\n\n\n

            Langkah terakhir adalah melakukan pengujian pada contact form yang dibuat. Silahkan akses ke halaman form yang anda buat, lalu coba lakukan testing. Jika berhasil, akan muncul keterangan form diterima dan email administratornya akan mendapatkan pemberitahuan dari website.<\/p>\n\n\n\n

            \"tahap<\/a><\/figure>\n\n\n
            \n
            \"tahap<\/a><\/figure>\n<\/div>\n\n\n

            Berikut adalah tampilan yang diterima oleh admin website.<\/p>\n\n\n

            \n
            \"tahap<\/a><\/figure>\n<\/div>\n\n\n

            Demikian panduan Setting Form SMTP WordPress Pada Theme Divi. Selamat mencoba!<\/p>\n","protected":false},"excerpt":{"rendered":"

            Divi adalah salah satu tema WordPress populer di kalangan developer untuk membuat layout dengan mudah dan cepat. Selain kemudahan penggunaan, Divi dilengkapi berbagai fitur, termasuk pembuatan formulir kontak tanpa plugin tambahan. Dalam artikel ini, kami akan membagikan cara setting SMTP pada tema Divi, agar halaman formulir kontak di website Anda berfungsi dengan baik. Divi menyediakan […]<\/p>\n","protected":false},"author":342,"featured_media":48628,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[463],"tags":[1452,183,14],"class_list":{"0":"post-48511","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-wordpress","8":"tag-divi","9":"tag-smtp","10":"tag-wordpress"},"aioseo_notices":[],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/07\/Banner-Cara-Setting-SMTP-Pada-Contact-Form-Theme-Divi-di-WordPress.png","jetpack_shortlink":"https:\/\/wp.me\/p8n3G7-cCr","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/48511","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/users\/342"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/comments?post=48511"}],"version-history":[{"count":0,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/48511\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media\/48628"}],"wp:attachment":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media?parent=48511"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/categories?post=48511"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/tags?post=48511"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}