Themeforest

WordPress Plugin – Slick Contact Forms

Updated 21st September 2012

Creates widgets, which add customisable contact forms using either floating/drop down tabs or sticky, slide out tabs.

  • Form processed using jQuery & AJAX – no page refresh!
  • Allows multiple contact forms per page & multiple recipients.
  • Location of the floating or sliding tab easily set from the widget control panel.
  • Each form includes up to 3 text input fields, one text area & a text intro.
  • Customise text labels, type of validation & error messages.
  • Validation with animated error messages
  • Shortcodes to open/close the contact form using external links.

The contact form also includes a “Honeypot” style captcha to help minimize spam – this works by having a blank input field hidden from view of the user but visible to spambots. If the field contains text the mail will not be sent – no more annoying & tricky captcha systems!

Very easy to set up – just add the Slick Contact Forms widget to any widget area!

Looking For A Non-WordPress Version?

Our jQuery Contact Tabs plugin is a jQuery form generator for creating unlimited slide-out or static contact tabs containing AJAX powered customised forms. Plugin includes 12 different form elements and client-side validation.

Also Check Out Our Premium WordPress Plugins:

Demo WordPress Slick Contact Forms Plugin

See the 2 demo forms on this page – top-left & bottom-right.

Download The Plugin

Download Slick Contact Forms 1.3.6 (137,215)

Installation

  1. Upload the plugin through `Plugins > Add New > Upload` interface or upload `slick-contact-forms` folder to the `/wp-content/plugins/` directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress
  3. In the widgets section, select the Slick Contact Forms widget and add to one of your widget areas
  4. Configure the form details and click “Save”

Useage

In order to use the Slick Contact Forms plugin you will need a widget area in your theme files.

Location of the actual widget is not important since the plugin automatically sets the position based on the control panel settings. You can therefore add the WordPress contact form to an existing widget area in your WordPress theme or create a new widget area.

The forms have been made accessible so that in the event that a user does not have javascript enabled the form will still be available and can be submitted as usual – the form will then appear in the location set by the widget area in your WordPress theme files.

To learn more about adding widget areas to WordPress see our WordPress tutorial – “Adding A Widget Area To Your Theme Files”.

Slick Contact Forms Configuration Settings

General configuration for the plugin can be set via the WordPress admin menu option:

Settings –> Slick Contact Forms

Default Email Address

Email address where submitted forms are sent if not set in the widget control panel – default is the WordPress admin email

Email Subject

The text that appears in the email subject line – default is the Blog Name

Send From User Email

Check this option if you would like to use the email address of the user who completed the form in the email “from” field – note that this requires at least one of the text fields “status” options set to email. This may not work with all servers – if you experience problems sending/receiving email from the form then try disabling this option again.

If checked the email will include the IP address of the user

Include IP Address

If checked the email will include the IP address of the user

Include Page URL

If checked the email will include the URL of the page from which the form was sent, giving you more information about what your users were looking at when they decided to fill in the contact form

Use wp_mail()

Check this box if you wish to use the WordPress built-in mail function for sending out the emails as opposed to the standard PHP mail() function. This is more of a troubleshooting option – if you can normally receive email from WordPress but you cannot receive email from this plugin then check this box!

After Form Submit

The form can be set to either submit using AJAX (default) and return a message to the form slide out panel or to redirect to a different page.

Note: If you are not setting a redirect page use the “AJAX Message” option.

If using AJAX Message:

Set the text that is shown when the form has been submitted

  • Email Sent: When a form is successfully submitted
  • Error: If an error occurred during submission
  • Invalid: If invalid data is received by the server

If using Redirect:

Enter the URLs to redirect the page to when the form submit is complete

  • Email Sent: Enter the URL to redirect the page to when the form is successfully submitted
  • Error: Enter the URL to redirect the page to when the form fails

If the “redirect” option is selected and no URL’s are entered the form will be redirected back to the current page when submitted.

Validation Messages – The text that will appear in the animated validation error messages

  • Input Required: If a required form field is empty
  • Email Address: If an invalid email format is entered

Configuring Your WordPress Contact Form Widget

The contact form can easily be customised using the options available in the widget control panel:

Method:

Select either a “floating” button or a “Sliding” tab

Tab Text:

Enter the text that you would like to use for the form tab.

Width:

Set the width of the contact form in pixels

Location:

The position of the contact in the browser window:

Offset

For each one you can also add the number of pixels that you would like to offset the form from the edge of the browser window in pixels.

For sticky tabs only option A is used:

  • top left & bottom left – A: pixels from left
  • top right & bottom right – A: px from right
  • left & right – A: px from top

Floating contact forms:

  • top left & left – A: pixels from top, B: pixels from left
  • top right & right -A: pixels from top, B: pixels from right
  • bottom left – A: pixels from bottom, B: pixels from left
  • bottom right – A: pixels from bottom, B: pixels from right

