Title: Visual Builder for Contact Form 7 Author: etruel Published: 7 September 2015 Last modified: 17 September 2021 --- Cari plugin ![](https://ps.w.org/visual-builder-for-contact-form-7/assets/banner-772x250.jpg? rev=2600243) Plugin ini **belum teruji dangan 3 rilis besar WordPress**. Kemungkinan tidak lagi dipelihara atau didukung, dan mungkin menghadapi masalah kompatibilitas bila digunakan dengan versi WordPress yang lebih baru. ![](https://ps.w.org/visual-builder-for-contact-form-7/assets/icon-256x256.jpg?rev =2600239) # Visual Builder for Contact Form 7 Oleh [etruel](https://profiles.wordpress.org/etruel/) [Unduh](https://downloads.wordpress.org/plugin/visual-builder-for-contact-form-7.zip) * [Detail](https://id.wordpress.org/plugins/visual-builder-for-contact-form-7/#description) * [Ulasan](https://id.wordpress.org/plugins/visual-builder-for-contact-form-7/#reviews) * [Instalasi](https://id.wordpress.org/plugins/visual-builder-for-contact-form-7/#installation) * [Pengembangan](https://id.wordpress.org/plugins/visual-builder-for-contact-form-7/#developers) [Bantuan](https://wordpress.org/support/plugin/visual-builder-for-contact-form-7/) ## Deskripsi Currently Contact Form 7 plugin just allow editing forms with HTML in standard textarea. This Add-on allows previews, items order with drag and drop, and deletes field items just with a click. Also adds a HTML code highlighter in the textarea and some selectable themes to choose different colors schemes. See [Screenshots](https://wordpress.org/plugins/visual-builder-for-contact-form-7/screenshots/) to see simple instructions and get an idea of its appearance. ## Tangkapan Layar [⌊Standard textarea from Contact Form 7, will be replaced with Visual Builder. Every field without html tags is reflected with⌉⌊Standard textarea from Contact Form 7, will be replaced with Visual Builder. Every field without html tags is reflected with⌉[ Standard textarea from Contact Form 7, will be replaced with Visual Builder. Every field without html tags is reflected with [⌊New areas added after activate the plugin. Now you can see the textarea with code highlighter with some themes to choice. At right-top cornner an eye to show or hide the visual form fields.⌉⌊New areas added after activate the plugin. Now you can see the textarea with code highlighter with some themes to choice. At right- top cornner an eye to show or hide the visual form fields.⌉[ New areas added after activate the plugin. Now you can see the textarea with code highlighter with some themes to choice. At right-top cornner an eye to show or hide the visual form fields. [⌊Now you can Drag & Drop to change fields order. (If Adds a new field with above tags, must save to see changes in Visual Builder)⌉⌊Now you can Drag & Drop to change fields order. (If Adds a new field with above tags, must save to see changes in Visual Builder)⌉[ Now you can Drag & Drop to change fields order. (If Adds a new field with above tags, must save to see changes in Visual Builder) [⌊After Drop a field you'll see the change also in textarea. You must save Form to save all you have changes.⌉⌊After Drop a field you'll see the change also in textarea. You must save Form to save all you have changes.⌉[ After Drop a field you’ll see the change also in textarea. You must save Form to save all you have changes. [⌊Option to delete a field and its labels just with a click.⌉⌊Option to delete a field and its labels just with a click.⌉[ Option to delete a field and its labels just with a click. [⌊Click de eye to hide/show the Visual Builder.⌉⌊Click de eye to hide/show the Visual Builder.⌉[ Click de eye to hide/show the Visual Builder. ## Instalasi You can either install it automatically from the WordPress admin, or do it manually: #### Using the Plugin Manager 1. Click Plugins 2. Click Add New 3. Search for `Contact Form 7 Visual Builder` 4. Click Install 5. Click Install Now 6. Click Activate Plugin 7. Now you must see a Form Preview with Visual Builder options near textarea when edit a form #### Manually 1. Upload `contact-form-7-visual-builder` folder to the `/wp-content/plugins/` directory 2. Activate the plugin through the ‘Plugins’ menu in WordPress ## Ulasan ![](https://secure.gravatar.com/avatar/8b320cb3a6fbdd7d218f85a58c939345971814d69762f6e3d63d16657e2a369d? s=60&d=retro&r=g) ### 󠀁[Justo not work](https://wordpress.org/support/topic/justo-not-work/)󠁿 [dentk2010](https://profiles.wordpress.org/dentk2010/) 11 Agustus 2021 1 balasan Justo not work ![](https://secure.gravatar.com/avatar/97494013f81f4589af0761fb2fb12762b2f06fe4f178f294f038e1ea373c8d00? s=60&d=retro&r=g) ### 󠀁[Good plugin](https://wordpress.org/support/topic/good-plugin-5258/)󠁿 [Alessandro](https://profiles.wordpress.org/marajah/) 28 Mei 2021 1 balasan Thanks for sharing it and doing it for free. Despite from who said it's not working, it works well. Maybe they're trolls or maybe they need to hire someone to build their website. ![](https://secure.gravatar.com/avatar/eb3d4ebde3728a2b46f1061572466fa10dc909fa076e1b3dc4bb12fbe96cbeb7? s=60&d=retro&r=g) ### 󠀁[Useful tool](https://wordpress.org/support/topic/useful-tool-33/)󠁿 [arrubakook](https://profiles.wordpress.org/arrubakook/) 12 Januari 2018 This is a great tool, it saves me switching between Sublime and Wordpress when I want to make small changes to a form. I still build the majority of a form inside a code editor but this saves a lot of time further down the line! Excellent. ![](https://secure.gravatar.com/avatar/4245dd3699dc45f50bcb987b0298739bea61a717a09b639f5060085490267562? s=60&d=retro&r=g) ### 󠀁[Can’t save contact form](https://wordpress.org/support/topic/cant-save-contact-form/)󠁿 [jonson71](https://profiles.wordpress.org/jonson71/) 24 November 2017 3 balasan Hey, plugin author, I just want to say do you use your own plugin, just to make sure if it works. ![](https://secure.gravatar.com/avatar/8f22865e17dc870e6f65d9d1aec5100d0e54e34bffe0c77463ba1b2410cc4ef3? s=60&d=retro&r=g) ### 󠀁[Great addition for Contact Form 7](https://wordpress.org/support/topic/great-addition-for-contact-form-7/)󠁿 [vipteam](https://profiles.wordpress.org/vipteam/) 3 September 2016 This is a time saver. Visual view greatly facilitates work with input fields. Regards ![](https://secure.gravatar.com/avatar/49cca01b200e414df2fbec3d5a3b1ae5365ba018114fa584d05940bd5080e0ee? s=60&d=retro&r=g) ### 󠀁[I want to make this easy!!](https://wordpress.org/support/topic/i-want-to-make-this-easy/)󠁿 [etruel](https://profiles.wordpress.org/etruel/) 3 September 2016 I needed to make the form edit a little more easy than HTML edit, then I made this for myself and I share with everybody with the vision to make it better in the time. Please test and gives a good review to continue development !! 🙂 [ Baca semua 6 ulasan ](https://wordpress.org/support/plugin/visual-builder-for-contact-form-7/reviews/) ## Kontributor & Pengembang “Visual Builder for Contact Form 7” adalah perangkat lunak open source. Berikut ini mereka yang sudah berkontribusi pada plugin ini. Kontributor * [ etruel ](https://profiles.wordpress.org/etruel/) “Visual Builder for Contact Form 7” telah diterjemahkan dalam 1 bahasa. Terima kasih kepada [para penerjemah](https://translate.wordpress.org/projects/wp-plugins/visual-builder-for-contact-form-7/contributors) untuk kontribusi-nya. [Terjemahkan “Visual Builder for Contact Form 7” dalam bahasa Anda.](https://translate.wordpress.org/projects/wp-plugins/visual-builder-for-contact-form-7) ### Tertarik mengembangkan? [Lihat kode](https://plugins.trac.wordpress.org/browser/visual-builder-for-contact-form-7/), periksa [repositori SVN ](https://plugins.svn.wordpress.org/visual-builder-for-contact-form-7/), atau mendaftar ke [log pengembangan](https://plugins.trac.wordpress.org/log/visual-builder-for-contact-form-7/) melalui [RSS](https://plugins.trac.wordpress.org/log/visual-builder-for-contact-form-7/?limit=100&mode=stop_on_copy&format=rss). ## Log Perubahan #### 2.5 Sep 16, 2021 * Tested with WP 5.8.1 and CF7 5.4.2 * New icons and logo 😀 * Tweaks some styes. * Added .pot catalog and Spanish language files. * Fixes issue does not show form or visual builder on New Form. * Updated Author name and URIs. #### 2.4 May 2, 2021 * Compatibility with Contact Form 7 v5.4.1 and WordPress v5.7.1 * Adds requirements on activating to avoid errors if CF7 is not present. * Tweak uses the WordPress wheel gif for reload when refreshing the form. * Fixes the functionality of the form viewer hiding the reload form. * Fixes bug when refreshing the form and deleting an item. * Fixes failure to execute script elements in visual form. * Fixes javascript errors on contact forms list. * Fixes javascript errors for cm.theme.options on editing form screen. #### 2.3 * Compatibility with Contact Form 7 v4.8 and WordPress v4.8. * Few tweaks on design and cosmetic. #### 2.2 * Fixes a Fatal error: Can’t use function return value in write context in some versions of PHP. #### 2.1 * Improvement the text editor to works with javascript. You can now change order like any field. * Improvement the text editor retain the css in the top of the form. * Tweak, Option to refresh the visual form. * Tweak, by adding nonces to the AJAX requests. #### 2.0 Closest… * Tested with WP 4.7 and CF7 4.6 * Tweak, the color scheme is now htmlmixed for html, js and css coding. * Tweak, eye icon is now a wordpress dashicon saving loading time of data images in css. * Improvement, Visual form view (eye icon) state is now saved on click via ajax. * Improvement, TextArea code Highlighter have now selectable themes to choose different colors schemes. * Improvement The color schema is saved via ajax on select. * Fixes the shortcodes without html tags as in default forms adding p tags. * New collaborator & new Banners 😀 #### 1.1 Second approach: Added HTML code highlighter in the textarea. Added support for“ p” and “label” html tags. (Until now was just p) #### 1.0 First approach to Visual Builder for forms from Contact Form 7. ## Meta * Versi **2.5** * Diperbarui **5 tahun yang lalu** * Instalasi Aktif **400+** * Versi WordPress ** 4.1 atau yang terbaru ** * Diuji hingga **5.8.17** * Versi PHP ** 5.6 atau yang terbaru ** * Bahasa * [English (US)](https://wordpress.org/plugins/visual-builder-for-contact-form-7/) dan [Spanish (Spain)](https://es.wordpress.org/plugins/visual-builder-for-contact-form-7/). * [Terjemahkan dalam bahasa Anda](https://translate.wordpress.org/projects/wp-plugins/visual-builder-for-contact-form-7) * Tag * [contact](https://id.wordpress.org/plugins/tags/contact/)[form](https://id.wordpress.org/plugins/tags/form/) [form builder](https://id.wordpress.org/plugins/tags/form-builder/)[visual builder](https://id.wordpress.org/plugins/tags/visual-builder/) [visual form](https://id.wordpress.org/plugins/tags/visual-form/) * [Tampilan lanjut](https://id.wordpress.org/plugins/visual-builder-for-contact-form-7/advanced/) ## Rating 3.7 dari 5 bintang. * [ 4 ulasan 5-bintang ](https://wordpress.org/support/plugin/visual-builder-for-contact-form-7/reviews/?filter=5) * [ 0 ulasan 4-bintang ](https://wordpress.org/support/plugin/visual-builder-for-contact-form-7/reviews/?filter=4) * [ 0 ulasan 3-bintang ](https://wordpress.org/support/plugin/visual-builder-for-contact-form-7/reviews/?filter=3) * [ 0 ulasan 2-bintang ](https://wordpress.org/support/plugin/visual-builder-for-contact-form-7/reviews/?filter=2) * [ 2 ulasan 1-bintang ](https://wordpress.org/support/plugin/visual-builder-for-contact-form-7/reviews/?filter=1) [Your review](https://wordpress.org/support/plugin/visual-builder-for-contact-form-7/reviews/#new-post) [Lihat semua ulasan](https://wordpress.org/support/plugin/visual-builder-for-contact-form-7/reviews/) ## Kontributor * [ etruel ](https://profiles.wordpress.org/etruel/) ## Bantuan Ada yang ingin dikatakan? Butuh bantuan? [Lihat forum bantuan](https://wordpress.org/support/plugin/visual-builder-for-contact-form-7/) ## Donasi Apakah Anda ingin mendukung pengembangan plugin ini? [ Donasi untuk plugin ini ](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=GT3UVS8UCAHV8)