What’s New

• Language preferences: Content can now be customized to display personalized content based on user's language (site administrator must set display option for language preferences in the configuration panel).

• Improvements to layout and usability including: bug fixes with display of images, ability to configure the fonts and colors for the text, custom HTML in header and footer, and accessibility compliance. We’ve also changed the names of some of the menu items in the configuration panel to be consistent with our other tiles. For example, Places and Content are now part of Setup.

Configuring the Place Grid Tile

Image RemovedImage Added

1. To display the tile’s configuration panel, click the gear icon in the upper right corner of the tile.

2. Select Setup

3. Note: If you have enabled multilanguage option in your configuration, you will see an option to Select Language. In this example, you can configure in English or Spanish. Once done with English, you can then select what will be displayed for Spanish-language speakers.

4. Choose between Automatic or Manual:

   • Automatic

     • Select the exact space to include in the grid. If there are subspaces, they will display as well. 

     • Check Include parent space if you would like the parent to display as well
       

Image Removed

1. • • Image Added

       • NOTE: You cannot uncheck the subspaces,  If you do not want all or some subspaces to display, choose Manual mode instead.

   • Manual

     • Cherry-pick which places or links you would like to appear. 

     • Places:  When you add a space you will be given the option to select its subspaces.  
       

       Image Modified

       • NOTE: If a project(s) are associated with a space or group, you must select them individually, they will not be part of the “include subspaces” checkbox.

       • URL: In addition to places, you can also add a URL to any link if you select Manual. 

         • Add link title

         • Add URL

         • Add tags 

         • Select if you want the link to open in a new window

       • Once your links are set, you can modify the order in which they appear by dragging and dropping the places up or down. 

         • Click AZ to have them display in alphabetical order

Save All now before moving on to the next section. Scroll to the bottom of the tile and click the Save All button.

Setup: Configuring the Box Content

Image Removed

Image Added

1. Select how you would like the place tiles to display.

   • Place Image -Automatically pull in the place’s main image (avatar)

2. Custom Image -enter the URL for the custom icon’s image (see below).

   • Note: Adding a custom image will not add the custom image to that place's’ avatar and it it will not replace the current place avatar if one existed.

3. If you have selected to display an image Place image or Custom image, you can select from the following options to display the place name under Also display place name: 

   • No - will not display the place name

• Beneath box - place name will appear below the image

• On hover - place name will appear when the user hovers their mouse over the image

• Place Name - Displays the place names in the assorted grid tiles.

Adding Images

1. To add images to your tile, you will first need to upload them in the community. Simply click the gear icon in the upper right corner of the place you are working and select Static resources. (Depending on the version of Jive you have, this may say Image Files instead of Static resources)

2. In the popup, click Upload a File and select the image(s) you want to use in the slider. 

   • When using a custom icon, we suggest uploading a 40x40px icon. If your icon is a bit larger, don't worry; it will be resized.

3. Once you upload your images, copy the URL to your clipboard and paste each URL into a notepad to have handy when working in the Slider configuration panel.

Image RemovedImage Added

Configuring in another Language

• Optional: once done configuring in English (which is the default setting), click on the Select language and choose the next available language. You will then be asked if you want to Copy from the English default setup or Create from Scratch.

• The same option will be available for Filters and the Custom HTML as well.

Configure the Filters

To help users sort through all displayed places, you may pre-define several tags, grouped as Filters. When a tag is selected, the grid will animate to remove non-matching places. For each filter, you must specify

• Filter Heading: This is the categorical label for a group of tags. For example, if your tags are “red,” “blue,” and “green,” your filter heading may be “Colors.”

• Display name for tags: You can write a friendly name for each tag. For example, your tag may be “so-cal” but your displayed tag can be “Southern California.”

• Place Tags: These are the place tags associated with each display name. In the example used above, “so-cal” is the place tag. If this tag is added to the place metadata for a particular place, that place will remain in the grid when this tag is selected.

