Version 2.1+  © Copyright -

This is user documentation of Joomla! component B2J Contact. Document describes component requirements and installation and how to use it.


This feature-rich, easy-to-use, totally free and extremely lightweight component is a must-have for your web-site.
B2J Contact is a fully responsive custom form-creating component for Joomla 3+, which allows you to create customized forms with various fields on your Joomla-powered website. Whether you are running an online survey, making a contact or feedback form or publishing a reservation form for your website, B2J Contact is at your disposal. Numerous features of this component will help to customize forms fully and simplify the process of contacting the administrator for your users. Note, that every time your users have filled and submitted a form, the component will notify Joomla administrators with customized e-mails.

Requirements & Installation 

1. Requirements

  • PHP 5.3+
  • MySQL 5+
  • Joomla 3+


2. Installation

  • Download install-able kit from Product Page.
  • Go to your website's admin panel => Extensions => Extension Manager.
  • Upload the downloaded kit and click on install.

3. Upgrade

To upgrade the component, you just need to install the new version kit on your existing setup. Need not to un-install the previously installed version.
Important: If you uninstall the component you will lose all the data you have inserted and saved in the groups, custom fields and all the settings.

How to create a Contact Form? 

After the installation the first thing you should do is to go to Components -> B2J Contact and add a new contact form by clicking the "New" button.
On the image below you will find all the settings of the contact form you are creating grouped in 5 tabs - BASIC OPTIONS, DEFAULTS, FIELDS, EVENTS, SECURITY.
Tab #1: Basic Options
In the ‘Basic Options’ you have to name your new contact form. Contact ‘Name’ is just a label for a contact form and is used only for administrative purposes. To edit it, click on the text and it will change to an editable field. You can use any title you like, e.g. “Job Application Form,” “Form for Event″ and so on.
Then write down the email addresses or Joomla! users’ inboxes where you wish all the forms to be forwarded after being submitted.
Email Body- The text entered here will be sent as the email body. For sending field values in the email content, use [[Field-name]] in the content, replace Field-name with the name of the form in your form. Leave this box empty if you want to send email with default content.

Submitter as Email Sender- When this option is set to Yes then admin receives email by sender's email reference. Make sure any one email field is set to Default Yes in the field configuration.

Tab #2: Defaults
In this tab you may set some default parameters for this contact form. This page includes the following sections:
Page Display Options

Page Subheading- Choose the subheading for your contact form
Form width- set width of the whole contact form inserting a desired value in pixels, percents or just choose the Automatic, for automatic width control.
Page top text, Page bottom text- The text inserted here will display on contact form, helping your users clearly understand the purpose or other details of the form.
Field Labels

Show Field labels- Choose the place where ‘Field’ labels display. Options available are ‘beside’ and ‘inside’ fields.
Form layout- Choose the appearance of the form layout. The options available are ‘Compact’, ‘Extended’ and ‘Stacked’.
Fields labels width in px.- Allows you to set desired width of ’Field Labels’ of the contact form.
Text Fields, Dropdown List Fields, Text Area

Click the default numbers in pixels to make the fields editable and just set the desired values for the ‘Width’ of ‘Text Fields’ and ‘Dropdown List Fields’ (fields with single-line inputs) and ‘Width’ and ‘Height’ of ‘Text Area’ (the latter field allows multi-line inputs).
Note that you can allow or disallow attachments to the form. Let’s see what settings are available here.

Enable attachments- Choose ‘No’, to disallow and ‘Yes’ to allow the attachments
Receive uploads as- Choose the way you will receive the uploaded attachments The available options here are - http links, email attachments, both
Upload Description, Upload Button Text, Reset Button Text- Modify text texts on Upload and Reset Buttons and add Upload Description to easily guide your users through attachment submitting process.
Size limit(Kb)- Limit the size of uploading attachments here. You can also enable ‘File Type Filter’ to allow only predefined types of attachments for uploading. To do it , choose ‘Yes’ in the dropdown menu next to ‘Enable Files Filter’ just like we did it. If you choose ‘No’, all types of attachments will be allowed by default.

