> For the complete documentation index, see [llms.txt](https://docs.littlebaytech.com/templates/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.littlebaytech.com/templates/responsive-base-template/development-guides/pages-and-reusable-elements-organized-by-folder/3.-logged-in/profile/4.-edit-profile.md).

# 4. Edit Profile

### 4. Edit Profile

#### The Edit Profile Buttons on the Profile Page

When the Current User is viewing their own profile page, the `Button Follow/Edit Profile` element will be visible if the current page width is greater than 725 pixels; the button's text will be "Edit Profile". If the page width is less than or equal to 725 pixels, the `Button Edit Profile (Mobile)` element will be visible instead.

**Editor**&#x20;

Desktop:

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbuouGg_B7L9fHg01d%2F-LXbv39Rx5I_pLjRkbNe%2FEditProfileProfilePagedesktopResponsiveBase.png?alt=media\&token=0d5a5837-c80e-423f-a0f8-d4e65b6b37fe)

Mobile:

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbuouGg_B7L9fHg01d%2F-LXbv6UjaWgfB2iL8Tmi%2FEditProfileMobileResponsiveBase.png?alt=media\&token=e7a37683-7848-4129-8d5a-a81c84a0742c)

**Preview**

Desktop

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbuouGg_B7L9fHg01d%2F-LXbvAAJrNL4wZUZ1yzr%2FEditProfileButtonPreviewModeResponsiveBase.png?alt=media\&token=b009c1cf-1320-40fb-a7eb-e45501a37e7f)

Mobile

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbuouGg_B7L9fHg01d%2F-LXbvDtlsM6MIz4l-quM%2FEditProfileResponsiveBasePreviewModeMobile.png?alt=media\&token=4ef7b87c-77dc-48a3-b2ce-118d45feab3f)

These buttons' texts are "\[pencil icon] Edit". When clicked, these buttons' workflows navigate the Current User to their account page, in order to edit their profile information.

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbwCot9JkGpDdSeTni%2F-LXbwypJovAZHbIJGcJu%2Fimage.png?alt=media\&token=9e281235-c461-4900-8874-95c78a7493f5)

Here is how everything looks when the page resizes from desktop to mobile:

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXcW9auwS4C6CAlYNb2%2F-LXcWR2Rzmz4o72FLYpK%2FResizeProfilePageWhenUsingCurrentUser.gif?alt=media\&token=3239be39-7943-443d-89d7-314d953aa485)

{% hint style="info" %}
More information on these workflows can be found in the **E. Edit Profile** workflow folder.
{% endhint %}
