Sign Up linked to Profile

Hello,

New to Bubble, so this question may be basic!

Once the user has Signed Up I would like their username to be linked onto their Profile page, how exactly do i get it so when they have inputted a Username it can go straight on their Profile without them having to type it in again?

I would like this to be the same with the First, Last name and Profile picture.

Many thanks,
Brianna

Hey @briannar :slight_smile: Welcome to Bubble! You can begin to set this up by adding a few fields under the User data type in the App Data tab:

Username (type: text, list: no)
First Name (type: text, list: no)
Last Name (type: text, list: no)
Profile Picture (type: image, list: no)

After the fields are good to go, you would create a page called “profile” (or anything you prefer for this). Double-click on that page, and the property editor will open. For “type of content”, select User.

Then draw text elements which will display the User’s information dynamically. For example, if you wanted to display the User’s first name and last name next to each other - in one text element you would use the dynamic statements “Current Page User’s First Name Current Page User’s Last Name”.

For a profile picture, you would have an image element with the following dynamic data:

If you wanted to take a User to this page after they logged in - on the login button - you could navigate them to the profile page. Since you have defined a type of content for the profile page (User), Bubble will require you to send a User’s data to the page. In this case, we want to display the Current User’s information - so you would select “Current User” for data to send.

In preview mode, after the User logs in, they will be taken to that page. In the URL you’ll see a really long number at the end of the URL. This is the User’s unique ID (this is how Bubble knows which User’s information to display). If this is empty (when no data is sent, even though the page has a type of content defined) it will probably display Lorem Ipsum text in place of an actual User’s data.

If you have any questions, or need any assistance setting this up in your app, feel free to let me know. :slight_smile:

2 Likes

Thank you @fayewatson for getting back so quickly! Very grateful for how detailed it is, thank you very much!

1 Like

No problem at all Brianna! :smiley:

Still learning how to use bubble and unsure where I can find how to change the ‘destination’ and the ‘data to send’?

Many thanks for all the help!
Brianna

The Destination is a drop down list of all of your pages. Only if there is another page setup, you are then able to navigate to that page. I hope this helps.

2 Likes

@lawrencemurry is correct. :slight_smile: That screenshot is the window which appears for the “Go to Page” action. To add this, in the “When Sign Up Button is clicked” workflow, the action you would add is “Navigation --> Go to Page”. Then that window will appear allowing you to select “Profile” (as long as that page exists in your app) as the Destination. Make sure the Profile page’s Type of Content is “User”; then in the Data to Send input, you would select Current User.

1 Like

@fayewatson @lawrencemurry many thanks to both of you for the help! Much appreciated!

This topic was automatically closed after 70 days. New replies are no longer allowed.