Understand the custom domain in the customer portal
The domain is the string that is entered into the address bar and helps identify a source on the internet. An example of a domain name is https://www.google.com. By default, the customer portal is hosted on the My gadget Repairs domain. However, the customer can also host the customer portal on their own domain. This will enable the customer portal to be accessible from the organization’s own website instead of My Gadget Repairs.
Let’s assume an organization called PhoneLab uses MGR’s customer portal. PhoneLab has a domain, www.phonelab.com, and wants the customer portal to be available on its own domain instead of the MGR’s default domain. PhoneLab can achieve this by using the custom domain feature.
Within MGR you can set a custom domain URL for your customer portal. To set your custom domain, click on Shop Settings > Customers Tab. Add the custom URL in the “Customer Portal Custom URL“.
Once added system will use this URL in the customer portal registration email and other communication emails with your customers. Please note that this functionality is designed solely to mask URLs in the emails we send, ensuring that customers see your URL. It will not alter every URL on the loaded page.
You will need to use frames as we don’t give you a subdomain URL.
A basic page under your own URL will contain an iframe with the source set to https://www.mygadgetrepairs.com/customer/
Your page on this URL “https://yourdomain.com/customer-portal.html” will look like this.
<body style="margin:0px;padding:0px;overflow:hidden"><iframe src="https://www.mygadgetrepairs.com/customer/" frameborder="0" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:100%;width:100%;position:absolute;top:0px;left:0px;right:0px;bottom:0px" sandbox="allow-scripts allow-forms allow-same-origin allow-top-navigation-by-user-activation allow-popups allow-modals" height="100%" width="100%"></iframe></body>
The MGR Customer Portal is fully capable of accepting parameters from your custom domain URL but only in a recognised pattern. The usability of this feature is to offer your customers to go through your own custom link that will be forwarded exactly to the MGR customer portal running in an iframe under your custom URL. This feature is mostly used in email communications between your customer and your shop, such as customer portal registration email, reset password email, or simply a ticket detail page.
To use this feature, your page should accept a single URL parameter named “path” with an encoded string as its value. You simply need to decode that string and append it to the MGR domain in your frame’s “src” attribute.
Suppose you have set your custom domain URL as https://yourdomain.com/customer-portal.php
MGR will use this URL and send a query string like this ?path=anything-encoded
Your page “customer-portal.php” must decode the URL param “path” and append it to MGR URL like in the example below
<body style="margin:0px;padding:0px;overflow:hidden"><iframe src="https://www.mygadgetrepairs.com/<?php echo urldecode($_GET['path']) ?>" frameborder="0" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:100%;width:100%;position:absolute;top:0px;left:0px;right:0px;bottom:0px" sandbox="allow-scripts allow-forms allow-same-origin allow-top-navigation-by-user-activation allow-popups allow-modals" height="100%" width="100%"></iframe></body>
Language Switch on Customer Portal
If the custom domain URL is not set, the language switch on the customer portal will offer to switch between all the languages supported by MGR. However, if the custom URL is set and the shop has also chosen preferred languages, then all the customer links served through email communications will only offer those preferred languages in the language switch.
Though the MGR customer portal works independently at https://www.mygadgetrepairs.com/customer/ any link which doesn’t come through email will offer all the languages. To limit the language switch with your shop’s preferred languages, you’ll need to send a URL param “portal” set to a portal identifier as shown in your shop settings, right with the “Customer Portal Custom URL” field as in the example below.
<body style="margin:0px;padding:0px;overflow:hidden"><iframe src="https://www.mygadgetrepairs.com/customer/?portal={portal identifier}" frameborder="0" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:100%;width:100%;position:absolute;top:0px;left:0px;right:0px;bottom:0px" sandbox="allow-scripts allow-forms allow-same-origin allow-top-navigation-by-user-activation allow-popups allow-modals" height="100%" width="100%"></iframe></body>
WordPress Plugin – Install Manually
Plugins are utilities that provide additional functionality to your application. To install a plugin you just need to put the plugin files into the wp-content/plugins directory. Once a plugin is installed, you may activate it or deactivate it from the Plugins menu in your WP administration.
- Download your WordPress plugin to your desktop.
- Extract the plugin folder to your desktop. This is very important as files must be extracted in order to be uploaded properly to the wp-content/plugins folder.
- With your FTP program, upload the plugin folder “mgr_customer_portal” to the wp-content/plugins folder in your WordPress directory.
- Go to Plugins and find the newly uploaded Plugin “MGR CUSTOMER PORTAL” in the list.
- Click Activate Plugin to activate it.
- Add the following shortcode to your desired page, don’t forget to replace “{portal identifier}” with the actual value provided in shop settings.
[mgr_customer_portal identifier="{portal_identifier}" /]So if your portal identifier was 123abcdefg then your embed code should look like the following[mgr_customer_portal identifier="123abcdefg" /]
You can add following attributes to the [mgr_customer_portal] plugin to adjust width, height and/or border according to your webpage’s layout.
[mgr_customer_portal identifier="{portal_identifier}" width="100%" height="800px" border="1" /]
Default values for the width, height, border are as follows.
- width=100%
- height=1000px
- border=0
