How To Install Setup The Consumer Portal
The Consumer Portal is web-based interface that allows Debtors (Consumers) access to their account.
The configuration is divided into Client-Side Configuration, which which controls some UI elements,
and Server-Side Configuration, which controls some functionality within the application.
This module is dependent on the Collect! REST API, which must be installed first.
Please refer to the Help topics How to Install the REST API and How to Install and Setup Apache.
Apache Configuration
Apache is used to proxy the domain requests. This allows you to communicate on HTTPS for all
requests, without having to open extra ports to the internet.
Please refer to the Help document How to Install and Setup Apache linked above for the instructions to
install Apache. This section will go over the vhost configuration for the Consumer Portal.
C:\wamp64\bin\Apache\Apache2.4.#\conf\httpd.conf
Add defines for the domains.
Define DOMAIN_NAME_CONSUMER consumer.yourdomain.com
C:\wamp64\bin\Apache\Apache2.4.#\conf\extras\httpd-vhosts.conf
Copy and paste the below into the bottom of the file.
<VirtualHost *:80>
ServerName ${DOMAIN_NAME_CONSUMER}
ServerAlias ${DOMAIN_NAME_CONSUMER}
DocumentRoot "${INSTALL_DIR}/www"
<Directory "${INSTALL_DIR}/www/">
Options +Indexes +Includes +FollowSymLinks +MultiViews
AllowOverride All
Require local
</Directory>
<Directory "${INSTALL_DIR}/www/.well-known/">
Require all granted
</Directory>
RewriteEngine on
RewriteCond %{REQUEST_URI} '!/.well-known/acme-challenge/'
RewriteCond %{HTTP:Upgrade} !=websocket [NC]
RewriteRule ^ https://%{SERVER_NAME}%{REQUEST_URI} [END,NE,R=301]
</VirtualHost>
C:\wamp64\bin\Apache\Apache2.4.#\conf\extras\httpd-ssl.conf
Copy and paste the below into the bottom of the file.
<VirtualHost _default_:443>
# General setup for the virtual host
DocumentRoot "${INSTALL_DIR}/www"
ServerName ${DOMAIN_NAME_CONSUMER}:443
ServerAdmin ${ADMIN_EMAIL}
ErrorLog "${SRVROOT}/logs/error.log"
TransferLog "${SRVROOT}/logs/access.log"
Header set X-Frame-Options sameorigin
Header set X-Content-Type-Options "nosniff"
Header set X-Permitted-Cross-Domain-Policies "none"
Header set Referrer-Policy "no-referrer"
Header set Cross-Origin-Resource-Policy "same-origin"
Header always set Strict-Transport-Security "max-age=63072000; includeSubDomains; preload"
# SSL Engine Switch:
# Enable/Disable SSL for this virtual host.
SSLEngine on
# Server Certificate:
SSLCertificateFile "${SSL_FILE_PATH}/${DOMAIN_NAME_CONSUMER}-crt.pem"
# Server Private Key:
SSLCertificateKeyFile "${SSL_FILE_PATH}/${DOMAIN_NAME_CONSUMER}-key.pem"
# Server Certificate Chain:
SSLCertificateChainFile "${SSL_FILE_PATH}/${DOMAIN_NAME_CONSUMER}-chain.pem"
<FilesMatch "\.(cgi|shtml|phtml|php)$">
SSLOptions +StdEnvVars
</FilesMatch>
<Directory "${SRVROOT}/cgi-bin">
SSLOptions +StdEnvVars
</Directory>
# SSL Protocol Adjustments:
BrowserMatch "MSIE [2-5]" \
nokeepalive ssl-unclean-shutdown \
downgrade-1.0 force-response-1.0
# Per-Server Logging:
CustomLog "${SRVROOT}/logs/ssl_request.log" \
"%t %h %{SSL_PROTOCOL}x %{SSL_CIPHER}x \"%r\" %b"
ProxyPreserveHost On
ProxyPass / http://localhost:3005/
ProxyPassReverse / http://localhost:3005/
</VirtualHost>
Final Steps
- If Apache is already configured and running, then you need to comment out
"Include conf/extra/httpd-ssl.conf" line in the httpd.conf file.
- Restart the Apache service.
- Setup SSL Certificates.
- Uncomment "Include conf/extra/httpd-ssl.conf" in the httpd.conf file.
- Restart Apache.
Client-Side Configuration
The Client-Side elements affect the User Interface. You will need to contact us to obtain the latest
installation package.
- Unpack the installation package into the {Collect}\bin\companion\ folder. This should result
in {Collect}\bin\companion\consumer-portal.
- Navigate to the Consumer Portal folder in Powershell Admin mode.
cd {Collect}\bin\companion\consumer-portal
- Run the Setup Script.
./setup.ps1
- Navigate to the CLI folder in Powershell Admin mode.
cd {Collect}\bin\companion\cli
- Update and Seed the database.
node .\main.js database migrate:latest
node .\main.js database seed
- Key in Y to the warning and push Enter.
- Scroll up or down with the arrow keys on the keyboard until you find 07_default_consumer_settings.
- Use the spacebar to select the 07_default_consumer_settings option.
WARNING: Make sure that no other option is selected. Selecting the wrong option can cause damage.
- Push Enter on the keyboard.
- Open the {Collect}\bin\companion\consumer-portal\runtime-config.js file with a text editor.
- Update the applicable values. See table below for more information.
Runtime Configuration File
This file is in JSON. If you are not familiar with JSON, stop and contact us for changes.
This is the hierarchy of the file:
- base_url
- company
- screens
- core
- login
- register
- forgot_password
- payment
- terms_and_conditions
- authorization_form
- theme
| Key |
Description |
| base_url |
This value must be updated to point at the URL for the Collect! API Server.
Example: https://api.yourdomain.com |
| company -> name |
Enter your Company's Name. |
company -> images -> favicon -> base64
company -> images -> logo -> base64 |
Both favicon and logo are optional. If nothing is supplied, the default Collect! images are
used. To generate base64 strings for these images:
- Optimize the image using a service or application. Example:
https://imageoptim.com/online
- Convert the optimized image to Base64. Example:
https://www.base64-image.de/
- Replace "undefined" with the applicable value for the favicon and/or logo.
|
company -> support -> email
company -> support -> phone |
Both email and phone are optional, but may be provided for display in the Collect! Consumer Portal. |
screens -> core -> menu -> logo
screens -> login -> logo
screens -> register -> logo |
These options may not be visible. If that is the case, it will use the default height sizing.
If you need to adjust the height, you can create the applicable JSON code and add a tag for
width or height. JSON is comma separated. The below assumes that you add the code as the first
parameters for the Screens section.
core: {
menu: {
logo: {
width: '100px',
},
},
},
login: {
logo: {
height: '60px',
},
},
register: {
logo: {
height: '60px',
},
},
|
screens -> register -> labels -> ssn
screens -> register -> labels -> license
screens -> register -> labels -> zip
screens -> register -> labels -> dob
screens -> register -> labels -> file
|
These values are used to override the default placeholder labels of the 5 corresponding
registration fields. |
| screens -> login -> title |
Update this value to set the title on the login page shown above the file/password form.
By default the title on the login page reads "Consumer Portal Login." |
| screens -> login -> disclaimer |
Update this value to display a disclaimer below the login form on the login page.
This value supports HTML code. |
| screens -> login -> labels -> file |
Update this value to change the placeholder text of the file# field on the login page. |
screens -> forgot_password -> labels -> description
screens -> forgot_password -> labels -> file
|
These values are used to override the file# field placeholder text and the form description
on the forgotten password page. |
| screens -> payment -> urls |
Enter the URL for your payment page. Two formats are supported iFrame and Buttons. If your
payment processor supports iFrames, and you only have 1 payment page, then update the URL.
If you have multiple payment pages, or your payment provider doesn't support iFrames, then
you need to use the Button method.
iFrame:
payment: {
urls: [
{
url:
'https://paymentprovider.com/form/abc123?fn=${de_number}&am=${de_owing}',
},
],
},
Single Button:
payment: {
urls: [
{
label: 'Pay Now',
url:
'https://paymentprovider.com/form/abc123?fn=${de_number}&am=${de_owing}',
},
],
},
Multiple Buttons:
payment: {
urls: [
{
label: 'Pay Now',
url:
'https://paymentprovider.com/form/abc123?fn=${de_number}&am=${de_owing}',
},
{
label: 'Pay Now',
url:
'https://paymentprovider.com/form/def456?fn=${de_number}&am=${de_owing}',
},
],
},
|
| screens -> payment -> check_require_bank |
This value determines if the bank name field is included in the check payment form (Only
applies if check payments are enabled in server-side settings). |
| screens -> payment -> check_default_country |
This option is used to set the default value of the Bank Country dropdown field on the check
payment form. The Bank Country field is used to determine which bank code field is displayed
within the check payment form (ex. US - Routing Number, AU - Bank State Branch Number).
Currently supported values are US, CA, and AU. The default value if left unspecified
is US. |
| screens -> payment -> check_hide_country |
This value determines if the Bank Country dropdown is hidden on the check payment form.
If set to true, the default country value will be used to determine the bank code field
used on the form. |
| screens -> payment -> check_tab_label |
This value can be used to change the label text of the check payments tab from the default
text of "Check Payment". |
| screens -> payment -> alert_text |
Here you may optionally define HTML code that will replace the content of the "Please Note"
alert box on the payment page. |
| screens -> terms_and_conditions |
Terms and Conditions are optional. If provided, the consumer must accept the Terms and
Conditions before using the Collect! Consumer Portal. Note: This value is a string of HTML
which will be displayed in the browser. Make sure to escape any quotation marks for proper
display. To leave off, you can leave the code out of the file or set the text to undefined.
Example:
terms_and_conditions: {
text: '<h1>Licensing & Software Terms of Use Agreement</h1>
<p>These terms of use of this site:</p>
<ul>
<li>Term 1</li>
<li>Term 2</li>
<li>Term 3</li>
</ul>',
},
|
| screens -> authorization_form |
Here you may optionally define a form that will be displayed to users on their first login.
The result of the completed form will be saved as an Attachment on the Debtor's record in
Collect! The form can be defined using an array of form input JSON objects with the following
parameters:
- label: Label for the field.
- fieldType: Data type for the field. Values are: TEXT, CHECKBOX, SELECT, DATE
- field: Field name from the Attachment table in the database. Non-Attachment field
are considered form-specific and will not be stored in the database.
- confirmWithField: If you require a user to validate data entry, such as Email, use
a non-Attachment field name for the Field parameter, then put the Attachment field
name here. See Email Address example below.
- required: Is the data entry required. Values are: true, false
- prefill: Prefill the field will data.
- options: For the SELECT field type, enter an array of options.
Example:
authorization_form: [
{
label: 'Full Name',
fieldType: 'TEXT',
field: 'at_detail_2',
required: false,
},
{
label: 'Address',
fieldType: 'TEXT',
field: 'at_detail_3',
required: false,
},
{
label: 'State',
fieldType: 'SELECT',
field: 'at_detail_4',
required: false,
options: ['CA', 'OR', 'WA']
},
{
label: 'Email Address',
fieldType: 'TEXT',
field: 'at_detail_5',
required: false,
},
{
label: 'Confirm Email Address',
fieldType: 'TEXT',
field: 'confirm_email',
confirmWithField: 'at_detail_5',
required: false,
},
{
label: 'I consent to ABC Collections contacting me via email
using this email address.',
fieldType: 'CHECKBOX',
field: 'email_check',
required: true,
},
{
label: 'Cell Phone Number',
fieldType: 'TEXT',
field: 'at_detail_6',
required: false,
},
{
label: 'I consent to ABC Collections contacting me via text
messaging using this cell phone number.',
fieldType: 'CHECKBOX',
field: 'phone_check',
require: true,
},
{
label: 'Home Phone Number',
fieldType: 'TEXT',
field: 'at_detail_7',
required: false,
},
],
|
| theme |
The Collect! Consumer Portal allows you to configure 5 colors. Update the primary color to
match the theme of your website. The others can be left as default unless you want to change them.
Example:
theme: {
primaryColor: '#2BA3BB',
errorColor: '#D93232',
warningColor: '#f89939',
successColor: '#A1BF2F',
infoColor: '#3DD4F2',
},
|
Server-Side Configuration
Some features of the Consumer Portal are implemented server-side and their configuration options are
stored in the Collect! database. These options can be modified on the administration page of the
consumer portal which can be reached via the path: /auth/admin-login
- Open https://api.yourdomain.com/configuration-portal in a web browser.
- Sign in with an Operator with a User Level that has been designated as Manager.
- Select Consumer Portal from the menu.
- Update the values in the applicable fields.
- Click Save Changes.
| Key |
Description |
| Account Statement Report |
This option allows you to specify a Collect! report that provides a statement of the
debtor's account. |
| Group Statement Report |
This option allows you to specify a Collect! report that provides a summary of a debtor
group. This is only available to grouped debtor accounts. |
| Transaction Receipt Report |
This option allows you to specify a Collect! report to run as a receipt for each payment
in the payment history transactions table. |
| Payment History Replacement |
This option allows you to specify a Collect! report that will replace the payment history
transactions table. |
| Hide Transaction Table |
This option allows you to hide the payment history transactions table from the Debtor's
account breakdown screen:
- 0 - Visible (Default)
- 1 - Hidden
|
| Phone Opt in/out |
This option specifies the level of control a user has over the Allow Calls switch which
specifies if the user consents to being contacted via that phone number. There are 3 values
you may choose from:
- 0 - User's cannot toggle the Allow Calls switches (Default)
- 1 - User's can toggle the Allow Calls switches, but must have at least 1 active
phone number
- 2 - User's have full control of the Allow Calls switches
|
| Email Opt in/out |
This option specifies the level of control a user has over the Allow Emails switch which
specifies if the user consents to being contacted via that email address. There are 3 values
you may choose from:
- 0 - User's cannot toggle the Allow Emails switches (Default)
- 1 - User's can toggle the Allow Emails switches, but must have at least 1 active
email address
- 2 - User's have full control of the Allow Emails switches
|
| Request Call Feature Enabled |
This option allows you to disable the "Request a call" feature in the consumer portal:
- 0 - Visible (Default)
- 1 - Hidden
|
| Request Call Hours |
This option allows you to specify which hours of the day the user may select for their
request call. 9AM - 4PM by default. |
| Request Call Days |
This option allows you to specify which days of the week the user may select for their
requested call. All 7 days a week by default. |
| Request Call Weeks in Advance |
This option allows you to specify how many weeks in advance users may select a date for
their requested call. 1 week by default. |
| Request Call Timezone |
This option allows you to notify users the timezone that they are requesting a call for.
By default, no timezone is displayed. |
| Assign Phone Contacts To |
This option specifies which operator phone contacts are assigned to.
Phone contacts are created via the Request a Call feature.
If blank, review contacts are assigned to the debtor's collector. |
| Assign Review Contacts To |
This option specifies which operator review contacts are assigned to.
Review contacts are created when new records (Phone, Email, Address) are added by debtors on
their settings page or when a closed debtor account attempts to sign in.
If blank, review contacts are assigned to the debtor's collector.
If a Contact Plan is defined below for Phone, Email, or Address, then the plan will
execute instead of creating this review. |
| Log Debtor Sign-On to Notes |
Records a note to the debtor record whenever this debtor signs on to the consumer portal:
- 0 - Disabled (Default)
- 1 - Enabled
|
| Transaction WHERE clause |
Leave Blank for default behavior, which is all Payment Transactions with the Omit from
Client Statement box unchecked. To further filter the query, you can add an additional
statement.
Example:
'tr_type in [101, 102, 110]'
|
| Required Registration Fields |
You may optionally select which field(s) used to verify account ownership during
registration are required. |
| Disabled Registration Fields |
You may optionally select which field(s) used to verify account ownership during
registration are disabled. |
| Contact Plan - New Phone |
You may optionally select a contact plan to run when the user adds a new phone record.
If left undefined, the above review contact will be created by default. |
| Contact Plan - New Email |
You may optionally select a contact plan to run when the user adds a new email record.
If left undefined, the above review contact will be created by default. |
| Contact Plan - New Address |
You may optionally select a contact plan to run when the user adds a new address record.
If left undefined, the above review contact will be created by default. |
| Contact Plan - Inactive Login |
You may optionally select a contact plan to run when a user whose mode on their debtor
account is NOT active attempts to log in.
If left undefined, the above review contact will be created by default. |
| Contact Plan - Forgot Password |
You may optionally select a contact plan to run when a user provides an email address that
does not exist on their account when making a forgot password request. |
| Contact Plan - Authorization Form |
You may optionally select a contact plan to run when a user submits the Authorization Form
on their first login. The Authorization Form will only be displayed on the user's first
login if it has been configured in the Client-Side Configuration above. |
| Display Grouped Accounts |
If this option is enabled, then debtors in the same group as the primary debtor account
will be listed under Linked Accounts on the home/accounts page. This will allow the user
to view the payment history and make payments on the grouped debtor accounts. |
| Display Inactive Grouped Accounts |
If this option is enabled, then grouped debtor accounts whose mode is NOT active will be
listed under Linked Accounts. The primary debtor account will still need to be Active to
allow sign-on. This option will have no effect if Display Grouped Accounts is disabled. |
| Inactive Account - Grace Period |
Specifies the number of days a user may still log in after their debtor account has been closed. |
| Check Payment - Transaction Type |
This option enables the check payment form on the payment screen and defines what
transaction type will be used when generating the check transaction. |
| Contact Us - Client Phone Field |
You may optionally select a client field that will be used to fetch the Phone value on the
Contact Us page. The value will be fetched from the specified field of the client record
that owns the consumer account. If no value is selected or if the specified field is empty,
then the company -> support -> phone value from runtime-config.json will be used. |
| Contact Us - Client Email Field |
You may optionally select a client field that will be used to fetch the Email value on the
Contact Us page. The value will be fetched from the specified field of the client record
that owns the consumer account. If no value is selected or if the specified field is empty,
then the company -> support -> email value from runtime-config.json will be used. |
| User Documents Enabled |
This option specifies if the "My Documents" page is enabled for consumers. The My Documents
page allows consumers to download attachment records linked to their debtor record in Collect! |
| User Documents Configuration |
This option specifies the criteria used to display attachment records on the My Documents
page. Consumers may only view/download files that match this criteria.
WARNING: If no criteria are specified, then all attachment records will be visible to consumers.
When you have update the rules, click Confirm. You MUST still click on Save Changes on the
main form. |
TCN Chat Configuration
TCN account holders can link TCN Chat to their Collect! consumer portal to give their consumers
the opportunity to use chat bot and agent chat functions from their consumer portal.
Collect! Side Preparation
If not already done:
- Install the Collect! API as per How To Install The Rest API
- Install and configure the Consumer Portal as per the above instructions
TCN Side Preparation
Contact TCN for TCN Chat setup and training. TCN Chat provides a range of options for bot
responses and live agent chat.
Installing TCN Chat in the Collect! Consumer Portal
- Open your TCN Omniboss Dashboard and navigate to the X page
- locate X
- Copy the TCN Chat API Key to your clipboard
- Open your Collect! Consumer Portal and navigate to the runtime-config.js file. Add the
following code to the end of file and include your TCN APIKey and other configurations.
tcnConfig: {
apiKey: '{TCN API Key}',
url: 'chat.usa.tcn.com',
mainColor: '#2BA3BB',
headingColor: '#FFFFFF',
paragraphColor: '#000000',
}
You may have to use a different URL. Please contact TCN support to obtain the correct URL.
|
Was this page helpful? Do you have any comments on this document? Can we make it better? If so how may we improve this page.
Please click this link to send us your comments: helpinfo@collect.org