Social Feed

Use this to display a stream of content, such as text, images, links, and videos

Overview

This is a visual asset for a social feed with no workflows associated. This block is ideal for social media apps to display user-generated content based on past behaviors or accounts the user follows.

Structure

This block contains three main groups

• Group Social Feed Includes a title group with filters and sorting dropdowns, and a button (hidden by default).

  • createfeed_template reusable element This reusable element includes various UIs for creating a feed post: attaching an image, inserting a YouTube video link, and a standard link. The reusable element includes four states:

    • attachment type (text): image, link, video This controls the MultilineInput message input placeholder text

    • file images (list of files) Stores the uploaded image files

    • allowed file extensions (text) Stores the list of accepted image file extensions (.jpg, .png, and etc). You can edit this list as needed. Any uploaded images that is not part of the allowed file extension will be deleted.

    • error message (text) Stores the error message text if the image the user uploaded is not part of the list of accepted image extensions

    Clicking on Multi-File Uploader attach files will open the window for users to upload multiple images. Clicking on Group Inner Attach video will allow the user to enter a YouTube video link. Clicking on Group Inner Attach link will allow the user to upload a standard link. The POST button does not include any workflows.

  • RepeatingGroup Social Feed For demo purpose, we are currently using Arbitrary text as the data source. You will need to change this later on to reference your own data type by following instructions here.

  • socialfeed_template reusable element

    The repeating group contains a reusable element called socialfeed_template and it temporarily uses a few reusable properties for demo purpose (you will need to remove these later on as you set the repeating group and the reusable element's data sources). Within the reusable element, there are various placeholder conditional statements on different elements for displaying:

    • Reposting a feed post

    • Video post

    • Image post

    • Multiple images post

    • Link post

No workflows are associated with this asset and the user will be responsible for setting the data sources and conditional statements.

How to set up

• Set the data source for RepeatingGroup Social Feed

• Go to the socialfeed_template reusable element and set the data source, update element data source references

  • Remove old references to the Current index and List count reusable properties in the conditional statements. Update conditional statements to control display settings for the different post UIs.

  • Add workflows to the icons (like, message/reply, repost, and send)

  • Remove socialfeed_template reusable properties and add new properties if needed

• In the createfeed_template reusable element, add workflows to the POST button