Version 5

    Steps to configure Grid Tile

    1. Go to the Place (Space, Group) where the Grid Tile is to be configured.

    2. Go to Activity Page > Settings > Add a Tile.

    3. Click on External Add-ons in Categories and select JEP: Grid Tile.

    4. The Grid Tile Settings screen is displayed as shown below:

     

    5. Clicking the gear icon displays the options for configuring the Grid Tile:

     

    6. Configure the General Settings as per the JEP Tiles - Visibility Rules and General Settings

     

    7. Set the Items settings as described below:

     

    Items Settings
    Create Grid items using Manage Items > Create Item.

    For each Grid Item, specify the following:

    - Item Title

    - Title Size: H1 / H2 / H3 or H4

    - brief Description

    - add a Link, with the relevant option to Open link in new window

     

    The Background type for a Grid Item can be provided as:

    - an Image Url along with the Background Position. The Background Position displays the part of the image, as specified:

    • left top/center/bottom
    • right top/center/bottom
    • center top/center/bottom

     

     

     

     

     

     

    - a Background Color. Additionally, here a suitable Icon can be selected from those available in the Icon Picker, along with an Icon Style (either Light or Dark).

    Select one of the following options to configure the Grid Item Size:

    - Square-shaped: occupying: 2 columns/2 rows or 1 column/1 row

    or

    - Rectangular: occupying: 2 columns/1 row or 1 column/2 rows

     

    Example:

     

    Choose an Item Style for displaying the Grid Item.

     

     

     

     

     

     

     

     

     

     

     

    Also, the Item details can also be displayed only on Hovering, if Show Overlay on Hover is configured.

    Specify the Background Color, Background Opacity (0.1 to 1.0) and Text Color per Grid Item.

    7. Create as many Items as required with similar configurations.

     

    8. Save Tile Settings.

     

    Grid Tile is configured successfully!

     

     

    Configuration - Example
    {"generalsettings":{"gridSpacing":"small","footer":{"actionAlign":"center","actionExternal":false,"actionUrl":"","actionLabel":""},"header":{"headlineAlign":"center","descriptionAlign":"center","headline":""},"customTitle":"What's happening on Jive - Our Collaborative Hub","columnCount":"6","body":{"backgroundPosition":"top center","textColor":"#000000"}},"gridSpacing":"small","saved":true,"options":{},"columnCount":"6","items":[{"itemStyle":"imageTextOverlay","backgroundOpacity":"0.3","description":"Connect, Collaborate, and Share - Get Started","mediaType":"imageUrl","titleSize":"h1","title":"Welcome to Your Jive Community","textColor":"#ffffff","overlayColor":"#5F9EA0","iconStyle":"light","url":"https://jep-qa.jiveon.com/places","imageUrl":"https://jep-qa.jiveon.com/resources/statics/1003/skyline%252Bbanner.jpg","showOverlayOnHover":false,"itemSize":"scuare2X2","backgroundPosition":"left_top","id":1},{"itemStyle":"imageTextOverlay","backgroundOpacity":"0.3","description":"Read the Security Blog","mediaType":"imageUrl","titleSize":"h2","title":"Security Updates","textColor":"#ffffff","overlayColor":"#5F9EA0","iconStyle":"light","url":"https://jep-qa.jiveon.com/community/information-technology-it/blog/2019/12/04/december-security-blog-industry-thoughts?sr=stream","imageUrl":"https://jep-qa.jiveon.com/resources/statics/1003/map%252Bbanner.jpg","showOverlayOnHover":false,"itemSize":"rectangle2X1","backgroundPosition":"center_center","id":2},{"itemStyle":"imageTextOverlay","backgroundOpacity":"0.3","description":"Watch Now","mediaType":"imageUrl","titleSize":"h2","title":"Latest All Hands Recording","textColor":"#ffffff","overlayColor":"#5F9EA0","iconStyle":"light","url":"https://jep-qa.jiveon.com/content","imageUrl":"https://jep-qa.jiveon.com/resources/statics/1003/people%252Bbanner%2B%25281%2529.jpg","showOverlayOnHover":false,"itemSize":"rectangle2X1","backgroundPosition":"center_center","id":3},{"itemStyle":"imageTextOverlay","backgroundOpacity":"0.4","description":"Take Tour Now","mediaType":"imageUrl","titleSize":"h2","title":"Tour The New Offices","textColor":"#ffffff","overlayColor":"#5F9EA0","iconStyle":"light","url":"https://jep-qa.jiveon.com/content","imageUrl":"https://jep-qa.jiveon.com/resources/statics/1003/office%252Bbanner%2B%25281%2529.jpg","showOverlayOnHover":false,"itemSize":"scuare1X1","backgroundPosition":"center_bottom","id":4},{"itemStyle":"imageTextOverlay","backgroundOpacity":"0.3","description":"Access the Experts here!","mediaType":"imageUrl","titleSize":"h2","title":"Travel & Expense Policy Changes","textColor":"#ffffff","overlayColor":"#5F9EA0","iconStyle":"light","url":"https://jep-qa.jiveon.com","imageUrl":"https://jep-qa.jiveon.com/resources/statics/1003/planelanding.jpg","showOverlayOnHover":false,"itemSize":"rectangle2X1","backgroundPosition":"right_bottom","id":5},{"itemStyle":"imageTextOverlay","backgroundOpacity":"0.1","description":"New Blog Available","mediaType":"imageUrl","titleSize":"h2","title":"CEO Blog","textColor":"#ffffff","overlayColor":"#5F9EA0","iconStyle":"light","url":"https://jep-qa.jiveon.com","imageUrl":"https://jep-qa.jiveon.com/resources/statics/1003/Blog-Banner-1024x469.png","showOverlayOnHover":false,"itemSize":"scuare1X1","backgroundPosition":"center_bottom","id":6}]}