# Overview — Screens, Database, Layout Settings, Use Cases

With the Social Media Feed Feature Template, users can interact with other app members like they utilize their favorite social media tools. The Feature Template features an image-first social feed that can like, follow, bookmark, and comment on user posts. This template is perfect for any community app to spark engagement among your members.

## Screens Overview

📚 **Instructions Screen**

Quickly get an overview of the template with tips, a help doc, and associated templates that may interest you. *This screen may be deleted at any time.*

### User Screens

**🖼️ All Posts**

View all posts from members across the app.

**👑 Following Feed**

Quickly see the posts from the members you specifically follow.

**♥️ Likes Feed**

Review all the posts that you’ve liked within the app with this filtered feed.

**🔖 Bookmarks Feed**

See all the posts that you’ve bookmarked in one convenient location.

**🆕 New Post Modal**

Create new posts to show members.

**📝 Edit Post Modal**

Edit your own posts.

**💬 Comments Modal**

Comment on items that have been posted within any feed.

**👤 Social Profile**

Review the profiles of each user in the app.

## Database Overview

The Social Media Feed Feature Template comes with a database that contains sample data. Each Adalo database contains Collections and each collection comes with the associated Properties. Any necessary relationship between the collections is set up, as well.

{% hint style="info" %}
**Important Note About the Database:**

If you **delete** a Collection or Property from the Feature Template, this could impact the functionality of your app.

If you **add** a Collection or Property to your Feature Template, this will not impact the functionality of your app.
{% endhint %}

Below is an outline of the included Collections and their Properties. The Collection name is bolded and includes a description. The Properties include their name, property type (in brackets), and a description.

### Basic Collections & Properties

#### 👥 **Users**

The Users Collection automatically comes with every Adalo app. This collection will hold all the information related to anyone who uses the app. This information is initially collected from a user when they sign up to use your app.

* Email \[Text] — the user’s email address.
* Password \[Encrypted] — the user’s password to log into the app. This cannot be viewed by anyone, including the administrator.
* Username \[Text] — the user’s username.
* Full Name \[Text] — the user’s first and last name.
* Profile Photo \[Image] — the user’s profile picture.
* Posts Published \[One-to-Many Relationship] — this relational field shows that each users can have many posts, and each post can only be published by one user.
* Posts Liked \[Many-to-Many Relationship] — this relational field shows that each user can like several posts, while each post can be liked by several users.
* Posts Bookmarked \[Many-to-Many Relationship] — this relational field shows that each user can bookmark several posts, and each post can be bookmarked by several users.
* Is Following \[Many-to-Many Relationship] — this relational field shows that each user can follow many other users.
* Is Followed By \[Many-to-Many Relationship] — this relational field shows that each user can be followed by many other users.
* Post Comments \[One-to-Many Relationship] — this relational field shows that each user can write several post comments, and each post comment can only belong to one user.

#### 💬 Post Comments

The Post Comments Collection holds all the information about comments that have been made on posts in the app.

* Text \[Text] — the text of the comment.
* User \[Many-to-One Relationship] — this relational field shows that each post comment belongs to one user but each user can have several post comments.
* Post \[Many-to-One Relationship] — this relational field shows that each post can have many comments, but each comment belongs to one post.

#### **🖼️ Posts**

The Posts Collection contains information about each post in the app.

* Text \[Text] — a description of the post.
* Image \[Image] — the post image.
* Post Owner \[Many-to-One Relationship] — this relational field shows that each post has one owner, and each user can have several posts.
* Liked Users \[Many-to-Many Relationship] — this relational field shows that each post can be liked by multiple users, and each user can like multiple posts.
* Bookmarked Users \[Many-to-Many Relationship] — this relational field shows that each post can be bookmarked by multiple users, and each user can bookmark multiple posts.
* Post Comments \[One-to-Many Relationship] — this relational field shows that each post can have multiple comments and each comment belongs to one post.

## Layout Settings

Each screen in the Social Media Feed Feature Template is created using responsive design. The screens will look good on any device or tablet.

Most screens have been designed with Custom Layouts. If you add a new component to a screen, you might notice that the other screen sizes are impacted.

### Layout Overview

To view or edit the layout for different screen sizes — click the Screen title to reveal the dropdown.

<figure><img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2FbdO2NVcXyySDeIEe1TNs%2FLayoutOverview1.png?alt=media&#x26;token=5c6db222-f5a8-4fbd-9d7c-96fbc1f42565" alt="" width="311"><figcaption></figcaption></figure>

The default view for this template is Desktop. When you change the screen size for one screen in the Builder, it does not change the screen size of the rest of the screens on the canvas.

#### Hidden Components

<figure><img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2FsZPGIifOjK6V2qPtOSxn%2FLayoutoverview2.png?alt=media&#x26;token=af9db800-ba1f-4a9c-b762-8e9476aa92a8" alt="" width="476"><figcaption></figcaption></figure>

In each view, there may be components that do not appear on Desktop, but are visible on Mobile. These are grayed out in the lefthand panel & denoted with an icon.

Another way to view which device components are visible on is the Layout Tab here:

<figure><img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2Fgn0kTJXeZt5ppKMCWScl%2FLayoutoverview3.png?alt=media&#x26;token=c59c76a3-c344-48b9-9944-82a971bf6b1f" alt="" width="540"><figcaption></figcaption></figure>

#### Custom Layout

<figure><img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2FwNjIBwKVRMtLt845AY3R%2FLayoutoverview4.png?alt=media&#x26;token=97a9ec99-c0ef-4561-8dae-28b2705d8c14" alt="" width="347"><figcaption></figcaption></figure>

Some components come with custom layouts based on screen size. To view those settings, check the Layout Tab & scroll to the Custom Layout Settings.

## Example Use Cases

* A social feed for your fitness club
* A social feed for your niche community, like a knitting group, moms group, and more
