For the configuration of Flexi Contact component in Joomla 1.7, you have to first login through the administrative panel of Joomla by simply entering the url_of_your_website/administrator in your browser.
Enter the username, password and leave the Language to Default, click on Login as shown in Diagram 1.
Diagram 1
After logging in to the backend, a control panel page opens as shown in Diagram 2.
The Control Panel provides access to many default Joomla! functions and features. From the Control Panel, you can create and manage articles and categories. Other features available in the Control Panel are the media, menu, language, and user managers.
Diagram 2
In the top menu, locate Components. Click Components.;From the drop down menu that appears click on FlexiContact and then click on Configuration as shown in Diagram 3.
Diagram 3
The FlexiContact Configuration page opens as shown in the Diagram 4.Here you can configure FlexiContact.Click each link displayed to access its configuration page.
Diagram 4
1. General Configuration Enter the following details for the General Configuration as shown in Diagram 5. The following is a list of options provided:
Logging
Logging is off by default. If you click on Yes, all contacts are logged to the database.
Send HTML
If you click Yes, emails are sent in HTML format to users. If you click No, emails are sent in plain text format to users.
Autofill
This controls the automatic filling of the Name and Email Address for those users who are logged on to the front end of the website.
Agreement Required
This option allows you to require that users click a checkbox to enable the Send button in the front end. This can be done by entering some text (a text that appears after the checkbox) in the Prompt field. The Name and Link fields are optional. If they are both non-blank, the link is added after the prompt text, and when clicked, the link opens in a popup window
Click Save and Close after filling all the details as shown in Diagram 5, in order to save the General Configuration and close the edit screen.
You can also click on Save, in order to save the General Configuration data updated and stay on the editable screen.
Diagram 5
2. Email To Admin: With reference from the Diagram 4, this option allows you to specify the exact content of the email sent to administrators email address.
3. Email To User: With reference from the Diagram 4, this option allows you to specify the exact content of the email sent to a user.If the checkbox "Email a copy of this message to your own address" is checked a copy of the Email is sent to the user’s Email ID.
4. Confirmation Page: Here you can create the page that is displayed to a user after they dispatch any message via the FlexiContact form. The confirmation message can be delivered either by a link to a confirmation page on the website, OR by specifying confirmation content here as shown in the Diagram 6.
NOTE: If a link is being specified its path must be relative to website root or a full URL. If you specify a link and some text, the link is used and not the text.
Diagram 6
5. Form Fields: This section allows you to configure the fields that appear on the FlexiContact form. Enter the following details for the Form Fields as shown in Diagram 7.
The following are the list of options provided:
Show subject
This option controls the display of the subject field or not.
Default subject
Will hold the text that will be set as the default subject text
Show copy checkbox
This option controls whether the "Email a copy of this message to your own address" checkbox is included on the form or not.
Message
This is the message box where the site visitor types in a message to you. You can specify the size of the message box in width and height.
List
By enabling this option you can show a dropdown list in the FlexiContact form. This is disabled by default. To use it, specify a prompt, and a list of words or phrases separated by commas.
Eg. Prompt: "How did you find us?"
List: “Newspaper, Pamphlet, Magazine, Google, Other"
Fields 1 to 5
These are all disabled by default, but you can activate them and use them to collect any specific information you want from a site visitor.
Click Save and Close after filling all the details as shown in Diagram 7, in order to save the Form Fields and close the edit screen.
You can also click Save, in order to save the Form Fields updated data and stay on the editable screen.
Diagram 7
6. Top Text The Top Text configuration can be access via the FlexiContact configuration panel as shown in the Diagram 8
Diagram 8
On click of Top Text link the page is displayed in the browser as shown in the Diagram 9.
Diagram 9
The text entered here using the wysiwyg editor will appear above the FlexiContact form. You can easily include formatting, images, and links.
7. Bottom Text
The Bottom Text configuration can be access via the FlexiContact configuration panel as shown in the Diagram 10
Diagram 10
On click of Bottom Text link the page is displayed in the browser as shown in the Diagram 11.
Diagram 11
The page text entered here using the wysiwyg editor will appear below the form. It can be overridden by the menu item. You can easily include formatting, images, and links.
8. Front end Styles The Front end Styles configuration can be access via the FlexiContact configuration panel as shown in the Diagram 12
Diagram 12
On click of Front end Styles link the page is displayed in the browser as shown in the Diagram 13.
Diagram 13
This option allows you to edit the CSS stylesheet that FlexiContact uses for the contact form.
The contact form uses a number of css classes, and loads its own style sheet.The style sheet used with FlexiContact is available at: <yourjoomlasite>/components/com_flexicontact/assets/com_flexicontact.css
com_flexicontact.css defines styling rules for the following elements:
.flexicontact :- The entire FlexiContact page
.fc_form :- The form containing the fields
.fc_table :- The table within the contact form
.fc_table tr :- The rows of the table
.fc_table td :- All the cells of the table
.fc_table td.fc_:- Prompt cells of the table
.fc_table td.fc_ :-Field cells of the table
.fc_error :-Error messages
.fc_table td.fc_ :-cell that contains the captcha images
.fc_table td.fc_ :-cell that contains the Send button
.fc_inactive :-The styling for un-highlighted captcha images
.fc_active :-The styling for the highlighted captcha image
9. Captcha Images The Captcha Images configuration can be access via the FlexiContact configuration panel as shown in the Diagram 14
Diagram 14
On click of Captcha Images link the page is displayed in the browser as shown in the Diagram 15.
Diagram 15
Here you can view and delete captcha images. To delete images, select the images using the checkbox, and click the Delete toolbar button.
Now click on View Site at the top-right hand corner to view the homepage of your website as shown in Diagram 16.
Diagram 16
The homepage of the website opens. In the top menu click on Contact Us as shown in the Diagram 17
Diagram 17
Contact Form would now appear as shown in Diagram 18.
Diagram 18
0 komentar:
Posting Komentar