Shortcode Options
The features of this template can be customized by adding the following options to the Connections shortcode.
Here’s an example shortcode that can be used for that changes the number of entries displayed per page, sets the pagination to be displayed at the bottom of the list. As you see in this example shortcode, you only need to add the options you wish to change from the default setting and you can mix and match the options to suit your needs.
[connections template='market' page_limit='32' pagination_position='after'] |
Here’s the list of options the Market template adds to the shortcode with their default setting.
enable_search=TRUE enable_pagination=TRUE page_limit=20 pagination_position='before' enable_category_select=TRUE show_empty_categories=TRUE show_category_count=FALSE enable_category_by_root_parent=FALSE enable_map=TRUE enable_bio=TRUE enable_bio_head=TRUE enable_note=TRUE enable_note_head=TRUE enable_website_link=TRUE show_addresses=TRUE show_phone_numbers=TRUE show_email=TRUE show_im=TRUE show_social_media=TRUE show_dates=TRUE address_types = 'home, work, school, other' phone_types = 'homephone, homefax, workphone, workfax, cellphone' email_types = 'personal, work' date_types = 'anniversary, baptism, birthday, deceased, certification, employment, membership, graduate_high_school, graduate_college, ordination' link_types = 'blog, website' image='logo' image_width=NULL image_height=NULL image_fallback='block' tray_image='photo' tray_image_width=NULL tray_image_height=NULL tray_image_fallback='none' map_zoom=13 map_frame_height=400 card_width=440 category_width=175 str_select='Show All Categories' str_image='No Logo Available' str_tray_image='No Photo Available' str_map_show='Show Map' str_map_hide='Close Map' str_bio_head='Biography' str_bio_show='Show Bio' str_bio_hide='Close Bio' str_note_head='Notes' str_note_show='Show Notes' str_note_hide='Close Notes' str_contact='Contact' str_home_addr='Home' str_work_addr='Work' str_school_addr='School' str_other_addr='Other' str_home_phone='Home Phone' str_home_fax='Home Fax' str_cell_phone='Cell Phone' str_work_phone='Work Phone' str_work_fax='Work Fax' str_personal_email='Personal Email' str_work_email='Work Email' name_format='%prefix% %first% %middle% %last% %suffix%' contact_name_format='%label%: %first% %last%' addr_format='%label% %line1% %line2% %line3% %city%, %state% %zipcode% %country%'
FAQs
Can I switch templates without having to reenter my entries again?
Absolutely! You can switch templates as often as you wish, your entries will be intact. Think of templates for Connections like themes for WordPress. The primary purpose of a WordPress theme is to change the visual style of your site. The primary purpose of Connections’ templates, just like WordPress themes, is to change the visual style of your directory. Just as you can switch themes in WordPress and not loose your pages and posts because they are saved in the WordPress database, you can switch templates in Connections.
Why am I receiving “Oops! Something went wrong.” error?
If you are receiving the error message instead of a Google Map then you need to set your Google Maps API Browser and Server keys. To learn how, please refer to the Get Google Maps API Keys tutorial.
As soon as I select a ‘category’ search is performed with the keyword ‘Search’ by default.
This is likely being caused by the theme including a “buggy”, in my opinion, HTML5 shim script. The purpose of these shim scripts is to enable HTML5 features in browsers that do not support them. They work pretty well … but, there seems to be a bug in this shim script.
When you click on a category, the “Search” placeholder string in the search box is being sent as a search keyword term. So you’re actually searching for “Search” within the category being selected. Obviously not what we want to do.
The fix will be to remove the “Search” placeholder text. To do this easily, we can use another plugin.
Changing the search string can be done with the Say What? plugin.
It’ll add a new Text Changes menu item under the Tools admin page.
Click Add New, enter the string exactly as shown in Connections, Search.
Next enter connections (notice the lack of capitalization, that’s important!) as the domain and then enter your new text. In this case leave it blank.
That should fix it.
Why doesn’t the map work?
There’s a few reason the map would not work. Let go thru them…
1. The theme does not have the wp_footer() template tag in its foot. If the theme does not have this, it will break many plugins that require it.
2. There could be a fatal javascript error in another plugin or in the theme that is causing other plugin’s javascripts to not run. You can check this by loading your site into Chrome, hitting the F12 key and then clicking the Console tab. If there are errors listed here, they could be why the map is not working.
3. The theme or another plugin is also queueing the Google Maps API. When it is loaded more than once, it will often times fail to function correctly. If that is the case, try unchecking the Google Maps API option on the Connections : Settings admin page under the Advanced tab in the Compatibility section.
Can you explain the image shortcode options?
The cMap and Market have two image locations. By default the logo is shown in the upper left of the entry card. This image location is the image
shortcode option. The following shortcode options affect the image
shortcode option:
image_width image_height image_fallback str_image=”No Logo Available”
When a logo image has been uploaded to the entry, by default, it will show here. If no logo has been uploaded then the fallback “No Logo Available” block will be shown.
The second image location is in the bio content tray. The bio content tray will only show when the has been content entered into the Biography field for the entry. The photo image will only show in bio content tray if a photo has been uploaded to the entry. This image location is the tray_image
shortcode option. The following shortcode options affect the tray_image
shortcode option:
tray_image_width tray_image_height tray_image_fallback str_tray_image=”No Photo Available”
The valid options for image
and tray_image
are:
logo
photo
The valid options for image_fallback
and tray_image_fallback
are:
block
none
The height and width options control the image
and tray_image
dimensions.
The two str_
options control the text that is shown when the _fallback
options are set to block
.
So, with all that said, here’s what the default shortcode for cMap and Market look would look like if you had to set the default options in the shortcode manually:
Examples:
– Remove Logo
– Display Photo only AND – Display “No Photo Available” if no image
Why does the template layout look wrong?
There are primarily two reasons this issue occurs:
When copy-pasting the shortcode into a page or post while using the rich text editor (the Visual tab), HTML tags will also be pasted. The solution is to paste the shortcode into the HTML editor (the HTML tab) or use the “Paste as Plain Text” button in the Visual editor.
To fix this, go to the page or post where you pasted the Connections shortcode, switch to the HTML editor and remove any HTML tags that surround the shortcode, for example, <pre></pre> and <code></code>.
Two, many commercial themes support shortcodes named [raw]
or [noformat]
. If your theme does, wrap the Connections shortcode within one of them. Here are examples of how to use the [raw]
and [noformat]
shortcodes.
[raw][connections][/raw]
[noformat][connections][/noformat]
Why? The theme is removing and re-applying the wpautop
filter, interfering with all shortcodes. Here’s a link to a comment that explains the issue in more detail: http://wpforce.com/prevent-wpautop-filter-shortcode/#comment-1328. And here’s another link with more info: http://theandystratton.com/2011/shortcode-autoformatting-html-with-paragraphs-and-line-breaks
If the [raw]
or [noformat]
shortcodes do not work; please visit the Support Forum for assistance. A copy of your theme may be required to debug the issue.
UPDATE: 03-15-2013
The package could not be installed. The theme is missing the style.css stylesheet.
I get the following error, what does it mean?
The package could not be installed. The theme is missing the style.css stylesheet.
If you are trying to install a Connections template as a theme you will receive this error. Connections templates must be installed as a plugin. Please following the template installation instructions found here:
http://connections-pro.com/documentation/install/templates/
How do I hide the image?
The image can be hidden by using the image_fallback template shortcode option.
NOTE: Functionally, this only disables the image placeholder when an image has not been uploaded to an entry. What this means is if you upload an image to an entry, it will still be displayed.
/* * Example * If there is no image uploaded to the entry, * setting this option disables the image place holder. */ [connections image_fallback='none'] |
How do I change the image size?
There are two ways to change the image size. The best way is to change the setting on the Connections : Settings admin page for the ‘Medium, Image Settings’. You would set the height and width to the template recommended size. The recommended image size can be found on the template product page under the ‘Recommended Setting’ tab. The benefit of this method is that when the image is added to an entry, the image is created and cached so when the image is shown in the template the template uses the cached image. This is better for the server load. The downside is that any image you have uploaded previously to an entry will have to be re-uploaded for the new settings to be applied to the image and the cache to be updated. A future version of Connections will address this.
The other way to adjust the image size is dynamically by using two template shortcode options, image_height and image_width. When either of these options is used the image will be created at the set size dynamically when the page is loaded. The downside is increased server load as these images have to be re-created periodically. Here are some examples:
/* * Example 1 * Change the image width. The height will be dynamic based on the image scale ratio. */ [connections image_width=200] /* * Example 2 * Change the image height. The width will be dynamic based on the image scale ratio. */ [connections image_height=150] /* * Example 3 * Change the image height and width. The image will be scaled proportionally to fit the values. */ [connections image_height=150 image_width=200] |
Exception
The templates Excerpt Plus, Excerpt, Slim Plus and Slim will automatically create images from the source image that are
120px x 100px. It does not use the pre-cached image sizes created when you add a image to an entry. You will have to pre-process the image, scale and crop. If you upload a pre-cropped image using the same ratio (6:5) that would work too. For example, images with the dimension of 200px x 167px or 110px x 92px. Here’s the math…
( width / height ) * new-height = new-width
OR
( height / width ) * new-width = new-height
Exception
The templates Tile Plus and Tile will automatically create images from the source image that are
100px x 130px. It does not use the pre-cached image sizes created when you add a new image. You will have to pre-process the image, scale and crop. If you upload a pre-cropped image using the same ratio (10:13) that would work too. For example, images with the dimension of 200px x 260px or 110px x 143px. Here’s the math…
( width / height ) * new-height = new-width
OR
( height / width ) * new-width = new-height
How do I embed a YouTube or Vimeo video in the Bio or Notes field?
To embed videos in to the bio and notes field you must use the WordPress shortcode. The examples show only YouTube and Vimeo, but any of the sites that the shortcode supports can be used.
/* * Example 1 * Embed a YouTube video */ [embed]http://www.youtube.com/watch?v=Zs-8-cWFbOU[/embed] |
/* * Example 2 * Embed a Vimeo video */ [embed]http://vimeo.com/26963550[/embed] |
If you would like to embed a video that pops using a lightbox effect, use the WP Video Lightbox plugin instead of the shortcode.
How do I use the str_***** shortcode options?
Every string in a template can be customized to suit your specific needs. This can be done by setting template-enabled shortcode options. These string shortcode options all begin with “str_”. Every template differs on what strings are available to be customized; please refer to the template’s documentation [currently under construction] to learn more. But here are a couple of examples that will work across most templates.
/* * Example 1 * Change the 'Home Phone' label to 'Phone' */ [connections str_home_phone='Phone'] /* * Example 2 * Change the 'Personal Email' label to 'Email' */ [connections str_personal_email='Email'] /* * Example 3 * You can add as many string customization shortcode options as needed. * * Change the 'Personal Email' label to 'Email' * AND * Change the 'Home Phone' label to 'Phone' */ [connections str_personal_email='Email' str_home_phone='Phone']
How do I use the addr_format shortcode option?
Explaining how the addr_format shortcode option works is difficult, so I will provide some examples.
First, some background.
The addr_format option accepts only a few specific tokens.
Tokens are the % symbols, and the word between, for example, %label%, is a token.
The valid tokens for the addr_format option are:
%label%
[NOTE: unless this is overridden, the label will be the address type.]%line1%
%line2%
%line3%
%city%
%state%
%zipcode%
%country%
When processing the display of the address, Connections will scan for each token and replace it with the corresponding address segment. Each token should only be used once, even though you could use each token more than once, but that is not recommended.
Here’s the default layout of the tokens that create the format of the address:%label% %line1% %line2% %line3% %city%, %state% %zipcode% %country%
Your first question might be, but the address items are stacked in the traditional block layout, not on a single line; how is that being accomplished? The block layout is achieved using CSS, which can easily be overridden to display the address segments inline. How to override the CSS is a separate topic.
On to the examples.
// This will display the address minus the label and country fields. [connections addr_format='%line1% %line2% %line3% %city%, %state% %zipcode%'] // This will display the address with the state and city switched, common in eastern Europe. [connections addr_format='%label% %line1% %line2% %line3% %state%, %city% %zipcode% %country%']
How do I change the width of Market?
By default the Market entry card is 440px wide and the category sidebar is 175px. To change the overall width you need to change two Market enabled shortcode options. Here is an example:
You do not have to change both options, you can change only one or the other.
Here’s and example that makes the category sidebar wider:
And here is an example to make just the entry card wider:
How do I change the number of entries per page?
By default, the template will show 20 entries per page. You can change the number of entries per page by setting a template-enabled shortcode option, page_limit. Here is an example:
[connections page_limit=10]
How can I hide empty categories?
You can hide empty categories by setting a template-enable shortcode option, show_empty_categories. Here’s an example:
[connections show_empty_categories='false']
Plugin Conflicts
External Links
http://wordpress.org/plugins/sem-external-links/
The manner in which this plugin alters the outgoing links seem to make the links for both the bio and notes none functional. Currently the only solution is to deactivate this plugin.
NOTE: This FAQ was written based on External Links 4.2
Comprehensive Google Map Plugin
http://wordpress.org/extend/plugins/comprehensive-google-map-plugin/
Both Connections and Comprehensive Google Map Plugin requires the use of the Google Maps API. The Comprehensive Google Map Plugin has a function which looks for other instances where the Google Maps API has been registered and if it finds one, it unregisters it. This will completely break templates [and any other plugin, actually] which require the Google Maps API because the Google Maps API is registered as a dependency. If the dependency does not exists, WordPress will not load any other script which depends on the missing dependency. There is a solution…
Install the Code Snippets plugin.
Add a new snippet using this:
add_filter( 'wp_head', 'cn_market_register_google_maps_api', 999 ); function cn_market_register_google_maps_api() { global $connections; if ( ! is_ssl() ) wp_register_script( 'cn-google-maps-api', 'http://maps.googleapis.com/maps/api/js?sensor=false', array( 'jquery' ), CN_CURRENT_VERSION, $connections->options->getJavaScriptFooter() ); if ( is_ssl() ) wp_register_script( 'cn-google-maps-api', 'https://maps.googleapis.com/maps/api/js?sensor=false', array( 'jquery' ), CN_CURRENT_VERSION, $connections->options->getJavaScriptFooter() ); } |
Save and Activate the new snippet.
Now, both Connections, its template and the Comprehensive Google Map Plugin should play nicely together.
The only other option is to use another plugin. A user suggested Leaflet Maps Marker as an alternative to Comprehensive Google Map Plugin.
NOTE: This FAQ was written based on Comprehensive Google Map Plugin 9.0.20
Marquee XML RSS Feed Scroll
http://wordpress.org/extend/plugins/marquee-xml-rss-feed-scroll/
This plugin loads an older version of jQuery even though the bundled version of jQuery may already be loaded which can cause other JavaScripts and jQuery libraries to fail to run. What this means to Connections is that if the template supports expandable content trays for maps bio and notes they will fail to work.
NOTE: This FAQ was written based on Marquee XML RSS Feed Scroll 3.0
External Links
http://wordpress.org/extend/plugins/sem-external-links/
This plugin re-writes the links created for the Note and Bio tray links on the cMap and Market templates causing them to no longer function. The only fix it to disable this plugin.
NOTE: This FAQ was written based on External Links 4.0.6
Better WP Security
http://wordpress.org/extend/plugins/better-wp-security/
When this plugin is active it alters the query strings that WordPress attaches to the JavaScript and CSS files. This will break the loading of the Google Maps API by removing the “sensor” parameter. When this is removed, the Google Maps will not work. How can you check for this error? You can check the browser’s developer tools console log. Each browser is different on where the console log can be found but in most cases it can be brought up by hitting the F12 key and switch to the console log section. The error you’re looking for is:
The Google Maps API server rejected your request. The “sensor” parameter specified in the request must be set to either “true” or “false”.
UPDATE: This issue can be resolved by un-checking the option Generate Random Version Number in Better Security Tweaks
UPDATE 2: When performing a search in IE or Chrome, Firefox seems to be unaffected, the results will be shown. However, if you perform a second search from within the previous search results, you will receive a 404 error. At this time there is no solution other than to deactivate Better WP Security.
NOTE: This FAQ was written based on Better WP Security 2.18
Auto Thickbox Plus
http://wordpress.org/extend/plugins/auto-thickbox-plus/
This plugin re-writes the links created for the Note and Bio tray links on the cMap and Market templates causing them to no longer function. The only fix it to disable this plugin.
NOTE: This FAQ was written based on Auto Thickbox Plus .3.
UPDATE: Version .6 and newer resolves this conflict.
Events Made Easy
http://wordpress.org/extend/plugins/events-made-easy/
If the template you are using has an embedded Google map and only an empty box is showing, the cause might be a conflict with Events Made Easy.
This plugin still uses the Google Maps API 2 which is loaded in the head of every page instead of just the pages it is needed on.
Connections uses Google Maps API 3 which is only loaded on the page foot where it is being used.
When the request for the map is sent to Google, it is using the Google Maps API 2 because it was loaded first in the page head by Events Made Easy. The map request from Connections is sent in the Google Maps API3 format which causes a JavaScript error and the map fails to load.
Unfortunately there is no fix for this conflict. The developer for Events Made Easy would need to alter it so it only loads its JavaScripts on the pages where the plugin needs them.
NOTE: This FAQ was written based on Events Made Easy 1.0.1