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 Tile Plus that changes the number of entries displayed per page, sets the pagination to be displayed at the top and 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='tile-plus' page_limit='32' pagination_position='both'] |
Here’s the list of options the Tile Plus template adds to the shortcode with their default settings.
enable_search=TRUE enable_pagination=TRUE page_limit=20 pagination_position='before' enable_category_select=TRUE show_empty_categories=TRUE show_category_count=FALSE category_select_position='before' enable_category_by_root_parent=FALSE enable_map=FALSE card_width=240 card_height=150 enable_website_link=TRUE show_org=TRUE show_image=TRUE show_addresses=FALSE show_phone_numbers=TRUE show_email=TRUE show_im=FALSE show_social_media=FALSE show_dates=FALSE show_links=FALSE address_types='home, work, school, other' phone_types='homephone, homefax, workphone, workfax, cellphone' email_types='personal, work' image='photo' image_width=NULL image_height=NULL image_fallback='block' image_single='photo' image_single_width=NULL image_single_height=NULL image_single_fallback='block' str_select='Select Category' str_select_all='Show All Categories' str_image='No Photo Available' 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.
Permalink | Comments Closed
How can I increase the font size?
Add the following to the theme’s custom CSS area found in the Customizer.
#cn-tile-plus .cn-entry .fn {
font-size: 16px
}
#cn-tile-plus .cn-entry {
font-size: 14px;
}
If you increase the font size, you will likely also need to increase the tile size. To learn how, please see this FAQ.
Permalink | Comments Closed
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.
Permalink | Comments Closed
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.
Permalink | Comments Closed
Why does the template layout look wrong?
There are primarily two reasons this issue occurs:
One, 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 then re-applying the wpautop filter which is 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 [norformat] shortcodes do not work, please visit the Support Forum for assistance. A copy of your theme may be required in order to debug the issue.
UPDATE: 03-15-2013
Permalink | Comments Closed
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/
Permalink | Comments Closed
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'] |
Permalink | Comments Closed
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
Permalink | Comments Closed
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’s a couple 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'] |
Permalink | Comments Closed
How do I change the Tile size?
The default dimensions of the Tile template are 240px x 150px. Tile enables two shortcode options to control the card dimensions. They are card_width and card_height.
Examples:
/* * Example 1 * Change both the height and width. */ [connections card_width=300 card_height=175] /* * Example 2 * Change just the width. */ [connections card_width=300] /* * Example 2 * Change just the height. */ [connections card_height=300] |
Permalink | Comments Closed
How do I use the addr_format shortcode option?
It’s a little difficult to explain how the addr_format option works so I will provide some examples.
But 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%
Now, 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 done? Right, the block layout is achieved using CSS which can easily be overridden to make the address segments display 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, which is common in eastern Europe.
[connections addr_format='%label% %line1% %line2% %line3% %state%, %city% %zipcode% %country%'] |
Permalink | Comments Closed
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] |
Permalink | Comments Closed
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'] |
Permalink | Comments Closed
Plugin Conflicts
Formidable Forms
Formidable Pro ship with an older version of Chosen which breaks Connections use of it. The only solution is to replace the version that ships with Formidable Pro with the newer version that ship with Connections.
Copy the files from this folder:
../wp-content/plugins/connections/vendor/chosen/
to this folder:
../wp-content/plugins/formidable/pro/js/
NOTE: This FAQ was written based on Formidable Forms 1.07.09
Permalink | Comments Closed
Theme Conflicts
ClassiPress
The author of the theme uses a different jQuery plugin to customize select boxes, to which they have set to affect all select boxes globally within the theme. In my opinion, not a smart way of doing it because it’ll affect any plugin that happens to output a select box. There are two fixes, both of which may not be ideal. The first, you could disable the the jQuery plugin the theme uses. The downside, no select boxes in the theme will be enhanced other than the one in template. The second solution would be to disable the jQuery plugin in the template. The downside here would be threefold, you would loose the inline search for categories, the select box will be blank until clicked and the categories will loose their hierarchical appearance. I, obviously recommend disabling the theme’s jQuery plugin but I’ll give you the instructions for both.
To disable the theme’s jQuery plugin:
NOTE: Before following these step, check the theme’s settings to see if there is an option to turn this off.
1. Open the theme-scripts.js file found here: ../wp-content/themes/classipress/includes/js
2. On line 14 add /* to before the $.
3. On line 17 add */ to after the });.
4. Save the file.
5. Upload it back to the originating folder overwriting the original file.
To Disable the cMap jQuery plugin:
1. Open the template.js file found here: ../wp-content/connections_templates/template-name
2. On line 79 add // to before the $.
3. Save the file.
4. Upload it back to the originating folder overwriting the original file.
NOTE: This FAQ was written based on ClassiPress 3.1.9
Permalink | Comments Closed