- The Plugin Dashboard
- Adding a New Profile
- Contact Page Tab
- Grid View Tab
- Contact Widget Tab
- Shortcodes - Profiles & Groups
Free Lite Version – Use the WordPress plugins uploader. Under Plugins Click > Add New and search ‘Contact Us Page Contact People’ to find the plugin in the WordPress repository. Once you find it Click Install.
1.If you are upgrading from the Lite Version of the plugin to one of the 2 available Pro License versions you must deactivate the Lite Version before you try and activate the Pro version – if you don’t you will get a ‘Fatal Error’ – Cannot Re-Declare Class message. This happens because the plugins share the same folder and WordPress will not create duplicate folders. The same applies if you are upgrading from the Pro Version to the Ultimate Version.
2. If you have purchased the Contact People Ultimate Pro License – you will find your License key and plugin Download button under the ‘Subscriptions Downloads’ tab – not the ‘Downloads’ tab because it is an annual subscription License.
Lite Version – The Lite version is provided Free without a License key and hence we offer no support. We will always keep the plugins source code compatible with the latest version of WordPress. If you require support you do have 2 options:
1. You can read through the topics posted by Pro License Holders on the plugins a3rev support forum and see if you can find the answer there. Only Pro License holders have ‘write’ access to the forum.
2. Post your support request to the plugins WordPress support Forum – another Lite Version user may decide they can help you.
Pro License Holder – Post your support request to the plugins and we will do our utmost to reply within 24 hours (that is our goal).
Email Support – If you are a Lite Version user and send us an email requesting support – you will not get a reply. If you are a Pro License Holder we will respond but it will take 7 to 14 days. We are terrible at answering emails.
How to navigate these docs.
The most efficient way to use these docs is:
1. Sections – These docs are broken up into sections. There is a ‘View Docs’ button at the top of each of the plugins dashboard admin pages with links to that section of the docs. A table of Contents at the top of the docs takes you straight to the selected section of the docs.
2. Back to Top – Under each section you will see a Go Back to Top link. Click on it to return to the top and the table of Contents to continue your research.
3. Images, Numbers and Images notes. Each section has a full image of that part of the dashboard with Coloured numbers. Below the image is a Corresponding text explanation of what each numbered feature does. We do it like this so that that don’t speak or read English can use Google translator to be able to get value from the docs.
4. Coloured Numbers for quick Version reference.
VERSION NUMBER KEY
Colour numbers visually show you which version of the plugin the feature is activated on.
1. Red Circle – Activated in Lite Version and by default in the Pro Version and the Ultimate Versions.
2. Green Circle – Pro and Ultimate version Features, not available in Lite version.
3. Purple Circle – Ultimate Version feature, not available in Pro or Lite Versions.
5. Hints and Tips – These are usually easily spotted as they are highlighted in a Red Box.
6. Quick Links – Under each section you will see Quick links. Designed to be a short cut to relevant information and the docs.
7. Troubleshooting – We try and post any known issues and the fix in the Troubleshooting section at the end of the doc. This includes known Theme or plugin conflicts.
The Plugin Dashboard
When installed the plugin adds its own dashboard to your wp-admin sidebar dashboard menu.
1. Contact us. Once installed and activated the plugin auto opens at the plugins dashboard. You will see that ‘Contact Us’ has been added to your wp-admin dashboard menu. NOTE: In the Contact People Ultimate this is Contact People.
2. Profiles. Mouse over ‘Contact Us’ in the menu and you will see the pop out menu with the plugins dashboard sub menu – The opening page of the ‘Contact Us’ menu is ‘Profiles’
2. Add New Profile - Click on this sub menu item to add a new profile.
3. Groups – Click on this link to add and manage Groups.
4. Settings – Click on this link to access the plugins Settings dashboard.
5. Profiles – When you activate the plugin the plugin auto redirects you to the Profiles menu – Of course there will be no profiles – Click the ‘Add New’ button to start creating your first profile.
6. Profiles Dashboard – Once you have created some profiles they display here. See the Adding a New Profile section below.
7. Edit | Delete Profiles – Use the Edit link to access the Profiles edit page. Use the Delete link to remove the Profile from your database.
Adding a New Profile
You can set up as many new profiles as you like. A Profile can be:
- A Person
- A Position within a business or company.
- A Department
- A Branch Office or location.
- Your Cat – seriously – anything you can think of.
Every Profile created automatically shows on the ‘Contact Us Page’. You can sort the order the Profiles show in by using the Blue up – down arrows on the left of each Profile on the ‘Profiles’ admin page. Put your mouse over an arrow – left click and hold the mouse down. Then drag the profile up or down to the position you want and release the mouse left clicker.
Title / Position – example CEO, Managing Direction, Dispatch, Customer Support, Chief Cook and Bottle washer.
Name – Obvious
Profile Image – Use the Upload button to open a window on your computer to select and upload an image – accepted formats are .jpg and .png. Size does not matter as the image is auto re-sized. remember that the larger the image – the longer it will take to load on the front end.
3. Contact Details:
Email – If you want the profile to be contactable directly by email you must enter an email address here. All emails sent from this Profiles Contact Grid will be delivered to the email address entered here. The email address is never visible from the front of the site. Protects you against email scrappers.
Phone, Fax, Mobile – enter numbers in any format you like.
Website – enter the full URL that you want the this Profile to link to.
4. About – Enter a brief description about the Profile. If you have a lot of information to enter here – for example a bio – add a extract and use the Website link to link to the full version on a Post on your site or anywhere else. You have the full WordPress Visual editor to create this description.
5. Location address - Add an address for the profile that Google maps can find. Full street, Town / City, Country and postcode is best for accurate placement of the profiles marker on the map. The Longitude and Latitude will auto show after you Create the profile.
6. 3RD Party Contact Form for this profile. The plugin supports using either the free Contact Form 7 plugin or the Premium Gravity Forms plugin to create a unique Contact form for each profile. Create a form, Activate the 3RD party contact forms feature on the settings and paste the form shortcode here. If can create a form and enter the shortcode on the Settings admin panel and it will auto be used for each profile. If you do that you can over – ride it for any profile by enter a unique shortcode here.
7. Assign Profile to Groups. The Profile automatically show son the default ‘Contact Us page’. You can create any number of ‘Groups’ and assign this profile to any number of those Groups. Groups are inserted into pages and posts by shortcode.
Any field that is left blank automatically deactivates that field on the Profiles contact Grid. Example – if you do not want a mobile phone number to show for the profile – leave the phone field blank.
Groups allow you to create Groups of Profile Contacts and insert them by a unique shortcode into post and page anywhere on your site. Assign any number of Profiles to a Group. Use the Post or page a3 Shortcode button to insert the Group with these custom settings
- Select any Group
- Show or Don’t Show group Title above profiles
- Show or don’t show Google location map above Profiles.
- Set the number of columns that the profiles show in across the page.
- Add any number of Groups to a post or page.
Adding a new Group
Click on the Groups link in the Contact Us sub nav list and the Groups admin panel will open. To add a new Group click on the ‘Add New’ link at the top of the page to the right of the page title – ‘Groups’
1. Add New Group
2. Group Name – call the group something that makes it easy for you to identify. Example – London Office.
3. Activate Shortcode. This feature allows you to create a new Group with the option to make the shortocode active now or later. You might use this while you are still creating profiles to assign to the Group. When the Shortcode is activated is appears as an option in the Insert Shortcodes pop-up screen (see section #26). To activate the Group shortcode feature later just edit the Group and change the setting.
4. Create | Cancel. Click Create to create this group or click cancel to abort the settings and changes you have made and return to the Manage Groups admin panel.
Easily manage all of the Groups you have created from the groups admin panel. Click on the Groups in the ‘Contact Us’ sub nav section on the wp-admin sidebar to access.
1. Add New – Click this link to add a new group.
2. Name – The name you have given the Group.
3. Shortcode – The Group shortcode. You can copy and paste the shortcode into any post or page , but we recommend you use the Contact Shortcode insert pop-up window (see section #26) to insert the group shortcode because you can edit the way the group shows before you insert it.
4. Profiles – Shows you at a glance how many Profiles are assigned to each group.
5. Activated – Yes / No – see at a glance if the shortcode is activated.
6. View Profiles – Click this link to view and mange all of the Profiles assigned to a group.
7. Edit – Click this link to edit the Group.
8. Delete – Click this link to delete a Group – Doing this automatically un-assignes profiles from the group in the deletion process.
Managing Group Profiles.
To manage all the Profiles assigned to a Group – on the Groups admin panel Click on the ‘View Profiles’ link for that Group.
1. ‘Group Name’ Profiles – When you click on the ‘View Profiles’ link for a Group it opens an admin page that show the ‘Group Name’ Profiles – all of the Profiles that have been assigned to that Group.
2. Sort Order – Use the Blue up – down arrows to sort the order profiles show in this group. Put your mouse over an arrow and left click but don’t release the clicker. Then drag the Profile up or down the table. When it is at the position you want it to show within the group – release the mouse clicker and the profile will drop into place – that is sort by drag and drop.
3. Profile Image thumbnail.
4. Profile Name
5. Email – See at a glance if the Profile has Email Contact activated.
6. Phone – See at a glance the Profiles Phone number.
7. Location – Profiles entered address.
8. Groups – See at a Glance which other Groups this profile is assigned to. Each Group name is a clickable link to that Group.
9. Edit – Click this link to edit the profile.
10. Remove – Click this link to remove this Profile from the Group without leaving the page.
Contact Page Tab
Clicking on the ‘Settings’ sub menu opens the plugins settings dashboard. The dashboard has 3 tabs and each tab has a Sub nav menu for ease of navigation. The Settings admin panel opens on the Contact Page Tab – sub menu item – Settings.
1. Contact Page – Tab
2. Settings sub menu nav bar. Settings is the open sub nav
3. Contact Us Page – On activation the plugin auto creates a WordPress page with the title ‘Contact Us Page’ and inserts the Contact Page shortcode. DO NOT DELETE THIS PAGE. If you do the Contact Us page cannot show. You can change the title of the page or even create a new page and add the shortcode – BUT if you do you MUST come back to this setting and use the drop down to select that page here. Doing that tells the plugin where it can find the shortcode.
4. Clean up on Deletion. Contact Us Page – Contact People creates it won tables within the WordPress tables. If you activate this setting when you Delete the plugin it will delete everything the plugin has created INCLUDING all of the data you have entered. If you plan on upgrading to a Pro Version of the plugin – do not activate this setting or you will have to enter all of your settings and Profiles again.
Use the settings on this sub nav page to configure the Google locations map that shows on the Contact Us page and for Groups inserted by shortcode and configured to so a map with the Group Profiles.
1. Location Map sub menu – Click on the blue Location Map sub menu item to open the admin panel.
2. Enable/Disable map – Make sure this is checked if you want the Google map to show on your Contact Us page. This setting does not affect Group Maps which are configured when you insert the Groups shortcode.
3. Zoom Level – This is Google maps Zoom – the lower the number the wider the Zoom. Higher the number the closer in the map zoom will be.
4. Map Type – Again this is Google maps setting – choose from ROADMAP | SATELLITE | HYBRID | TERRAIN
5. Map Width Type – Choose % for Responsive Themes and px for old fixed width themes.
6. Map Width – This setting depends on what you made in the previous setting – map Width Type. For Responsive Themes choose 100 and the map will be 100% wide of the page content area. Or any number under 100 – example 75 will mean the map takes up 75% wide of the content area (if you selected % in the Map width setting in item #5). If you are using a fixed pixel theme (not responsive) then this setting is pixels width of the map – so setting 100 will only give you a map 100Px wide.
7. Map Height – Set this in px. In responsive themes the map height is the base that map scaling is worked of – as a % of the map wide to give a truly responsive result in mobiles and tablets. In fixed px themes – the map will always shows as fixed wide and height in proportion with the theme render in mobiles and tablets.
8. Primary Location Address – Important! You must enter an address here that Google Maps can recognize or else the map will not show. The centre address can be a Country – and the map will open with the marker in the geographic Centre of that Country – But enter something like ‘My Place’ and the map will not show – Its a Google Map – Google has to be able to find something to show the Map.
Go Back to Top
People Contact Forms
Under this sub menu item you select to use the plugins default Email Contact Form or to use custom forms created by a 3RD Party Contact form plugin for Profiles email contacts. Note that there are 2 3RD party Contact Plugins that are supported:
Contact Form 7 – Very popular Free WordPress plugin with over 12.5 million downloads
Gravity Forms – What we consider the #1 Premium Contact Form plugin for WordPress.
1. People Contact Forms – The form that is used for the Profile Grid Email Contact Form.
2. Default People Contact Forms – This is the plugins default contact form. In the Contact Us Page – Contact People Pro Version and Contact People Ultimate plugin admins have the option of using the default form or a custom form created by the Free Contact Form 7 plugin or the Premium Gravity Forms plugin. The Pro and Ultimate versions are fully integrated with those 2 plugins and they allow you to create forms with advanced custom fields and features.
3. Default Contact Form – Check this to use the plugins default Contact Form
4. ‘From name’ – Set the name that the user see when they receive the email inquiry. If left blank then it uses your site name.
5. ‘From Email Address’ – This is the email address that the user see’s when they get the email. Set it at whatever you want – If left blank it shows the site admin email address.
6. Send a Copy to Myself – Select this to show a option at the bottom of the default email contact form pop-up so the users can get a copy of the email inquiry they are sending. The copy is sent to the email address they have entered on the form.
7. 3RD Party Contact Forms – This section is where you activate 3RD Party contact forms. O Check to enable contact form from Gravity Forms or Contact Form 7 to activate this feature.
8. Contact Form Shortcode. Enter the shortcode for the form you have created here. This form will apply to all Profiles. You can over – ride this by making a unique form for profile or profiles and adding the shortcode for that form on the Profile edit page.
9. Custom Form Opening Options. The plugin supports 3 methods of opening the Profile email contact form.
O Open contact form on new page – new window. – This is the default method and will be used unless you change it.
O Open contact form on new page – same window.
O Open contact form by Pop-up.
10. People Contact Form page. A “Profile Email Page” was auto created when the plugin is activated. It contains the shortcode [profile_email_page]. This page and shortcode is required to show the contact form for each profile if you have chosen to open the form on a new page in the settings in item #9 above . If you want to change the page Title that shows when people click to email then go to your wp-admin dashboard > Pages – find the Page ‘ Profile Email Page’ and edit it. Change the Page title to what you want and update. NOTE: You can also change the permalink BUT in both cases you must come back to this setting and ensure that new page is selected in item #11 below.
11. Profile Contact Page – The page with the [profile_email_page] must be set here. This must be set so the plugin can find the page to show the email contact form. If it is not set or the page that is set here does not contain the shortcode then users will get a 404 page not found error when they attempt to send an email to the Profile.
12. Global Re-Set – O Check and ‘Save Changes’ to auto reset all unique profile contact form shortcodes that have been set, to the Global Contact shortcode set on this page. If you do this ALL profiles will auto be reset to use the 3RD Party Contact form shortcode entered in item #8 on this admin panel.
13. Save Changes | Reset Settings. You must click Save Changes for any changes you have made in these settings to take effect. Rest Settings rests all settings on this admin panel back to the install defaults.
Contact Pop-Up Style
1. Contact Pop-Up Style. Click on the sub menu to access styling options for the plugins default contact pop-up form. Please note these settings DO NOT apply to the 3RD Party Contact form pop-up. The Contact Form 7 and Gravity forms contact forms should be styled from those plugins.
2. Email Pop-up Font Styling . These WYSIWYG settings apply to the Field Text Titles on the Plugins Default Pop-Up form.
3. Font. Use the drop down to select a font type from the 17 ‘web safe’ fonts. These fonts are universally considered to be the safest to use for consistent endearing across all browsers including tablets and mobiles. Please note though that each browser will render the font slightly differently – that is the way it is. These are the 17 fonts that are considered as the most compliant to ALL browsers. If you do not select a font type the plugin will use your themes default content font.
4. Font Size. Select a font size in px from the drop down. If you do not select a font type the plugin will use your themes default content font size.
5. Font Style. Select a font style from the drop down. Chose from – Normal, Italic, Bold or Bold/Italic. If you do not select a font style the plugin will use your themes default content font style.
6. Font Colour. Select a font colour by clicking in the text box and using the colour picker or type in a Hex number. If you do not select a font colour the plugin will use your themes default content font colour.
7. Save Changes | Reset Settings. You must click Save Changes for any changes you have made in these settings to take effect. Rest Settings rests all settings on this admin panel back to the install defaults.
Grid View Tab
Clicking on the Grid View tab for all settings related to the Profiles Grid display on the front end. Those settings are organized into groups under the sub menus Profile Grid Layout | Grid View Styles | Profile Image Style | Grid View Contact Icons.
Profile Grid Layout
Create your own unique Contact Page layout and Profile Contact Grid design and do it faster than any developer could without touching a single line of HTML, CSS or .php code with the plugins built in fast and easy to use point and click layout editor.
Change or tweak the layout anytime you like and best of all know your work is fully CCS3, HTML5 compliant, mobile responsive and will render perfectly in all PCs, tablets and mobile phones. You are a web programming guru now.
1. Grid View Tab – Click on this tab to access all of the Profile Grid View Layout and Style settings.
2. Profile Grid Layout – sub menu. This is the default open menu when you click on the Grid View tab.
3. Grid View Profile Layout. These layout settings apply to the Profile Grids on the Contact Us Page. Some of them also apply to the Profiles and Groups shortcode but both of those have their own settings which are applied from the shortcode insert pop-up window.
4. Grid View Title. The Title that shows above the Profiles on the Contact Us page. Groups have their own title and the option to show the title or don’t show it.
5. Grid View Column. From the drop down select how many columns you want the profiles to display in. This will vary from theme to theme. Columns determines how many profiles will show per row. Naturally the less columns the wider each Profile Grid will be. Groups have their own settings for this in the shortcode insert pop-up window.
6. Profile Image Position. These settings allow you to select 1 of 3 Profile grid designs. The style selected here applies to all Profile Grid types – Contact Page, insert single Profile by shortcode, and insert Groups by shortcode. The 3 layout styles are:
O Image Top – Content Bottom (Default)
O Image Left – Content Right
O Content Left – Image Right
Image Top – Content Bottom is the default setting. If either of the other settings is chosen you will see that the settings below this one change to just one setting that allows you to set the Profile Image Thumbnail wide as a % of the Grid total wide. The profile grid shown on the right of item numbers 6 to 9 in the admin panel extract image is for explanation purposes in these docs – it does not show on the plugins actual admin panel.
Here is a video to show you just what is possible with these settings.
7. Fix Image Height [x] Check to activate. Check the box to set the height of the profile image container when you have the Layout – Image Top – Content bottom selected. When this is selected the wide of image is auto scaled to a proportion of tall. This setting is useful in attempting to create a uniform height for the Profile grids but that depends on how much content is in each grid because the grid view layout is fluid (mobile responsive).
8. Image Fixed Height in Grid View. Set the max height of the image in px. The image will not be stretched to this size – if it is smaller than the max height you set the image will show at actual size – aligned to the top of the container – the container will remain at the max height you set. Example set 200px and will fix image container at 200px with image aligned to the top. Default setting is
9. Show Profile Title Position. The Profile Title/Position is set in each profile. Here you can chose to show the Title / Position above or below the Profile image when the image is aligned to the top of the grid.
10. Save Changes | Reset Settings. You must click Save Changes for any changes you have made in these settings to take effect. Rest Settings resets all settings on this admin panel back to the install defaults.
Grid View Styles
Pro and Ultimate Version License holders – Create your own unique Profile Contact Grid design faster than any developer could do it and all without touching a single line of CSS code. Change or tweak the design anytime you like with the plugins unique fast and easy to use point and click style editor.
Change or tweak the style anytime you like and best of all know your work is fully CCS3, HTML5 compliant, mobile responsive and will render perfectly in all PCs, tablets and mobile phones. You are a web design guru now.
1. Grid View Styles. Don’t worry about editing your themes CSS to create the perfect style for your Profile Contact Grids. The Pro and Ultra Versions of the plugin allow you to do it all by point and click. All the settings for creating a beautiful display Grid design are below.
2. Grid View content padding top/bottom. Padding is another word for space. This setting allows you to set the padding between the content and the outside border of the Grid Container. Set it in px value eg 10 or 5 or whatever you want. This setting applies to the top and the bottom of the Grid Container.
3. Grid View content padding left/right. As per item #2 above – but this setting sets the padding on the left and right of the profile grid container.
4. Grid View background Colour. Use the visual colour picker to create a visually pleasing background colour for your Profile Contact Grids or just type in a hex number if you have one you want to use. Type in the word transparent and the container will have no colour and show the page background colour / design.
5. Grid View border weight. This is the thickness of the Profile Contact Grid Border. Select a px value from the drop down list.
6. Grid View border style. Select from 3 border styles – Solid (Default) | Dashed — | Dotted …..
7. Grid View border colour. Use the visual colour picker by clicking in the text box or just type in a hex number if you have one you want to use to create a unique border colour.
8. Grid View Border radius. This setting controls the 4 corner display of the grid container. Select a px value from the drop down. 0px is the default and is a square. The higher the number selected the greater the rounding of the corners of your grid container will be.
9. Enable/Disable Shadow. The Shadow effect is great if you want create a 2D effect with your grids. In other words the shadow makes the grids look like they are sitting on or above the page. [x] Check the box to enable Grid View shadow effect.
10. Grid View Shadow Colour. Use the visual colour picker by clicking in the text box or just type in a hex number if you have one you want to use to create a unique shadow colour.
11. Save Changes | Reset Settings. You must click Save Changes for any changes you have made in these settings to take effect. Rest Settings resets all settings on this admin panel back to the install defaults.
1. The best way to use the point click styler is to have your Contact Us Page open in another screen. When you make changes and Save on the admin panel > go to the open page and hit the F5 key on your keyboard to refresh the page and you will instantly see the changes you have made. If you don’t see the changes it will be because you have a caching plugin installed and have not configured it to ignore logged in users. If you don’t know how to do that – then turn it off while you are editing the styles so you can see your work.
2. The CSS effects you are creating like rounded corners and Grid Shadow will only show in CSS3 compatible browsers. IE7 and IE8 do not support CSS3 so the effects cannot show in those browsers because they are both underpowered rubbish. If you are one of the 10% of people in the world who have not discovered that yet you should change and you will see just how bright and beautiful the world wide web really is. By the way – IE9 is only slightly better – finally IE10 is comparable to Google Chrome and Firefox browsers. If you are still using IE7, IE8 or IE9 do yourself a favour and download Chrome or Firefox – they are both Free and awesome.
Profile Image Style
Pro and Ultimate Version License holders – Create your own unique Profile Image display style faster than any developer could do it and all without touching a single line of CSS code. Change or tweak the Profile image style anytime you like with the plugins unique fast and easy to use point and click style editor.
Change or tweak the Profile image style anytime you like and best of all know your work is fully CCS3, HTML5 compliant, mobile responsive and will render perfectly in all PCs, tablets and mobile phones. You are a web design guru now.
1. Profile Image Style. Click on the Profile image style sub menu to access all of the point and click image style features.
2. Presentation Style. Use the drop down to select from 3 available image presentations. Rounded Border (Default) | Square Border | Flat Image (no border)
3. Image Background .
Grid View Contact Icons
Contact Widget Tab
Click on the Contact Widget tab for all settings related to the Contact Us Widget Settings. Those settings are organized into groups under the sub menus – Settings | Contact Information | Email Contact Form | Maps Settings.
Email Contact Form
Shortcodes – Profiles & Groups
Add individual profiles and Groups to your sites posts and pages via shortcode.
Known issues and conflicts.
To be Continued ……..
4,535 total views, 5 views today