In case of enabling ‘File Types Filter’, select which file types to allow with Files Filter Rules. Choosing ‘Yes’ in the dropdown menu next to file type names, you will allow the file. To disallow exact file types, choose ‘No’. In the shown example, Audio and Video files are not allowed, and Images, Documents and Zipped Archives are allowed to be uploaded as an attachment.
To make the form more user-friendly and easier-to-submit enter suitable texts for ‘Submit’ and ‘Reset’ buttons, and choose the type of buttons. Note that ‘Reset’ button can be also be disabled.

Let’s choose the most essential part.
Tab # 3: Fields +

Here you may add unlimited dynamic fields and add them to the already created groups or to create a new group instantly. After you add a new field, you should choose the type of the field.
Now it supports the following field types:

We will continually add new field types. You may also suggest your versions on Codextrous Forum.
After you select the field type you should be prompted to name the field, add a placeholder text, change the state of the field to Disable, Optional or Required, and to add the field to an existing group or create a new group. Let’s see how simple it is on the example of ‘Text’ field.

By adding different types of fields you will get your contact form ready to be published.
NOTE: All the changes will not apply until you click the SAVE button in the top-left corner of the component.
Tab #4: Events

In this tab you will be able to control the events your user will experience during the filling process of the forms.
In this section you may choose whether to give a custom "Thank You!" message to the users, who have successfully filled in the form. You can also redirect them to a specific "Thank You!" page.
In this section you will be given a chance to edit the email subject and email body that will be sent to the submitter upon a successful session.

Note: Sender’s email is the dynamic field e-mail, which is mentioned as default.
Tab # 5:Security
The Security section includes settings for Anti-Spam and CAPTCHA.

You can add some enable the spam filter and add some words, separated by a comma to filter and also change the spam message.
This section will allow you to enable or disable the CAPTCHA on your custom contact form as well as to change:

Type - Mathematical & Alphanumeric
Number of characters
Image width
Image height
Font and Font sizes
Max. rotation angle
Background Color
Text color
Disturbance color

Override CSS

If you want to add custom CSS, you should copy components => com_b2jcontact => css => b2jcontact.css into templates => your_template => css => folder and make your changes in that file.

How to display a Form? 

B2J Contact module is designed to show the B2J Contact Component on any Joomla! module position you wish.

To see this module in action you should:
1. Create a new contact in B2J Contact Component, add the desired custom fields, Save it!
2. Go to Module Manager -> Add new module
3. Choose the B2J Contact Module
4. Add a name for the module
5. Choose the module position on which you wish to publish the module
6. Assign the module to a menu item
7. Finally, from the right panel of the module, choose the contact you have created in the step 1.

That's it!

Assigning a single contact form to a menu item will create a new page on your Joomla! website and show the contact form inside of the component view of your template.

This can be done by going to Menus -> Choose a Menu -> Add new menu item.
1. Select a Menu Item Type
2. Choose B2J Contact -> Contact page
3. Select a contact from the list of the contacts that you have created before
4. Write a menu title
5. Save

You may also add a new class suffix to the component view by going to Advanced Options -> B2J Contact Options -> Component class suffix.

In conclusion, the B2J Contact component is an out-of-the-box solution to create unlimited custom forms on your Joomla website.
All the forms are created in the B2J Contact Component. To show a single contact/custom form you should use either Menu Item or B2J Contact Module. All the settings and options are set within the B2J Contact Component, but not the module or menu item.
If you still have questions about this component, please don't hesitate to ask your questions on Codextrous Forum.
Feel free to visit Features Request for B2J Contact also, if you have requests.

P.S. If you use B2J Contact Component please don't forget to post a review on Joomla Extension Directory.
Thank you!