Floating Speed:

The speed for the floating animation (only applicable for the floating type) in milliseconds – i.e. the time it takes to “catch up” when the page scrolls up or down) – e.g. to set the floating speed to 1.5 seconds use 1500.

The default speed is set to 1.5 secs.

Animation Speed:

The speed in milliseconds to open and close the contact form.

The default speed is set to 0.6 secs.

Auto-Close:

If checked, the contact form will automatically slide closed when the user clicks anywhere in the browser

Load Open:

If checked, the contact form will be open when the page first loads. The tab will still close when clicked.

Skin:

4 different sample skins are currently available for styling the contact form widget. These can easily be used to create your own custom menu theme.

The following 2 FAQ’s also provide examples of the main CSS rules used for the contact forms if you want to add your own styles to your theme’s style sheet:

Note: If you use one of the skin CSS files to create your own style please remember to copy the CSS to your theme folder as all files in the plugin folder are automatically deleted when the plugin is updated.

The Form Elements

The widget control panel also includes options for customising the number of text input fields, the label for the form field and the type of validation you would like to use:

Email To

The address where the form details will be sent. To send to multiple email addresses enter the emails separated by a comma (available starting version 1.3).

Form Text

Add introduction text for the form. Select the position of the text – either before or after the form fields.

Text input fields

Up to 3 form fields can be added to the contact form. Enter the text for the label in the left hand box. The right-hand drop down “Status” menu allows you to select whether the form field is required:

  • N/A – If selected the form field will not appear on the contact form
  • None – Form field will appear but is not required
  • Required – User must enter text in order to submit
  • Email -Add jQuery email validation. Email address is checked against a standard regular expression to make sure it matches the correct format.

Text Area

The form also includes the option of one text area

Submit Button

This allows you to set the text of the submit button

Shortcodes

The plugin includes the feature to add text links within your site content that will open/close the sticky or floating tab.

[dcscf-link] –
default link, which will toggle the contact form open/closed with the link text “Contact Us” – Contact Us

[dcscf-link text="Contact Us Now"] –
toggle the contact form open/closed with the link text “Contact Us Now” – Contact Us Now

[dcscf-link action="open"] –
open the contact form with the default link text – Contact Us

[dcscf-link action="close"] –
close the contact form with the default link text – Contact Us

Frequently Asked Questions

Many issues that can crop up with installing and using the plugin with different themes have been covered in our comments section. Please check previous comments for further information/tips.

Also refer to our Frequently Asked Questions for Slick Contact Forms, which has answers to many of the most common problems that may occur.

For plugin customisations or additional support please contact us for a quotation.

Demo WordPress Slick Contact Forms Plugin

See demo forms on this page.

Download The Plugin

Download Slick Contact Forms 1.3.6 (137,215)

Feedback

If you find this plugin useful please rate it at wordpress.org.

Screenshots

Widget in edit mode

Sample form using sticky tabs

Updates

Version 1.3.7 – 21st September 2012

  • Add: Check for overwriting of jquery plugin file
  • Edit: Remove form label validation errors
  • Edit: Change wp_enqueue_script action

Version 1.3.6

  • Edit: Consolidated jquery scripts into single file

Version 1.3.5 – 4th April 2012

  • Edit: Filter function name in slick_mail.php

Version 1.3.2 – 7th October 2011

  • Added: Option to use user email address in “from” header

Version 1.3.1 – 3rd October 2011

  • Updated: Minor modifications to form.css

Version 1.3 – 14th September 2011

  • Added: Ability to send email to multiple recipient email addresses

Version 1.2.9 – 5th September 2011

  • Added: Option to use wp_mail() function
  • Fixed: Bug with saving “include url” option

Version 1.2.8 – 11th August 2011

  • Added: Option to redirect to different pages on form submit

Version 1.2.7 – 31st July 2011

  • Added: Server-side validation for required fields

Version 1.2.5 – 18th July 2011

  • Fixed: Speed option for slide out tab

Version 1.2.4 – 16th July 2011

  • Changed: Renamed email validation function to avoid conflict with WP Autoresponder And Newsletter Plugin

Version 1.2.3 – 11th July 2011

  • Added: Option to have contact form open when page loads – see “load open” option

Version 1.2.2 – 2nd July 2011

  • Added: Option to include origin page URL in contact email

Version 1.2.1 – 13th June 2011

  • Added: Reply-To field in contact form auto-email

Version 1.2 – 11th June 2011

  • Added: Shortcodes for adding external links to open/close the contact form

Version 1.1.3 – 5th June 2011

  • Fixed: Bug with changing the default validation error text

Version 1.1.2 – 17th May 2011

  • Added: Textarea removed when N/A selected for validation option

Version 1.1.1 – 12th May 2011

  • Added: Ability to set text of form submit button using widget control panel

