Accumulus Developer Portal

Customer Portal Plug-In Example

Home User Interface Plug-Ins Customer Portal Plug-In Customer Portal Plug-In Example

The examples below show how to utilize the plug-in signup widget in a webpage. NOTE: Use “testajax.accumulus.com” and “ajax.accumulus.com” for test and production environments respectively below in the service and resource URLs.

Desktop UI

<html>
  <head>
        <title>Customer Portal Example</title>
        
	<link rel="stylesheet" href="https://ajax.accumulus.com/accumulus-widgets-2.2/dependencies/jQueryUI-1.10.4/jquery-ui.min.css" />
        <link rel="stylesheet" href="https://ajax.accumulus.com/accumulus-widgets-2.2/css/themes/default/jquery-ui-1.10.4.custom.css" />
	<link rel="stylesheet" href="https://ajax.accumulus.com/accumulus-widgets-2.2/css/accumulus.ui.css" />
 	
	<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
	<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> 
        <script type="text/javascript">
            jQuery.noConflict();
        </script>
	<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script> 
	<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/additional-methods.min.js"></script> 

	<script src="https://ajax.accumulus.com/accumulus-widgets-2.2/dependencies/jQueryFormatCurrencyPlugin/jquery.formatCurrency-1.4.0.js" ></script>
	<script src="https://ajax.accumulus.com/accumulus-widgets-2.2/dependencies/jQueryFormatCurrencyPlugin/i18n/jquery.formatCurrency.en-US.js" ></script>
 
	<script src="https://ajax.accumulus.com/accumulus-widgets-2.2/js/accumulus.core.js" ></script>
	<script src="https://ajax.accumulus.com/accumulus-widgets-2.2/js/accumulus.ui.js" ></script>

        <script>              
          var Accumulus = {
            resourcesUrl: 'https://testajax.accumulus.com/accumulus-widgets-2.2/', /*Repository of the images, forms and js/lang folders. */            
            serviceUrl: 'https://testajax.accumulus.com/webapi', /* Accumulus api web services url. */
            global: {       
              localize : false, /* Translates the components labels to the user's browser's language. A correct lang file must be at Accumulus.resourcesUrl/js/lang/ */
              currencyFormat : 'en-US',        
              defaultCountryCode : 'USA' /*The code of the country that will be selected by default in some widget country select components.*/
            }
         };
       </script>
  </head>
  <body>
    <div id="portalWidgetTest" 
         class="acc-portal"
         loginscreen="true"         
         tenantid="MyCompany"
         headertext="Customer Portal"
         showheader="true"
         statementhistory="true"
         usagebalances="true"
         usagehistory="true"
         paymentmethods="true"
         subscriptionlist="true"
         profile="true" 
         paymentMethods_showBankAccounts="true" 
         paymentMethods_showBillingAgreements="true" 
         paymentMethods_confirmUrl="https://testportal.accumulus.com/c/dansonenterprises/Portal/PayPalConfirmation"
         paymentMethods_cancelUrl="https://testportal.accumulus.com/c/dansonenterprises/Portal/PayPalCancellation"/>
   </body>
</html>

Mobile UI

<html>
  <head>
        <title>Customer Portal Example</title>
        
	<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.2/jquery.mobile.min.css" />
        <link rel="stylesheet" href="https://ajax.accumulus.com/accumulus-widgets-2.2/css/accumulus.mobile.css" />               

	<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
	<script src="//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.2/jquery.mobile.min.js" ></script>
        <script type="text/javascript">
            jQuery.noConflict();
        </script>
	<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script> 
	<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/additional-methods.min.js"></script> 

	<script src="https://ajax.accumulus.com/accumulus-widgets-2.2/dependencies/jQueryFormatCurrencyPlugin/jquery.formatCurrency-1.4.0.js" ></script>
	<script src="https://ajax.accumulus.com/accumulus-widgets-2.2/dependencies/jQueryFormatCurrencyPlugin/i18n/jquery.formatCurrency.en-US.js" ></script>
 
	<script src="https://ajax.accumulus.com/accumulus-widgets-2.2/js/accumulus.core.js" ></script>
	<script src="https://ajax.accumulus.com/accumulus-widgets-2.2/js/accumulus.mobile.js" ></script>

        <script>              
          var Accumulus = {
            resourcesUrl: 'https://ajax.accumulus.com/accumulus-widgets-2.2/', /*Repository of the images, forms and js/lang folders. */            
            serviceUrl: 'https://ajax.accumulus.com/webapi', /* Accumulus api web services url. */
            global: {       
              localize : false, /* Translates the components labels to the user's browser's language. A correct lang file must be at Accumulus.resourcesUrl/js/lang/ */
              currencyFormat : 'en-US',        
              defaultCountryCode : 'USA' /*The code of the country that will be selected by default in some widget country select components.*/
            }
         };
       </script>
  </head>
  <body>
    <div id="portalWidgetTest" 
         class="acc-portal"
         loginscreen="true"         
         tenantid="MyCompany"
         headertext="Customer Portal"
         showheader="true"
         statementhistory="true"
         usagebalances="true"
         usagehistory="true"
         paymentmethods="true"
         subscriptionlist="true"
         profile="true" 
         paymentMethods_showBankAccounts="true" 
         paymentMethods_showBillingAgreements="true" 
         paymentMethods_confirmUrl="https://testportal.accumulus.com/c/dansonenterprises/Portal/PayPalConfirmation"
         paymentMethods_cancelUrl="https://testportal.accumulus.com/c/dansonenterprises/Portal/PayPalCancellation"/>
   </body>
</html>
Menu