Using the Builder for Common Customizations | MuleSoft Documentation
# Using the Builder for Common Customizations
From the Builder, use the following portal customizations to match your company’s brand.
Access the Builder from the **Manage your API portal** page by clicking **Preview and publish your portal**.
## Add and Remove Portal Components
From the Builder, add or remove API Experience Hub components from your portal.
  1. Navigate to the Builder.
  2. Click the **Component** icon.
  3. Scroll to **Custom Components**.
  4. Click a component, for example, API Console and drag it into the portal.
  5. To remove a component, click the trash can icon and click **Delete**.


### Customize Colors for Each API Type
To customize the color for each API type that displays in the **Home** page:
  1. Navigate to the Builder.
  2. Click the **Builder** icon.
  3. Click the **Settings** icon.
  4. Click **Advanced**.
  5. Click **Edit Head Markup**.
The following shows the asset type color variables:
```
--asset-type-c-rest-api-color: 0, 0, 0;
--asset-type-c-http-api-color: 0, 0, 0;
--asset-type-c-soap-api-color: 0, 0, 0;
--asset-type-c-evented-api-color: 0, 0, 0;
```

  6. Change the color variable number for the asset type and click **Save**.


## Change the Background Color of the Login Page
To change the background color of your portal’s login page:
  1. Navigate to the Builder.
  2. Click the **Page Properties** icon and click **Login**.
Your current login page displays in the Builder.
  3. Click the **Theme** paintbrush icon.
  4. From **Theme** , click **Colors**.
  5. From the **Login Pages** section, select a color from the **Background Color** color picker.
The background color of your Login page changes to the select color.


## Change the Card Background Color of the Login Page
To change the card background color of your login page card:
  1. Navigate to the Builder.
  2. Click the **Page Properties** icon and click **Login**.
Your current login page displays in the Builder.
  3. Click the **Theme** paintbrush icon.
  4. From **Theme** , click **Colors**.
  5. From the **Login Pages** section, select a color from the **Card Background Color** color picker.
The card background color of your Login page changes to the selected color.


## Change the Email Template for Portal Registration
To edit the email information that is sent to users who register for your site:
  1. Navigate to the Builder.
  2. Click the **Builder** icon.
  3. From **My Workspaces** , click **Administration**.
  4. Click **Emails**
  5. Make your changes and click **Save**.


## Change the Logo Image for Self-Registration and Login Pages
By default, the logo image used for the login pages is the image added during the guided styling setup. To change the image for the login pages:
  1. Navigate to the Builder.
  2. Click the **Builder** icon.
  3. From **My Workspaces** , click **Administration**.
  4. Select **Login & Registration**.
  5. From the **Branding Options** section, click the **Choose File** button from **Logo File**.
The maximum height of the logo is 125 px and the maximum width is 250 px.


## Customize the Portal Domain
By default, Experience Cloud generates the URL for your portal domain. You can customize the domain for your organization. For example, you can change the URL to <yourcompany>.com. Currently, you cannot change the portal’s subpath of `aeh` in the URL.
  1. Navigate to the Builder.
  2. Click the **Builder** icon.
  3. Click **Salesforce Setup**.
  4. In the **Quick find** box, enter **Domains**.
  5. Click your domain name in the **Domains** list.
  6. Click **Edit** in the **My Domains Details** section.
  7. Enter a domain name in the **My Domain Name** field.
  8. Click the **Check Availability** button to ensure the domain name does not exist already.
  9. Enter a domain suffix in the **Domain Suffix** field, for example, *.<my.salesforce.com>.
The new domain URL displays in the **Your chosen new My Domain URl** field.
  10. Click **Save**.


## Configure Feed Component
The Feed component displays a feed of all record or group interactions, including posts, questions, system updates, and attachments.
Specify values for the following properties:
Property  
---  
Feed Type | 
  * **Group or Record** shows everything that is posted to a selected group or record, for example, an account or opportunity.
  * **Discussion** feed shows everything that is posted to **Navigational Topics**.
  * **My Feed** shows feed items that are tagged with a topic, or a person or record that you follow along with your personal site activity. You see all shared feed items unless another person shared the item with a group that you aren’t a member of. With public groups, you see the feed item that you shared even if you’re not a member.
  * **Topic** feed shows everything that is posted to a selected topic.
  * **User Profile** feed shows posts that the member creates or interacts with for example, comments or answers that is posted for user profile feeds.
  * **Bookmarks** feed shows only bookmarked posts, pool, or questions that is posted for a selected bookmark.

  
Record ID | Leave this field blank if you pick the **Discussion** or **My Feed options** in **Feed Type**. Typically, this field populates the feed item ID automatically when the page loads.  
Default Filter | Select the default filter for feed entries that you want your site members to see.  
Post Style | Choose to expand or collapse post comments by default.  
Let members search feeds | Choose to let site members search an individual feed.  
Let members sort feeds | Choose to let site members sort a feed. When sorting is enabled, members can sort a feed by the latest posts or most recent activity.  
## Configure Feed Publisher Component
To enable portal members to create posts on groups or records and upload attachments, configure the Chatter Feed Publisher component.
Specify values for the following properties:
Property  
---  
Select the type of feed publisher to add to your page. To use global publisher actions defined in your Salesforce organization, choose **Global**. To use an object-specific publisher layout, choose **Record**.  
Record ID | Leave this field blank if you pick the **Global feed** publisher type. Typically, this field automatically populates with the record ID when the page loads.  
Publisher Layout Design | Select to see the wide or narrow feed publisher layout design.  
## See Also
  * Customizing Your Portal Using the Experience Builder
  * Advanced Styling with CSS