The Settings/Member Apps/Custom Code tab lets you completely change the styling of your member portal using custom code. In this article, you can see some code snippets from different use cases.
Before we dive into details, make sure to read more about Member Portal Custom Code.
Customizing the member portal is only available with the Premium Apps Package.
Hide Check-in/out In The User Profile Menu
#checkin-toggle {display: none;}
Hide Social Links/Tags
Social Links in Member/Company Card
.MuiCard-root .rnd-social-links {
display: none;
}
Social Links in Member details dialog
#dialog-member-details .rnd-social-links {
display: none;
}
Tags in Member/Company Card
.MuiCard-root .rnd-tags {
display: none;
}
Tags in Member details dialog
#dialog-member-details .rnd-tags {
display: none;
}
Hide items from Side Navigation
Hide link to any page from Side Navigation
Every item in navigation has a unique CSS classname, prefixed with .rnd-side-nav-item- and followed by the item name. For example, if you want to select Messages tab trough CSS, you should use .rnd-side-nav-item-messages CSS selector.
#side-navigation .rnd-side-nav-item-{desired-item-name} {display: none;}
Hide link to the Membership page
#side-navigation .rnd-side-nav-item-membership {
display: none;
}
Hide Membership page content
In this case, you may want to hide the page content as well, in order to prevent displaying it by access through direct URL input. Every page in the Members Portal has a unique ID.
#page-memberships-company {
display: none;
}
Hide Credits tab and Credits page content
You can use the same approach to hide the Credits tab under the Billing section in Side Navigation.
#side-navigation .rnd-side-nav-item-credits,
#page-credits {
display: none;
}
Hide How-to Guides page
In order to hide How to Guides page, you should hide How to Guides tab in Side Navigation, page content and How to Guides button in Top Bar and Profile Menu (for small screen size devices).
#side-navigation .rnd-side-nav-item-guides,
.rnd-guides-widget,
#top-bar .rnd-button-how-to-guides,
#dropdown-profile-icon .rnd-button-how-to-guides,
#page-guides {
display: none;
}
Hide Companies page and Members/Companies Tabs
#page-companies,
#page-members .MuiTabs-root {
display: none;
}
Hide Add Members button under Teammate
#page-team-members .rnd-paper-actions .MuiButton-root {display: none;}
Hide 'Send an Email' button under Messages
#page-messages .MuiFormControlLabel-root {
display: none;
}
Hide 'Amenities' tab under Hotdesks
#page-hotdesks .MuiGrid-root.MuiGrid-item:nth-of-type(4) {
display:none;
}