A preview is displayed at the top of the the filter configuration area. Wide view shows the appearance of filters in large columns, whereas narrow view simulates the filters as they will appear in mobile or in Jive’s skinny sidebars.

Image Removed

Image Added

Note that if you add 5 or more tags, the horizontal bar will convert to a dropdown due to space constraints. Therefore, the horizontal bar is intended for scenarios where a maximum of 4 tags need to be displayed.

If you add several filter headings, each with their own set of tags, the filters will display as several dropdown menus.

Image RemovedImage Added

Here’s how to add a new filter:

1. Select New Filter to add a new filter category

Image RemovedImage Added

2. Add details for your categories

• Add the Filter title

• Click Add Place Tags if you want to feature places based on tag and for each item add the Display name and Associated tag

• Repeat the above steps for each additional Filter 

  • NOTE: The horizontal link bar will be displayed when only one filter category is added, with less than 5 place tags. Otherwise, dropdowns will be displayed.

Image RemovedImage Added

Notes on adding Filters:

• If you add one Filter 

  • In the Wide View the links will display in a horizontal bar

Image RemovedImage Added

• In the Narrow View the links will display in a dropdown menu

Image RemovedImage Added

• If you add multiple filters

  • In the Wide View the links will display horizontally as separate dropdowns

Image RemovedImage Added

• In the Narrow View the links will display in a dropdown menu 

Image RemovedImage Added

Configuring the Theme

Filters - Select your colors for the Filters 

• This includes what color appears when the button is selected (clicked upon) and unselected

  • NOTE: You can type the basic colors into each color field. For example, red, blue, green, brown, black, white, yellow, purple, orange. For other colors, you can enter hexadecimal values. If you don’t know the hexadecimal value, convert your colors athttp://rgb.to.

Image Removed

Image Added

Place boxes - This section also includes the selecting the color of the text inside the box. 

Image Removed

Image Added

Advanced -Set the advanced configuration options including:

• Gutter  

• Max items on initial load

• Open links in a new window?

• Tile padding

Image RemovedImage Added

Configuring the Fonts

Info
How to Configure Fonts

Configure Google Analytics

Info
How to Configure Analytics

Configure the HTML Header

Info
Configuring Custom HTML

Copying your Tile Settings

Info
https://socialedgeconsulting.atlassian.net/wiki/pages/createpage.action?spaceKey=TFJ&title=Delete++-+Migrate+Configuration&linkCreation=true&fromPageId=34537547

Best Practices and Tips

Best Practice/Tip	How To…
Static Image URLs	Upload all your images and copy the Jive generated URLs for each uploaded image to a notepad before you begin configuring your slider. You will need to paste these image URLs into the image URL field.
Backup	Copy all CSS and HTML, including the code in the Migrate Configuration options to a text editor. Save this file locally or to a cloud storage system.
Rules for adding multiple tags to a Category	The admin can specify only one tag display name, but there is no restriction on entering text in the tag field (like commas). If needed, you can add logic that following AND rules for multiple tags. For example, there are two places: Place name: "Grid Space" Place tags: "products,grid" and Place name: "Blog Space" Place tags: "products,blog" Filter configured with tag value: "products" will show Grid Space and Blog Space Filter configured with tag value: "products,grid" will show only Grid Space Filter configured with tag value: "products,blog" will show Blog Space Filter configured with tag value: "products,grid,blog" nothing will show tags must be filled without quotes symbols.   Correctly filled fields: Single tag: products Multiple tags: products,grid,search,mosaic The same as above, thus the blank spaces between tags will be removed: products, grid, search, mosaic
Rules for layouts	When the Place Grid Tile is placed in the wide column, and Category Display names are being used (no drop-down),  the tile will place an "All" button filter. When the Place Grid Tile is placed in the narrow column, and Category Display names are being used, the filters will still display as a drop-down. However you will not see an All button, you will see the Category Title of the one Filter. So be sure to use an intuitive name like "All Categories" or simply "All."

Support

Need support or want to talk to us?  Please send an email to:

support@socialedgeconsulting.com