Version 1.1 – 11th May 2011

  • Added: Can now leave tab text box blank to allow for background images for vertical text
  • Added: Honeypot style captcha to help minimize spam.

645 Comments

  • How is it possible to add an icon like you have on your homepage of an envelope instead of text?

    thanks, great plugin.

  • [...] Slick Contact Forms [...]

  • Hi, there is any problem with the new WordPress 3.5, the Slide Out version is displaying wrong.
    Let me know and thanks in advance guys!

    • Hi,

      The plugin has been tested with WordPress 3.5 and should work OK. I would suggest checking your site using firebug to see if there are javascript errors with other plugins that may be causing the problem.

  • Hi,

    Can we have this contact form as a fixed position one, so that it will just remain in the footer section and not move while scrolling.That looks nice.Is there a shortcode to insert it in any section or page.Please let me know.I really like this contact form. It is so good and easy.

    • Hi,

      The form does not have a static version – only slide out or floating

  • Looks like a nice plugin…

    Is there anyway to add a spambot filter to this? I don’t see that as an option for the plugin itself, but do you know of any way to add that functionality?

    A simple math question (not an indecipherable Captcha!) would be a nice addition…

    Best!

    • Hi,

      The form already contains a “honeypot” captcha, which is not visible to the user.

  • HI,
    can i paste a “wufoo form” or any other from in the body of the plug in?

    • Hi,

      No you need to use the form that comes with the plugin

  • Is there a way to pick who the recipient is for the email? Like on this page: http://www.bearlake.com/contact.php

    • Not by the user. That option is set in the widget control panel

  • Hi,

    My website (word press) theme is no widget aware. So whenever I am installing this plugin it does not have any possibility to control or even activate it.(because there is no widget area at all)

    Is there a way around this?

    Regards,
    Jo

  • THanks for this wonderful plugin.

    I tried on this client’s website, the plugin wouldn’t appear on the landing page(http://hare.vodien.com/~emccorgs/theprofessional/) and another page (http://hare.vodien.com/~emccorgs/theprofessional/mediation/) but it would appear just fine on the rest of the pages. This is puzzling.

    Any idea?

    • It looks like the widget area that is used to create the form is not available in those pages.

  • Hello,

    I am running on some issues on my (still not open) website.
    I am running on version 1.3.7 and one of the issues is that on the e-mail that i receive the title is a selected text (for example, You were contacted by…) the it should appear the name but it shows the title of the bar (for instance Contact Us).
    So the subjet on the e-mail i receive is something like this: You were contacted by Contact Us

    The other issue (and i don’t know if its a jQuery problem) is that it’s not validating the e-mail.
    If i insert a word it accepts it and the message is sent.

    How to solve these issues?

    Best Regards
    Rui Fernandes

    • Check the page using firebug to see if there are any javascript errors on the page preventing the validation from working

  • Since we upgraded our site to WordPress v3.4.1 the slick contact form plug in does not forward customer enquiries to our info@ address, which is configured. We have not made any other changes to the site. The message on screen suggests that the email has been sent, but we are not receiving it. I upgraded to the latest version of the plug in today, but it did not resolve the issue. Can you please advise how we can fix it? Thanks :)

  • Since we upgraded our site to WordPress v3.4.1 the slick contact form plug in does not forward customer enq

  • Ive used different contact forms. Contact Form 7, Slick Contact Form..infact the slick contact form was exactly what I was looking for..however I have the same problem whenever I use and contact form plugin. I never receive any mails to the designated email id. Can you help?

  • Shortcodes
    The plugin includes the feature to add text links within your site content that will open/close the sticky or floating tab.
    if i can replace text links to image links to open/close the sticky tab ?

    • You can use a normal link with an image and add the class name “dcscf-link” to the link tag

  • The contact form does not show on the homepage. Is there any way to control which pages the form shows on?

    Thanks in advance.

  • Great plugin! Is there any way to send the submission to multiple email recipients?

    • Hi,

      In the “Email To” field just enter the email addresses separated by a comma

  • I am getting an error, how can I fix it

    Warning: require_once(../../../wp-config.php) [function.require-once]: failed to open stream: No such file or directory in /home/alvarodica/alvarodiazcastro.com/cms/wp-content/plugins/slick-contact-forms/slick_mail.php on line 3

    Fatal error: require_once() [function.require]: Failed opening required ‘../../../wp-config.php’ (include_path=’.:/usr/local/lib/php:/usr/local/php5/lib/pear’) in /home/alvarodica/alvarodiazcastro.com/cms/wp-content/plugins/slick-contact-forms/slick_mail.php on line 3

    • Hi,

      In the slick_mail.php file change the path of the wp_config.php file on line 3 so that it points to the actual directory where your wp_config file is.

Leave a comment

To add code to your comments wrap the code text in [text][/text] tags

  1. An example contact form created using - Wordpress Slick Contact Forms plugin
  1. Another example contact form created using - Wordpress Slick Contact Forms plugin