Freemius offers two ways for users and customers to manage their account:
1. WP Admin Product Account page
2. External Users Dashboard also known as the “Members Dashboard”.
Freemius automatically generates an external “Users Dashboard” which will be accessible for users and customers of your products and store. Customers will receive their login credentials after their first purchase, and for security reasons, will have to update their auto-generated password upon their first login.
Adding a Link to The Users Dashboard on Your Store
If you have a website, we recommend adding a direct link to the dashboard to make it easier for your customers to access their account. The URL to your dashboard is:
https://users.freemius.com/store/<storeID>
You can find your store ID under Stores settings; accessible in your Freemius dashboard by:
- Clicking Stores in the top-left panel under the Freemius logo.
- Choose your store by name.
- Scroll to the bottom of the menu on the left and select the Settings.
- In the keys section (you might need to click the dropdown arrow to expose the keys), you will find the store ID.
Embedding The User Dashboard In Your Store
Alternatively, you can embed the dashboard directly on your site. We invested a lot of resources designing the dashboard to work for that exact use-case to keep the user on your store and make the dashboard “native” on your store.
Embedding Into a WordPress Website
- Install and activate this plugin.
- Create a new page on your website. We recommend using one of the following slugs:
users
,account
,members
. - Go to the Stores settings. Scroll to the User Dashboard section.
- Paste the URL address of the page that you created in step 2 above into the User Dashboard URL setting. Make sure that the protocol (HTTP or HTTPS) is accurate, otherwise, the dashboard will not load!
- Copy and replace the
<storeID>
with your store ID,<storePublicKey>
with your store’s public key, and<headerHeight>
with your site’s header height in the following shortcode:[fs_members store_id="<storeID>" public_key="<storePublicKey>" position="fixed" left="0" right="0" top="<headerHeight>px" bottom="0"]
If your site’s header height is responsive, you can customize the dashboard’s position with media queries by styling the iframe’s
<div id=”fs_dashboard_container”>
container as follows:#fs_dashboard_container { top: {headerDesktopHeight}px; } @media screen and(max-width: 600px) { #fs_dashboard_container { top: {headerMobileHeight}px; } }
- Add the new shortcode to your newly created page.
Customizing the User Dashboard
Following the instructions above to embed the User Dashboard in your website, you can make your user experience more uniform by adding CSS styles to the User Dashboard embed to match your current website styles such as:
Here are the steps to achieve that:
- Go to the Stores settings. Scroll to the User Dashboard section.
- Paste the URL address of the custom style sheet into the User Dashboard CSS stylesheet setting. Ensure that the protocol (HTTP or HTTPS) is accurate, otherwise, the custom styles will not load!
You need to keep watching for any changes in the User Dashboard HTML changes to avoid breaking your styles.