logo
This section states the purpose of each page.

Introduction

In this summary, we will describe each page and its content. The Page Element is the fundamental one that contains all the other elements.
πŸ’‘
Tip: See Bubble Reference for more information about Pages element https://bubble.io/reference#Elements.Page πŸ™‚

Pages

index

This is the main page typically encountered first on the web app that usually contains links to the other pages of the site. A homepage includes a variety of menus that make it easy for users to find the information they need.
This is the main page of your app. It simply includes the signup and login forms with beautiful animations.
Image without caption
πŸ’‘
Tip: The search box and admin page redirect can be found in the Header reusable element.
πŸ’‘
Tip: Initially, the design element might be hidden.
Here is how to unhide πŸ‘€ them:
Image without caption
To check the animation workflows, locate them in the Workflow tab here:
Image without caption

admin

This page is designed to manage platform data, e.g. Users, Items, Payments… and others. Only users with admin rights are able to access this page (in read-only mode), and those users who have access rights can edit or delete anything here.
This is the πŸ” admin panel page. Users with admin rights are able to view this page and use its features at the fullest. Here, the admin user manages platform data like Users, Feeds and Comments, as well as πŸ“ˆ stats for each tab.
πŸ’‘
Tip: We are using the Bubble's native Chart Element plugin to display stats.
Users
Image without caption
Feeds
Image without caption
Comments
Image without caption
⚠️
Admin: See the instructions on how to grant Admin Rights in your template.

feed

This page is the 🏠 home page of this template. Here, the users will find a short overview of their profile on the left-hand side, showing the profile photo, number of profile views and connections.
In the middle is the live update of posts from the different accounts users are following with πŸ–ΌοΈ pictures and πŸ’¬ comments and the number of likes with it.
On top of the live posts, an update is the user's personal post section, here it is possible to compose a post and add pictures or videos, and post it live.
On the right-hand side is a list of suggested πŸ‘€ accounts for the user to follow.
Image without caption
When a user hits the "POST" button, a Feed new object is created:
Image without caption
Image without caption
Then, the Current User's userFeedlist is updated:
Image without caption

messages

This page is the πŸ’¬ chatting page. Here, Linky users are exchanging messages, being able to send πŸ–ΌοΈ image messages as well.
Image without caption
πŸ’‘
Tip: Initially, the design elements might be hidden.
Here is how to unhide πŸ‘€ them:
Image without caption

my_network

This page shows an overview of a user's 🀝 network. On your left-hand side, there is a short overview of the profile showing a profile photo, number of views and connections. In the middle, there is a list of accounts under the tab of πŸ™‹β€β™‚οΈ People a user may know. On the right-hand side is the total number of connections a user has made.
Here is how a user can send an invitation request:
Image without caption
And here is how to accept the invitation:
Image without caption
When pressing the "Connect" button, it is adding the Current User to the invitation list userWaitingForApprovalof the selected User:
Image without caption

profile

Here, users are able to modify their personal information: name, profile photo, background photo, education, experience, etc.
Image without caption
On this page, there are a couple of buttons that are hidden on preview in case the Current User is viewing his own profile:
Group "User message"
Image without caption
Group "User connect"
Image without caption
πŸ’‘
Tip: These groups are hidden to the Current User to prevent from sending an invitation request to himself.
And if user tries to Connect, the Current User's userWaitingForApproval list is updated:
Image without caption

profile_views

This page is simply displaying the list of users that have viewed the profile.
Image without caption
The RepeatingGroup element is located here:
Image without caption
The profile name is clickable. It redirects to the profile page, also sending the Creator (User) object:
Image without caption

reset_pw

This page is used for resetting the password. It simply comes with a form to set the new password and confirm it.
Image without caption
πŸ’‘
Tip: The Group "Reset Password" has a conditional to be hidden when the Current User is not logged in, so it doesn't cause any troubles when users simply preview the page, without being logged in.

404

This is a custom-designed page for 404 redirect errors, informing a user that the requested web page cannot be found, or it doesn't exist.
Image without caption
It is simply redirecting back to the index page when users click on the "Back to Home" button.

Helpful?