Skip to main content
Start selling

Embed the Freemius Customer Portal into your website

You can provide your customers with easy access to their accounts by either adding a direct link to the Customer Portal on your website or embedding it directly into your site.

If you have a website, we recommend adding a direct link to the portal to make it easier for your customers to access their account. The Customer Portal URL takes the structure below:

https://customers.freemius.com/store/<storeID>

Where <storeID> is your unique store identifier. Here are the steps to find your Store ID in the Store's settings.

Embedding the Customer Portal in Your Store​

Alternatively, you can embed the portal directly on your site. The customer portal has been designed to work for this exact use case, keeping users on your store and making the portal feel native to your site.

Find Store ID & Public Key​

You will need your store ID and public key to embed the portal.

  1. Log into your Freemius Developer dashboard.
  2. Navigate to your store by clicking Stores in the top-left panel under the Freemius logo.
  3. Select your store by name.
  4. Scroll down the menu and select the Settings page.
  5. Under the API & Keys sub-page, you will find your store ID and public key.

Set the Customer Portal URL​

  1. Create a new page on your website. We recommend using one of the following slugs: users, account, members. Save the page's link to be used in step 4.
  2. In your Freemius Developer account, navigate to your store by clicking Stores in the top-left panel under the Freemius logo.
  3. Select your store by name.
  4. Scroll down the menu and select the Settings page.
  5. Under the Customer Portal sub-page, scroll to the Embed on your Website section.
  6. In the Customer Portal URL setting field, paste the URL address of the page created (in step 1 above). Make sure the protocol (HTTP or HTTPS) is accurate, otherwise, the portal will not load.

Embedding with WordPress Block Editor​

If you are using the WordPress Block Editor, you can embed the customer portal using the Freemius for WordPress plugin customer portal block.

Here is how:

  1. Install the Freemius for WordPress plugin
  2. Add the Freemius Customer Portal block.
  3. Enter your Store ID and Public Key from the store settings.
  4. Optionally, set Preview height under Portal Settings. This controls the editor preview only; on the live site the portal resizes to fit its content.

Embedding with Classic Editor or Shortcode (block)​

If you are using the WordPress Classic Editor or another page builder, you can embed the portal using a shortcode. Follow these steps:

  1. Install and activate Freemius Customer Portal WordPress Plugin.

  2. Add this shortcode to the page you created:

    [fs_members store_id="<storeID>" public_key="<storePublicKey>" position="fixed" left="0" right="0" top="<headerHeight>px" bottom="0"]

  3. Replace the following placeholders in the shortcode with your information that we obtained in the previous steps:

    • <storeID> - with your store ID.
    • <storePublicKey> - with your store's public key.
    • <headerHeight> - with your site's header height.
    Responsive Header Height

    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;
      }
    }

Disabling Redirect to WordPress Login Page​

Users might be redirected to the default WordPress login page when they log out of the embedded Customer Portal. To disable this behavior, add the following code snippet to the bottom of your active theme's functions.php file:

function my_fs_members_dashboard_config( $config ) {
    $config = str_replace( 'window.location.href', '// window.location.href', $config );
    return $config;
}

add_filter( 'fs_members_dashboard', 'my_fs_members_dashboard_config' );

Support For Multiple Domains​

For security purposes, the portal will not load unless it is embedded on the domain specified in the Freemius Developer Dashboard.

However, there are cases where you may want to allow the portal to be embedded on multiple domains, for example, if you have a staging environment or a local development environment.

To set up, follow these steps:

  1. Log into your Freemius Developer dashboard.
  2. Navigate to your store by clicking Stores in the top-left panel under the Freemius logo.
  3. Select your store by name.
  4. Scroll down the menu and select the Settings page.
  5. Under the Customer Portal sub-page, scroll to the Embed on your Website section.
  6. Add your additional domains in the Additional Whitelisted Domains configuration.
  7. Click the Add button to save the additional domain.

Embedding on Non-WordPress Sites​

If you'd like to embed the Customer Portal on a non-WordPress site, please get in touch with our support team and we will provide you with a custom code snippet. Alternatively, you can also use the direct link to the portal on your site, as described in the Adding a Link on Your Store section above.

Customizing the Customer Portal Appearance​

For the Customer Portal to match your website and brand look, find up-to-date instructions on customizing the Customer Portal appearance with CSS.

On this page: