Title: Dev Con Form
Author: nodelondondev
Published: <strong>2017 年 4 月 7 日</strong>
Last modified: 2017 年 10 月 17 日

---

搜尋外掛

![](https://ps.w.org/dev-con-form/assets/banner-772x250.png?rev=1635170)

這個外掛**並未在最新的 3 個 WordPress 主要版本上進行測試**。開發者可能不再對這個
外掛進行維護或提供技術支援，並可能會與更新版本的 WordPress 產生使用上的相容性問題。

![](https://ps.w.org/dev-con-form/assets/icon-256x256.png?rev=1634147)

# Dev Con Form

 由 [nodelondondev](https://profiles.wordpress.org/nodelondondev/) 開發

[下載](https://downloads.wordpress.org/plugin/dev-con-form.1.2.2.zip)

 * [詳細資料](https://tw.wordpress.org/plugins/dev-con-form/#description)
 * [使用者評論](https://tw.wordpress.org/plugins/dev-con-form/#reviews)
 *  [安裝方式](https://tw.wordpress.org/plugins/dev-con-form/#installation)
 * [開發資訊](https://tw.wordpress.org/plugins/dev-con-form/#developers)

 [技術支援](https://wordpress.org/support/plugin/dev-con-form/)

## 外掛說明

Are you familiar with HTML and CSS? Does your current contact form plugin give you
the markup you need to build an eye popping, responsive or just outright funky contact
form? Add your template PHP file to your theme, tell Dev Con Form where it is and
the rest is taken care of.

SUPPORT

If you have a question, suggestion or just want to tell us how you are using the
contact form plugin, head over to the [community page](https://plus.google.com/communities/111436651501321536481)

## 安裝方式

#### From WordPress.org

 1. Download and copy ‘dev-con-form’ to the ‘/wp-content/plugins/’ directory
 2. Activate the plugin through the ‘Plugins’ menu in WordPress
 3. Click on the new menu item ‘Contact Forms’ and create your first form!
 4. When you have created your first contact form you can view its shortcode on the‘
    Contact Forms’ page
 5. Paste your newly created shortcode on to your posts, pages or anywhere else that
    allows shortcodes

#### From WordPress dashboard

 1. Visit ‘Plugins > Add New’
 2. Search for ‘Dev Con Form’
 3. Activate Dev Con Form from your Plugins page.

## 常見問題集

  Installation Instructions

#### From WordPress.org

 1. Download and copy ‘dev-con-form’ to the ‘/wp-content/plugins/’ directory
 2. Activate the plugin through the ‘Plugins’ menu in WordPress
 3. Click on the new menu item ‘Contact Forms’ and create your first form!
 4. When you have created your first contact form you can view its shortcode on the‘
    Contact Forms’ page
 5. Paste your newly created shortcode on to your posts, pages or anywhere else that
    allows shortcodes

#### From WordPress dashboard

 1. Visit ‘Plugins > Add New’
 2. Search for ‘Dev Con Form’
 3. Activate Dev Con Form from your Plugins page.

  How do I create a contact form?

 1.  On wp-admin page, select ‘Contact Forms’ (on the left)
 2.  Select ‘Add New’
 3.  Give your new form a name
 4.  Fill out all the appropriate fields
 5.  Select the ‘Create’ button
 6.  Select ‘Contact Forms’ (on the left)
 7.  You should see your new contact form, Copy the Shortcode (to the right of the 
     form name)
 8.  Paste this shortcode into a post and your form should appear.
 9.  Alternatively you can use the shortcode with the do_shortcode() function

  How do I add more contact form fields?

You will need to make a custom template file to achieve this.
 Please follow these
steps to achieve this:

 1. In your wordpress theme directory, create a new folder called ‘devconform’.
 2. Copy the code from [this example](http://codepen.io/nodelondon/pen/bqQZgR?editors=1100).
 3. Paste the code into a new .php file.
 4. Edit the form elements to suit your needs.
 5. Save the .php file into the devconform folder you created in step 1.
 6. In the WordPress CMS, Select ‘Contact Forms’ and Add New or Edit an existing form.
 7. In the Layout section, select your custom layout in the dropdown menu and select‘
    Create’ or ‘Update’. If you cant see your layout name, make sure you followed steps
    1 to 4 correctly.
 8. If you’ve used the shortcode anywhere in the front end, you should be able to see
    the changes.

  How do I change the layout of the existing contact form?

You cant change the default form but we’ve made it easy to create a new one.
 Please
follow these steps to achieve this:

 1. In your wordpress theme directory, create a new folder called ‘devconform’.
 2. Copy the code from [this example](http://codepen.io/nodelondon/pen/bqQZgR?editors=1100).
 3. Paste the code into a new .php file.
 4. Edit the form elements to suit your needs.
 5. Save the .php file into the devconform folder you created in step 1.
 6. In the WordPress CMS, Select ‘Contact Forms’ and Edit an existing form.
 7. In the Layout section, select your custom layout in the dropdown menu and select‘
    Update’. If you cant see your layout name, make sure you followed steps 1 to 4 
    correctly.
 8. If you’ve used the shortcode anywhere in the front end, you should be able to see
    the changes.

## 使用者評論

![](https://secure.gravatar.com/avatar/541d3d98b0ac420e2eeff826e4e27d1c2db496761fb4ba1d9c607f9adcce71e4?
s=60&d=retro&r=g)

### 󠀁[Flexible and functional](https://wordpress.org/support/topic/flexible-and-functional-5/)󠁿

 [zackjones12](https://profiles.wordpress.org/zackjones12/) 2017 年 10 月 10 日

Dev Con Form is a great plugin that allowed me to build flexible contact forms that
are intuitive and functional without needing to customise much. Finally no more 
storing code within the backend!

 [ 閱讀全部 1 則使用者評論 ](https://wordpress.org/support/plugin/dev-con-form/reviews/)

## 參與者及開發者

以下人員參與了開源軟體〈Dev Con Form〉的開發相關工作。

參與者

 *   [ nodelondondev ](https://profiles.wordpress.org/nodelondondev/)
 *   [ node london ](https://profiles.wordpress.org/node-london/)

〈Dev Con Form〉外掛目前已有 1 個本地化語言版本。 感謝[全部譯者](https://translate.wordpress.org/projects/wp-plugins/dev-con-form/contributors)
為這個外掛做出的貢獻。

[將〈Dev Con Form〉外掛本地化為台灣繁體中文版](https://translate.wordpress.org/projects/wp-plugins/dev-con-form)

### 對開發相關資訊感興趣？

任何人均可[瀏覽程式碼](https://plugins.trac.wordpress.org/browser/dev-con-form/)、
查看 [SVN 存放庫](https://plugins.svn.wordpress.org/dev-con-form/)，或透過 [RSS](https://plugins.trac.wordpress.org/log/dev-con-form/?limit=100&mode=stop_on_copy&format=rss)
訂閱[開發記錄](https://plugins.trac.wordpress.org/log/dev-con-form/)。

## 變更記錄

#### 1.2.0

Pen test updates, wp-config override fixes, editable reference names, post title
clash fixes

#### 1.1.0

Readme updates

#### 1.0.0

Initial release

## 中繼資料

 *  版本 **1.2.2**
 *  最後更新 **9 年前**
 *  啟用安裝數 **10+**
 *  WordPress 版本需求 ** 4.7 或更新版本 **
 *  已測試相容的 WordPress 版本 **4.8.28**
 *  語言
 * [English (UK)](https://en-gb.wordpress.org/plugins/dev-con-form/) 及 [English (US)](https://wordpress.org/plugins/dev-con-form/).
 *  [將這個外掛本地化為你的母語版本](https://translate.wordpress.org/projects/wp-plugins/dev-con-form)
 * 標籤:
 * [contact](https://tw.wordpress.org/plugins/tags/contact/)[contact form](https://tw.wordpress.org/plugins/tags/contact-form/)
   [email](https://tw.wordpress.org/plugins/tags/email/)[email form](https://tw.wordpress.org/plugins/tags/email-form/)
   [form](https://tw.wordpress.org/plugins/tags/form/)
 *  [進階檢視](https://tw.wordpress.org/plugins/dev-con-form/advanced/)

## 評分

 5 星，滿分為 5 星

 *  [  1 個 5 星使用者評論     ](https://wordpress.org/support/plugin/dev-con-form/reviews/?filter=5)
 *  [  0 個 4 星使用者評論     ](https://wordpress.org/support/plugin/dev-con-form/reviews/?filter=4)
 *  [  0 個 3 星使用者評論     ](https://wordpress.org/support/plugin/dev-con-form/reviews/?filter=3)
 *  [  0 個 2 星使用者評論     ](https://wordpress.org/support/plugin/dev-con-form/reviews/?filter=2)
 *  [  0 個 1 星使用者評論     ](https://wordpress.org/support/plugin/dev-con-form/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/dev-con-form/reviews/#new-post)

[查看全部使用者評論](https://wordpress.org/support/plugin/dev-con-form/reviews/)

## 參與者

 *   [ nodelondondev ](https://profiles.wordpress.org/nodelondondev/)
 *   [ node london ](https://profiles.wordpress.org/node-london/)

## 技術支援

使用者可在技術支援論壇提出意見反應或使用問題。

 [檢視技術支援論壇](https://wordpress.org/support/plugin/dev-con-form/)