Skip to main content

oPOS/TPO Admin - Branding for cPOS*

Ryan Cory
  • Updated

Overview

Release 6.1.1000 includes the addition of a Consumer Site Admin page where system administrators can modify the appearance of cPOS to align with their desired brand appearance for each level of their organization. Users can change the following aspects:

  • Logo
  • Colors
  • Font Styling
  • Footer Templates

Configurations

This configuration requires access to iMP System Administrator 

In order to access the Consumer Site Admin page, a user must have the Access Consumer Site privilege in iMP System Admin. 

By default, users with the Admin role have this privilege. To give a user this privilege, go to iMP System Admin > User Profiles > Select desired Profile and click Edit > Roles/Privileges > Access Consumer Site

____________________

oPOS/TPO Admin: Consumer Site

A new page as been added to oPOS/TPO where admins can modify certain appearance settings for cPOS. To access this new page:

  1. Log in to Loan Center as an Admin
  2. Click on the Admin menu link
  3. Click Consumer Site under System Admin

consumersitemain.png

 

Hierarchy Selection Dropdowns

Hierarchy.png

At the top of the Consumer Site are dropdowns that change what level of the company is currently selected. Whatever level the hierarchy dropdowns are set to is the level that will be edited in the Branding & Content dropdown below. The order of options in this selection are:

  1. Company
  2. Channel
  3. Division
  4. Branch
  5. Loan Officer

Selecting a level from a dropdown will reveal the dropdown of the next lowest level. For example, in order to view the Division dropdown, the user must select a Channel first. The currently selected hierarchy level's name will display under the hierarchy dropdowns in green text with current hierachy level next to it in parenthesis 

To manually save any changes, click the blue Save button at the top right of the page

Note: The System and Configuration accordions (expandable and collapsible section) are currently disabled

 

Branding & Content Section

Within this section is where most of the appearance editing will take place. When the Branding & Content section is clicked the arrow expands, displaying the following tabs:

  • UI & Styling - Used for styling the appearance for cPOS
  • Sections - Used for defining custom images and text that appears on the Milestone, 1003 and Dashboard.
  • Disclaimers - Used for inserting e-Consent text, HMDA text, etc.

Note: The Sections and Disclaimers tabs are currently are disabled and they will be enabled in a future release.

 

UI Styling Tab

Below the UI Styling tab is where users may make changes to the appearance of cPOS. The administrator may apply a logo, define branding colors, use a custom font, and create a footer with 3 template options, or create a custom HTML footer

 

Logo Subsection

Logo.png

Pulls Logo From: This dropdown will display the hierarchy options based on what is selected on the hierarchy selector at the top. For example, if the hierarchy selector is set on a 'Division', then this field will display 'Division' and 'Company' but not 'Branch.' When a hierarchy selection has been made, an example logo will appear next to this field.pull-logo-from.png

The Pull Logo From field is pulling an existing logo already setup in SysAdmin:
SysAdmin-Company-Level.png
In SysAdmin, if an existing logo is already in the Company level, Channel level, or Division level, the Pull Logo From dropdown will look at what is already in SysAdmin (company, channel, division hierarchy) and grab the logo, which can be applied to style the cPOS header.

 

Use Different Logo
use-different-logo.png
If the preferred logo that you want to display to the consumer isn't in SysAdmin logo, the administrator may choose to use a different logo.

If the user selects 'Use Different Logo' in the Pull Logo From dropdown, the following 2 fields become enabled allowing the admin to enter in the url path of the logo:

  • Header Logo Image URL
    • This logo will appear on the cPOS top header
  • Menu Logo Image URL
    • This logo will appear within the hamburger menu

Favicon Folder URL: This field is used to change the Favicon icon, the small icon that appears on browser tabs next to the tab's name

Once a logos and favicon are applied and saved, it will get stored in: SysAdmin/Configuration/Configuration - Wordpress

 

Colors Subsection

colo.png

Admins can edit the colors of various fonts and fields in cPOS/TPO using this subsection. Each field has both a text box and a color selector. Users can type in the hex value (#XXXXXX) or click the colored box to select a color. The fields within the Colors (subsection) include:

  • Primary Color: Modifies the primary color (defaulted to blue #046492) that appears on the:
    • Progress Indicator
    • Active Section (left nav)
    • Ring circle behind the Loan Officer's photo
    • Next button

Primary.PNG

  • Secondary Color: Modifies secondary colors (defaulted to green #4f8300) and applies to button colors.

Secondary.PNG

  • Indicators/Badges: Modifies the color of indicators and badges (defaulted to green #4f8300)
    • Number count of tasks
    • Completed sections (checkmark)

Indicator_and_Badges.png

  • Static Text and Icons Color: Modifies the color of static text and icon colors (defaulted to blue #046492) 

Static_Text_and_Icon.PNG

  • Input Field Color: Modifies the color of the labels of input fields (defaulted to blue #046492)

Input_Field.PNG

  • Text Link Color: Modifies the color of the text in URL links (defaulted to dark blue #046492)
  • Background Color: Modifies the background color (defaulted to white #f5f5f5)
  • Background Image URL: Provides a field that only accepts URLs where admins can enter the folder path of a desired background image
    • Saved under SysAdmin/Configuration/Configuration - Wordpress/clover.global.background.image

Font Subsection

font.png

The Font subsection is used to modify what font is being used across TPO/oPOS. It includes the following fields:

  • Font Family for Entire Application: A field where admins can input the name of the font being used in the Google Web Font CSS URL below
  • Google Web Font CSS URL: If there is a specific google font that the user wants to use, this field is where the URL path of the font would go. Users can browse available google fonts by clicking the URL link adjacent to this field

Footer Subsection

Footer.png

The Footer subsection is where users can modify the appearance and content of their footer. The dropdown contains the following fields:

  • Footer Template Options: There are 3 available pre-made template options that can be used and also can choose Custom HTML (4th option).
    • Template 1template1.png
    • Template 2
      template2.png
    • Template 3 
      template3.png
    • The 3 template options does not require knowing any html. These 3 templates will adjust the layout to mobile and tablet screens.
    • The 4th option, Custom HTML requires understanding of responsive HTML code.
  • Footer Background Color: Modifies the color in the background of the footer using either hex value text or a color selector (defaulted to blue #046492)
    • Once a color is applied to the Company level, it then applies to child: Channel, Division, Branch, and LO as well. These lower levels can still have their color modified separate from the parent styling.
    • If the Company level has a different hex color than what is selected, then a reset icon will appear next to it. Clicking it will revert back to the Company level's default color for footer backgrounds
  • Footer Text Color: Modifies the color of the text displayed in the footer using either hex value text or a color selector (defaulted to white #ffffff)
  • Pull Data From: Displays currently selected hierarchy level and the levels above it. For example if Division is selected in the hierarchy dropdown, this field will display 'Company', 'Channel,' and 'Division' but not 'Branch'
    • Each level selected will automatically populate the following fields with information pulled from iMP SysAdmin:
      • Branding Display Name
      • Address
      • NMLS (exists on the Division level in SysAdmin)
  • Contact Info
    • Contact Email: Must include a valid email. Nothing will display on the footer if this field is empty. When a valid email is entered it will automatically be inserted as a link onto the example footer
    • Contact Telephone: Must include a valid 10 digit phone number. Nothing will display on the footer if this field is empty. When a valid telephone number is entered, it will automatically be inserted as a link onto the example footer
  • Legal Links 
    • Privacy Policy URL & Terms of Use URL fields: These fields are used to input a custom URL. When links are put into these fields, the system will automatically input the URL into the footer 
      • The configuration for these two fields are found under Legal.PrivacyPolicy.URL.CS and Legal.TermsOfUse.URL.CS in iMP SysAdmin
      • If the user does not want to input a URL but instead show a text window when clicked, leave these URL fields blank. The configuration for the text shown can be found under Legal.PrivacyPolicy.Manual.CS and Legal.TermsOfUse.Manual.CS. 
    • The Use Company Level checkmark boxes next to the Privacy Policy URL and Terms of Use URL fields will display the same Privacy Policy and Terms of Use links as the company level when selected
      • Privacy Policy:
        • If SysAdmin/Configuration 'Legal.PrivacyPolicy.URL.CS' is set to 'false', Use Company Level checkbox is disabled
        • If SysAdmin/Configuration 'Legal.PrivacyPolicy.URL.CS' contains a URL of the company's Privacy Policy, then the checkbox is selectable. Selecting this checkbox will automatically input the URL onto the example footer, but it will display as Privacy Policy
      • Terms of Use:
        • If SysAdmin/Configuration 'Legal.TermsOfUse.URL.CS' is set to 'false', the Use Company Level checkbox is disabled
        • If SysAdmin/Configuration 'Legal.TermsOfUse.URL.CS' contains a URL of the company's Terms of Use, then the checkbox is selectable. Selecting this checkbox will automatically input the URL onto the example footer, but it will display as Terms of Use
    • Disclosures URL: Used to input a URL link into the footer that goes to Lender's Disclosure page. If this field is empty, no disclosure label or link will display on the footer
    • Licensing URL: Used to input a URL link into the footer that goes to Lender's Licensing page. If this field is empty, no Licensing label or link will display in the footer
    • Disclaimer Verbiage: Admins can type in the disclaimer text in this field which will appear on any of the footer templates. Pre-populated with 'Disclaimer text goes here'

­­­­­­­­­­­­­____________________

Testing Overview:

  1. Requires SysAdmin 'Access to Consumer Site Admin' privilege
    • Checkbox appearing under Privilege tab
    • The Administrator role includes this privilege
  2. TPO Admin: "Consumer Site" General UI/Functionality
    • Admin Menu has link to Consumer Site
    • "Consumer Site" page which should include:
      • Page name (on black bar)
      • Hierarchy Selector
        • The green text beneath the Hierarchy reflects what is selected 
      • Accordion Sections
        • Branding & Content
          • Sub-Tabs:
            • UI Styling
            • Disclaimer (this selection is greyed out, same as Sections)
      • Sub Tabs under UI Styling
        • Logo
        • Colors
        • Font
        • Footer
      • Disclaimer (disabled)
  3. Styling "Company"
    • Retail Environment: 'Cloudvirga' 
    • TPO Env: 'ABC Lender'
  4. Styling "Division"
    • RETAIL 'Credit Unions' (with Business Entity flag)
      • Americas-CU
      • Best-CU
    • for RETAIL 'Division'  (with Business Entity flag)
      • Stratosphere Mortgage
    • for TPO 'Brokerages'  (with Business Entity flag)
      • Blue Mortgage
      • Green Mortgage
  5. Styling "Branch"
  6. Preserving existing (html/css) of Current Retail Customers from WP

Acceptance Criteria Pre-Requisites:

iMP SysAdmin Retail Environment should have:

    1. Company Level: 
    2. Channel Level:
      • Include Channels for:
        • Credit Union
        • Retail
        • Direct
    3. For Credit Union (Channel) add a few Credit Unions (Division)
      • Each Credit Union Division should have the following:
        • A logo
        • Their division profile info populated (branding display name, address, nmls#, etc)
        • Their own vanity url (example: Americas-CU.com, Best-CU.com, Care-CU.com)
      • Each Credit Union Division should have just 1 Branch
        • Branch profile must contain a logo, address, phone, state licenses
        • Branch rosters contains a few Loan Origination Systems (LOS)
    4. For "Retail" (Channel) add a few Non-Business Entities (Divisions), for example 'Retail-West' and 'Retail-East'
      • Each of these Divisions do not need a logo, they will inherit the Company's logo
      • Each regular division should have a few Branches (example: Retail-West: should have: Irvine-Branch, LA-Branch, SD-Branch)
        • Branch profile must contain (logo, address,, phone, state licenses, etc)
        • Branch rosters contains a few LOs
    5. For "Direct" (Channel) add a Business Entity (Division) and call it ‘Stratosphere Mortgage’
      • This Division should have the following: 
        • A logo (stratosphere-logo) 
        • The division profile info populated (branding display name, address, nmls#, etc)
        • Their own vanity url 
          • ex: StratoshereMortgage.com
      • Include a few "branches" under "Stratosphere Mortgage" (ex: Stratosphere Irvine-CA, Stratosphere Los Angeles-CA, Stratosphere San Diego-CA)
        • Use the same "Stratosphere" logo that is used on the "Division"
        • Branch profile must contain (logo, address, phone, state licenses, etc)
        • Branch rosters contains a few LOs, LOAs, and LPs

 

iMP SysAdmin TPO Environment should have: 

  1. Company Level 
    • Company name: 'ABC Lender' 
    • Complete Company Profile (logo, branding display name, address, telephone, NMLS#)
    • “SysAdmin/Configuration/” to have URLs added to the following configuration fields: 
      • Legal.PrivacyPolicy.URL.CS
        • Use your company's policy URL
      • Legal.TermsOfUse.URL.CS
        • Use your company's Terms of Use URL
  2. Channel Level
    • Should include Channels for:
      • ‘TPO-Western’
      • ‘TPO-Central’
      • ‘TPO-Eastern’
  3. A few Brokerages (Division > Business Entities):
    • Within TPO-Western (channel), include these Divisions: (Blue Mortgage, Green Mortgage)
    • Within TPO-Central (channel), include these Divisions: (Red Mortgage, Orange Mortgage)
    • Within TPO-Eastern (channel), include these Divisions: (Gold Mortgage)
    • EACH of the above Divisions should have:
      • A logo
      • Their own vanity URL
      • Brokerage (Division) profile info populated (branding display name, address, nmls#, etc)
      • A few Branches
        • Each branch includes a few LOs and LPs.

____________________

Acceptance Criteria # 1: iMP System Administrator 

Administrator Settings

  1. Log in to (old?) SysAdmin as an Administrator
  2. View the Privileges tab in your account/profile page
  3. VERIFY: Access to Consumer Site Admin privilege is selected as default
  4. Search other roles within SysAdmin (ex: LO, LOA, LP, Branch Manager, Account Manager)
    • VERIFY: The checkbox for the Access to Consumer Site Admin privilege is unchecked
    • Find a Retail Account Manager who sits on a Channel level and give the privilege Access to Consumer Site Admin to this user
    • Find a Loan Officer who is associated to a Business Entity (ex: Credit Union, or TPO Brokerage) and give privilege Access to Consumer Site Admin to this user.
  5. Search other new roles for TPO: Regional Sales Manager, Account Executives, Account Manager, Production Assistant, and Contract Processor
  6. Click into the Privileges tab for those account/profiles 
    • VERIFY: The checkbox for the Access to Consumer Site Admin is unchecked
    • Find a Regional Sales Manager and give privilege 'Access to Consumer Site Admin" to this user

After saving these settings, test the following roles in TPO

A. Administrator logging in to TPO

  1. Log in to TPO as an Administrator
  2. Click on the Admin menu button at the top right
  3. VERIFY: the Consumer Site link is included in the menu dropdown
  4. Click on the Consumer Site link
  5. VERIFY: you are directed to the "Consumer Site" page
  6. VERIFY: you have full access on the Hierarchy Selector (Company, Channel, Division, Branch, and Loan Officer)

B. Account Manager logging in to TPO

  1. Ensure the profile being used has the Access to Consumer Site Admin privilege (SysAdmin > Privileges tab)
  2. Log in to TPO as an Account Manager
  3. Click on the Admin menu button at the top right
  4. VERIFY: the Consumer Site link is included in the menu dropdown
  5. Click on the Consumer Site link
  6. VERIFY: you are directed to the "Consumer Site" page
  7. VERIFY: the Account Manager defaulted to only having access to their own Channel on the Hierarchy Selector
    • VERIFY: this user cannot browse outside his own Channel
    • VERIFY: this user can view all Divisions, Branches, and Loan Officers under his own Channel

C. Loan Officer associated to a Business Entity logging in to TPO

  1. Ensure the profile being used has the Access to Consumer Site Admin privilege (SysAdmin > Privileges tab)
  2. Log in to TPO as a Loan Officer associated to a Business Entity
  3. Click on the Admin menu button at the top right
  4. VERIFY: the Consumer Site link is included in the menu dropdown
  5. Click on the Consumer Site link
  6. VERIFY: you are directed to the "Consumer Site" page
  7. VERIFY: the Loan Officer defaulted to only having access to their own Division on the Hierarchy Selector
    • VERIFY: the 'Company', 'Channel' and 'Division' select fields are disabled.
    • Verify this user can view all 'branches' and 'LO's' under his own "Division" (with Business Entity)

D. Regular LO with NO Access to the Consumer Site Admin privilege

  1. Log in to TPO as a Loan Officer that has NO access to the Consumer Site Admin privilege
  2. VERIFY: the Admin menu does not appear

E. TPO: Regional Sales Manager with the 'Access to Consumer Site Admin' privilege

  1. Make sure the profile being used has the Access to Consumer Site Admin privilege (SysAdmin > Privileges tab)
  2. Login to TPO as the Regional Sales Manager
  3. Click on the Admin menu button at the top right
  4. VERIFY: the Consumer Site link is included in the menu dropdown
  5. Click on the Consumer Site link
  6. VERIFY: you are directed to the "Consumer Site" page
  7. VERIFY: you have full access on the Hierarchy Selector

 

AC2 (General UI/Functionality)

Note to tester: You may want to have 2 environments running simultaneously (1 for Retail, the other for TPO)

A. Admin Menu Link

  1. Login as an Administrator to TPO
  2. Click on the Admin menu button at the top right
  3. VERIFY: the Consumer Site link is included in the menu dropdown
  4. Click on the Consumer Site link
  5. VERIFY: you are directed to the "Consumer Site" page

B. Consumer Site (Admin Page)

  1. VERIFY: below the top navbar is displaying a black bar that has CONSUMER SITE​ as the “page name” label in green
  2. VERIFY: below the “page name” is the Hierarchy Selector
  3. VERIFY: below the Hierarchy Selector are the Accordions (System, Config, Branding & Content)
    • System (VERIFY: this accordion is disabled)
    • Configuration (VERIFY: this accordion is disabled)
    • Branding & Content (VERIFY: by clicking this accordion, it expands)
  4. VERIFY: within the "Branding & Content" accordion section are 3 tabs:
    • UI Styling 
      • VERIFY: this tab is selected by default
    • Section 
      • VERIFY: this tab is disabled
    • Disclaimer
      • VERIFY: this tab is disabled
  5. VERIFY: under the UI Styling tab includes these sub-accordion dropdowns:
    • Logo (expanded by default)
    • Colors (expanded by default)
    • Font (expanded by default))
    • Banners (hidden by default)
    • Footer (expanded by default))

C. Hierarchy-Selector

C.1) Hierarchy Selector (Retail Environment)

  1. VERIFY: the Company name is defaulted displaying the company branding display name and the Company field is not selectable
    • For Retail Environment this should be set to ‘Cloudvirga' 
  2. VERIFY: below the Hierarchy Selector the company branding display name is displayed in green text along with the current level in the hierarchy: Cloudvirga (Company)
    • For Retail Environment this should display Cloudvirga
  3. VERIFY: to the right of Company selector is the Channel selector dropdown defaulting to "Select One"
    • Verify the dropdown for Channel includes:
      • Select One
      • Credit Union
      • Retail
      • Direct
  4. Channel Selector (Retail Environment)
    • From the Channel dropdown, select Retail
      • VERIFY: the Division dropdown displays to the right of Channel dropdown and Division dropdown is defaulted to 'Select One'
      • VERIFY: below the Hierarchy Selector section is showing the branding display name in green text and the level of hierarchy: Retail (Channel)
        1.  
    • VERIFY: Under "Division" selector dropdown includes these options:
          1. Select One
          2. Retail-West
          3. Retail-East
    • Select 'Retail West' from the Division dropdown
      • VERIFY: Branch selector displays to the right of Division selector and Branch selector is defaulted to 'Select One'
      • VERIFY: below the Hierarchy Selector section is showing the branding display name in green text and the level of hierarchy:  Retail-West(Division)
    • Select the 'Irvine-Branch' Branch that was created under the Retail West Channel
      • VERIFY: Loan Officer dropdown displays to the right of Branch dropdown and the Loan Officer selector is defaulted to 'Select One'
      • VERIFY: below the Hierarchy Selector section is showing the branding display name in green text and level of hierarchy: Irvine-Branch (Branch)
      • VERIFY: within the Loan Officer dropdown is only displaying the Loan Officers who are under Irvine Branch
    • Select a Loan Officer from the Loan Officer dropdown
      • VERIFY: below the Hierarchy Selector section is showing the branding display name in green text and level of hierarchy: Joanne Irvine (Loan Officer)
    • VERIFY: to the right of the Hierarchy Selector section is a Save button
    • From Channel dropdown, select 'Credit Union'
      • VERIFY: Division selector displays to the right of Channel selector and Division dropdown is defaulted to 'Select One'
        • VERIFY: everything that was to the right of "Division" selector (the Branch and Loan Officer dropdowns) has cleared
      • VERIFY: below the Hierarchy Selector section is showing the branding display name in green text and level of hierarchy: Credit Union (Channel)
    • VERIFY: the Division dropdown is showing the following options:
          1. Select One
          2. Americas-CU
          3. Best-CU
          4. Care-CU
    • From the Division dropdown select 'Americas-CU'
      • VERIFY: the Branch dropdown is appearing to the right of Division dropdown, defaulting to 'Select One'
        • VERIFY: only 1 branch appears in the dropdown
      • VERIFY: below the Hierarchy Selector section is showing the branding display name in green text and level of hierarchy: Americas-CU (Division)
    • From the Division dropdown, select 'Best-CU'
      • VERIFY: the Branch dropdown is appearing to the right of Division dropdown and defaults to 'Select One'
        • Verify only 1 branch appears in the Branch dropdown
      • VERIFY: below the Hierarchy Selector section is showing the branding display name in (green text) and level of hierarchy: Best-CU (Division)
    • From the Division dropdown, select 'Care-CU'
      • Verify the Branch dropdown is appearing to the right of Division dropdown and defaults to 'Select One'
        • Verify only 1 branch appears in the Branch dropdown
      • VERIFY: below the Hierarchy Selector section is showing the branding display name in (green text) and level of hierarchy: Care-CU (Division)
    • From the Division selector, select 'Select One'
      • VERIFY: the Branch dropdown is NOT appearing to the right of Division dropdown
      • VERIFY: below the Hierarchy Selector section is showing the branding display name in green text and level of hierarchy: Credit Union (Channel)

C.2) Hierarchy Selector:  TPO - Environment

  1. VERIFY: the Company name is defaulted displaying the 'company branding display name' and the Company field is disabled
    • for TPO Environment (per the Pre-Requisite Setup above): 'ABC Lender'
      • VERIFY: below the Hierarchy Selector is showing the branding display name in green text and level of hierarchy: ABC Lender (Company)
  2. VERIFY: to the right of the Company dropdown is the Channel dropdown defaulting to 'Select One'
    • VERIFY the dropdown for Channel includes:
      • 'Select One'
      • 'TPO-Western'
      • 'TPO-Central'
      • 'TPO-Eastern'
  3. Channel Dropdown (TPO-Western)
    • Select 'TPO-Western' from the Channel dropdown
      • VERIFY: the Division dropdown (defaulting to 'Select One') displays after Channel dropdown
      • VERIFY: the Division selector dropdown is showing the following:
        • 'Select One'
        • 'Blue Mortgage'
        • 'Green Mortgage'
      • VERIFY: below the Hierarchy Selector is showing the branding display name in green text and level of hierarchy: TPO-Western (Channel)
    • Select 'Blue Mortgage' from the Division dropdown
      • Verify: the Branch dropdown (defaulting to 'Select One') displays after Division dropdown
        • VERIFY: within Branch dropdown is showing 'Select One' and the Branches that are setup under "Blue Mortgage"
        • VERIFY: below the Hierarchy Selector is showing the branding display name in green text and level of hierarchy: Blue Mortgage (Division)
      • Select a Branch that is under Blue Mortgage
        • VERIFY: the Loan Officer dropdown (defaulting to 'Select One') displays after the Branch dropdown
        • VERIFY: below the 'Hierarchy Selector' is showing  the branch name within<h1> in green text
    • Select 'Green Mortgage' from the Division dropdown
      • VERIFY: Branch dropdown (defaulting to 'Select One') displays after Division dropdown
      • VERIFY: within Branch dropdown  is showing 'Select One' and the Branches that are setup under Green Mortgage
      • VERIFY: below the Hierarchy Selector is showing the branding display name in green text and level of hierarchy: Green Mortgage (Division)
  4. Channel Dropdown (TPO-Central)
    • Select 'TPO-Central' from Channel dropdown
      • VERIFY: Division dropdown (defaulting to 'Select One') displays after Channel dropdown
      • VERIFY: within Division dropdown is showing:
        • 'Select One'
        • 'Orange Mortgage'
        • 'Red Mortgage'
      • VERIFY: below the Hierarchy Selector is showing the branding display name in green text and level of hierarchy: TPO-Central (Channel)
    • Select 'Orange Mortgage' from the Division dropdown
      • VERIFY: Branch dropdown (defaulting to 'Select One') displays after Division dropdown
        • VERIFY: within Branch dropdown is showing 'Select One' and the Branches that are setup under Orange Mortgage
        • VERIFY: below the Hierarchy Selector is showing the branding display name in green text and level of hierarchy: Orange Mortgage (Channel)
    • Select "Red Mortgage" from the "Division" selector (dropdown)
      • Verify: "Branch" selector (defaulting to "Select One") displays after "Division" selector
        • VERIFY: within Branch dropdown is showing 'Select One' and the Branches that are setup under Red Mortgage
        • VERIFY: below the Hierarchy Selector is showing the branding display name in green text and level of hierarchy: Red Mortgage (Division)

D. Branding & Content Accordion Section

  1. Expand on Branding & Content accordion 
  2. With UI-Styling tab pre-selected
  3. VERIFY: the following sub-accordion sections should be expanded
    • Logo
    • Colors
    • Font
    • Footer

E. Logo Sub-section Accordion

  1. For Retail Environment, on the Hierarchy Selector, have the "Company" selector set on Cloudvirga 
    • Note: below the Hierarchy Selector should be displaying Cloudvirga
  2. In the Logo section
    • Pull Logo From field 
      • VERIFY: when selecting a Company within the Pull Logo From dropdown it displays the same logo as stored in SysAdmin on the company-level
      • VERIFY: a sample image logo of Cloudvirga displays to the right of the Select field
      • VERIFY: the dropdown for Pull Logo From  field doesn't show:
        • Channel
        • Division
        • Branch
        • Loan Officer 
      • With 'Company' selected, VERIFY the 2 fields below are disabled:
        • Header Logo Image URL
        • Menu Logo Image URL
      • VERIFY: 'Use Different Logo' appears in the dropdown for Pull Logo From field, and select this option
      • VERIFY: the input field for Header Logo Image URL  is enabled.
      • VERIFY: the input field for Menu Logo Image URL  is enabled
      • VERIFY: the last field within the "Logo" (sub-section) is "Favicon Folder URL"
      • Change the dropdown for Pull Logo From to 'Company'
      • Click the Save button at the top right of the Hierarchy Selector section
      • VERIFY: the 'Company-level' logo (Cloudvirga) is stored in SysAdmin/Configuration/Configuration - Wordpress/ (in these 2 configuration fields:)
        • clover.logo.header.image
        • clover.logo.menu.image
      • Go to TPO environment and verify the same logo that is stored on SysAdmin (company-level) appears on the TPO header (top navigation bar)
    • Register in TPO, once you are on the "Loan Purpose" page, click on hamburger menu
    • VERIFY: the same logo pulled from 'company-level' in iMP SysAdmin  appears in the menu.
    • Go back to the "Consumer Site" via the Admin dropdown
    • Change the Pull Logo From dropdown to 'Use Different Logo'
    • Go to Google.com and right click on the Google logo and select copy image url
    • Paste the URL of the Google logo into the Pull Logo From field 
    • Verify: the mceclip0.png icon appears to the right of those 2 fields.
    • Click Save.
    • Go to SysAdmin/Configurations/Configurations - Wordpress
    • Verify the google logo image url path appears in these 2 configuration fields:
    • Go back to Clover and refresh the page
    • Verify the header logo, and menu logo got replaced with "Google"
    • Go back to the "Consumer Site" and switch the Pull Logo From dropdown back to 'Company'
    • Click Save
  3. Now go select from the Hierarchy Selector dropdowns
    • Select the following:
      • Channel: 'Credit Union'
      • Division: 'Americas-CU'
    • VERIFY: Underneath the Hierarchy Selector dropdowns is displaying "Americas-CU"
    • Go to the Logo sub section under the UI Styling tab
    • VERIFY: the Pull Logo From dropdown includes these options:
      • Select (default)
      • Company (enabled)
      • Channel (disabled)
      • Division (enabled)
      • Use Different Logo (enabled)
    • Select Company
      • VERIFY: the Cloudvirga logo displays to the right of the Select field
    • Select "Division"
      • VERIFY: the Americas-CU logo displays to the right of the select field.
    • Click Save
    • VERIFY: the 'Americas-CU' logo image url path appears in these 2 configuration fields in SysAdmin/Configuration/Configuration-Wordpress
      • logo.header.image
      • logo.menu.image
    • VERIFY: in the 2 configuration field that
      • Cloudvirga (logo) is on the company-level (1st record)
      • Americas-CU (logo) is on the division-level (2nd record)
    • Go to the vanity URL instance for "Americas-CU"
    • VERIFY: the Americas-CU logo appears on the top navbar (header)
    • Register, and when you get to the Loan Purpose page, click on the hamburger menu.
    • VERIFY: the Americas-CU logo is appearing on the menu overlay.

 

F.  Colors Sub-section Accordion

  1. On the Retail Environment 'Cloudvirga' change the Hierarchy Selector back to the 'Company'
  2. VERIFY: the following colors are the default CSS colors for the following fields in [Loan Center Admin - Colors section] AND [SysAdmin/Configuration/Configurations-WordPress/]:

    LoanCenter Admin (Color) Field Label

    SysAdmin/Configurations/Configurations-Wordpress

    Default Value

    VERIFY:

    Primary Color

    Clover.global.color.primary

    #046492

    {existing}

    Secondary Color

    Clover.global.color.secondary

    #4f8300

    {new change}

    Indicator/Badge Color

    Clover.global.color.badge

    #4f8300

    {new change}

    Static Text and Icon Colors

    Clover.global.color.static

    #046492

    {existing}

    Input Field Text Color

    Clover.global.color.input

    #046492

    {existing}

    Text Link Color

    Clover.global.color.link

    #0f4880

    {new change}

    Background Color

    Clover.global.color.background

    #f5f5f5

    {existing}

    Background Image URL

    Clover.global.background.image

    ~/assets/img/temp/nebula-bg.jpg

    {existing}
  3. Go to cPOS/TPO Environment for 'Cloudvirga' (company level) url
    • Verify: the new colors are appearing on the registration page
      • Secondary Color (appearing on the action button) is now green #4f8300
      • Text Link Colors is now blue #0f4880
    • Once registered in cPOS/TPO, go through the Loan Purpose section
      • VERIFY: the link for tooltip modals got applied with text link color of blue #0f4880
    • Complete the Loan Purpose section
      • VERIFY: on the left navigation, the Loan Purpose is green as in completed with #4f8300 color
  4. Go back to "Loan Center Admin" page in the Colors sub-section
    • VERIFY: All the color fields for hex values are combo fields that contains: 
      • a text input field <input type="text">
      • Color picker field <input type="color">
    • Primary Color: (CV's default color:  #046492)
      • Change the Primary Color to "red" (type in #8a1e49 in the hex field)
        • NOTE: in WP you can type in the color name or hex value.
      • VERIFY: the color picker (rectangle color) is showing 'red'
      • VERIFY: the mceclip0.png icon displays
      • Click on the mceclip0.png icon
      • VERIFY: it reverted back to the original hex value of #046492
        • Verify the mceclip0.png icon is not displaying once reverted back
      • On the color rectangle (color picker field) click on the rectangle color that is currently the (cv default primary color: #046492).
      • Select any color (like dark red color) from the color picker
      • Verify the selected color replaced the previous color rectangle and that the hex code of that selected color appears in the input field.
      • Verify the reset icon appears
      • In the hex field change it to '#9E2339'
  5. Secondary Color: (CV's default color: #4f8300 )
    • Run the same test like Primary Color up above running steps 1-9
    • Enter in the hex color to '#0075AA' 
  6. Indicator/Badge Color: (CV's default color is #4f8300)
    • Run the same test like Primary Color up above running steps 1-9
    • Enter in the hex color to '#43464A'
  7. Static Text and Icon Color: (CV's default color is #046492)
    • Run the same test like Primary Color up above running steps 1-9
    • Enter in the hex color to '#9E2339' 
  8. Input Field Color: (CV's default color: #046492)
    • Run the same test like Primary Color up above running steps 1-9
    • Keep the input field color as CV's default '#046492'
  9. Text Link Color: (CV's default color: #0f4880 )
    • Run the same test like Primary Color up above running steps 1-9
    • Enter in the hex color to '#0075AA' 
  10. Background Color: (CV's default color: #f5f5f5)
    1. Run the same test like Primary Color up above running steps 1-9
    2. Enter in the hex color to #f2f2f2 
  11. Background Image: (CV's default bg img is: ~/assets/img/temp/nebula-bg.jpg )
    1. Clear the field and enter in the hex color to: #f2f2f2 (this is Stewart's neutral color) in that Background Image (field)
  12. Click the Save button at the top right of the Consumer site
  13. Verify: the new hex values are stored in SysAdmin:

    LoanCenter Admin (Color) Field Label

    SysAdmin/Configurations/Configurations-Wordpress

    Default Value

    VERIFY:

    Primary Color

    Clover.global.color.primary

    #9E2339

    {existing}

    Secondary Color

    Clover.global.color.secondary

    #0075AA

    {new change}

    Indicator/Badge Color

    Clover.global.color.badge

    #43464A

    {new change}

    Static Text and Icon Colors

    Clover.global.color.static

    #9E2339

    {existing}

    Input Field Text Color

    Clover.global.color.input

    #046492

    {existing}

    Text Link Color

    Clover.global.color.link

    #0075AA

    {new change}

    Background Color

    Clover.global.color.background

    #f2f2f2

    {existing}

    Background Image URL

    Clover.global.background.image

    #f2f2f2

    {existing}
  14. Verify: in Clover the change appears on the company-level url

G. Font Sub-section Accordion

  1. VERIFY: the default "Font Family for Entire Application" is pre-populated with "Montserrat"
  2. VERIFY: the default "Google Web Font CSS URL" is pre-populated with https://fonts/googleapis/com/css?family=Montserrat
  3. VERIFY: to the right of the field is a link "fonts.google.com"
  4. VERIFY: when clicking the link it takes you to that google fonts page.

H. Banners Sub-section Accordion

  1. VERIFY: this section is hidden

I. Footer Sub-section Accordion

  1. VERIFY: the first field is Footer Template Options and the defaulted select field is set to 'Template 1'
  2. VERIFY: the dropdown for Footer Template Options are:
    • Template 1
    • Template 2
    • Template 3
    • Custom HTML
  3. VERIFY: to the right of the Footer Template Option field is:
    • Footer Background Color (with text field and color picker for designating color)
      • VERIFY: the color is defaulted to: #046492
      • Change the background color to black #000000
      • VERIFY: the mceclip1.png icon appears
      • VERIFY: the selected Template is showing "black background"
      • VERIFY: on the mceclip1.png icon
      • VERIFY: the background color switched back to #046492
    • Footer Text Color (with combo input field: Hex + Color picker)
      • VERIFY: the color is defaulted to: #FFFFFF (white)
      • Change the text color to "#FFFF00 (yellow)
      • VERIFY: the (revert icon appears)
      • VERIFY: the selected Template is showing "yellow font"
      • Click on the revert button
      • VERIFY: the font color switched back to #FFFFFF (white)
  4. Select each of the template footer options:
    • VERIFY the footer for 'Template' 1 (50/50 layout) has: 
      • Left half (50%) is displaying
        • Company Level's 'Branding Display Name' (heading)
        • Company Level's 'Address'
        • Company Level's  'NMLS#'
      • Right half (50%) is displaying
        • 'CONTACT US' (heading)
        • [contact-email]
        • [contact-telephone]
      • Lower full (100%) has:
        • <hr> (line)
        • (copyright) symbol + [currentYear] All rights reserved. Privacy Policy (link) + Terms of Use (link)
        • Disclaimer text goes here
    • VERIFY the footer for 'Template 2' (33/66) has:
      • Left half (33%) is displaying
        • 'CONTACT US' (heading)
        • [contact-email]
        • [contact-telephone]
      • Right half (66%) is displaying
        • Company Level's 'Branding Display Name' (heading)
        • Company Level's 'Address'
        • Company Level's  'NMLS#'
        • (copyright) symbol + [currentYear] All rights reserved. Privacy Policy (link) + Terms of Use (link)
        • Disclaimer text goes here
    • VERIFY the footer for 'Template 3' (33/33/33 footer) has: 
      • Left/third  (33%) is displaying
        • Company Level's 'Branding Display Name' (heading)
        • Company Level's 'Address'
        • Company Level's  'NMLS#'
      • Center/third (33%) is displaying
        • 'CONTACT US' (heading)
        • [contact-email]
        • [contact-telephone]
      • Right/third (33%) is displaying
          • . 'LEGAL LINKS' (heading)
          • Privacy Policy (link)
          • Terms of User (link)
      • Lower full (100%) contains
            • <hr> (line)
            • (copyright) symbol + [currentYear] All rights reserved
            • Disclaimer text goes here
      • VERIFY: the footer for Custom HTML looks like a blank html input field
      • Note: when loading a Retail Env, the existing html footer should already be pre-populated with their custom HTML code
    • Below each of the first 3 Template options are these following fields:
      • Pull Data From <select field> (defaulted to 'COMPANY')
      • Branding Display Name (disabled/read-only) <text input field> that should be showing 'Cloudvirga' (the same name that appears on the 'Hierarchy Selector' (top area below the header)
        • Note: the Hierarchy Selector should be set on the 'Company' level, and beneath it should be showing: Cloudvirga (Company) 
      • 'Address' (disabled/read-only) <address fields> that is pulling the same data from SysAdmin (Company) level 
      • 'NMLS#' (disabled/read-only) <text field> that is pulling the same data from SysAdmin (Company) level 
  5. Contact Info (section) 
    • Verify this section has the following blank fields:
      • 'Contact Email' (enabled/blank) <email field> 
      • 'Contact Telephone' (enabled/blank) <tel field>
    • VERIFY: when user enters an invalid email, the field errors displaying  in red alert style with the following error message: 'Please enter a valid email'
    • VERIFY: when the user enters invalid telephone, the field error displays in red alert style with the following error message: "Please enter a valid telephone'
    • Enter a valid email address (ex: support@cloudvirgamortgage.com)
      • VERIFY: the entered email displays on the selected template.
    • Enter a valid telephone # that has 10 digits
      • VERIFY: the entered phone number appears on the selected template.
    • Select the other 2 templates
      • VERIFY: the preserved email and telephone number appears.
  6. Legal Links section
    • VERIFY this section includes these field labels with the following <input types>:
      • Privacy Policy URL
        • <input type="url"> AND <checkbox> (pre-checked) for "Use Company Level"
        • VERIFY: in the url field is pre-populated with the same privacy policy value (link) pulling from SysAdmin/Configurations/PrivacyPolicy.URL.CS
        • VERIFY: when checkbox is unchecked
          • the value clears for 'Privacy Policy URL'
          • and 'Privacy Policy' (link) doesn't appear on any of the 3 templates.
        • Enter in a valid "Privacy Policy" (link) 
          • VERIFY: the "Privacy Policy" (link) now appears on the template
          • Note: after saving we will test this link in Clover
    • Terms of Use URL
      • <input type="url"> AND <checkbox> (pre-checked) for "Use Company Level"
      • VERIFY: in the url field is pre-populated with the same privacy policy value (link) pulling from SysAdmin/Configurations/TermsOfUse.URL.CS
      • VERIFY: when checkbox is "unchecked" 
        • the value clears for 'Terms of Use URL'
        • and 'Terms of Use' (link) doesn't appear on any of the 3 templates.
      • Enter in a valid "Terms of Use" (link)
        • VERIFY: the "Privacy Policy" (link) now appears on the template
        • Note: after saving we will test this link in oPOS/TPO
    • Disclosures URL
      • <input type="url">
        • VERIFY: this field is empty
        • VERIFY: when empty it does not display "Disclosures" as a link on any of the 3 templates
      • Enter in a URL for 'Disclosures URL' field (ex: https://google.com)
        • VERIFY: with the url entered that 'Disclosures' is appearing as a link on any of the 3 templates
    • Licensing URL
      • <input type="url">
        • VERIFY: this field is empty
        • VERIFY: when empty it does not display "Licensing" as a link on any of the 3 templates
      • Enter in a URL for 'Licensing URL' field (ex: https://www.cnn.com)
        • VERIFY: with the URL entered that 'Licensing' is appearing as a link on any of the 3 templates
      • Disclaimer Verbiage 
        • <text area>
          • VERIFY: the default value is displaying "Disclaimer text goes here"
          • VERIFY: on the Templates, it is displaying 'Disclaimer text goes here"
          • Change the value in the field to 'This footer is awesome!'
          • VERIFY: the Template footer is displaying "This footer is awesome!"
    • On Template 1 click Save at the top right of the page
      • Verify the new html is stored in SysAdmin/Configuration/Configurations-Wordpress/clover.global.footer.html
      • Go to Clover and refreshing the page,
      • VERIFY: the header is displaying 'Cloudvirga' - A Stewart company (logo)
      • VERIFY on the Registration page below the password creation field the links:
      • VERIFY the new Template 1 footer appears with:
        • Company Level (CLOUDVIRGA, address, nmls#)
        • CONTACT US - displays (email and tel)
          • Click the email field and verify the mail application launches
          • from your mobile device, click on the phone link and VERIFY that the phone app on your device opens
      • VERIFY the lower half of the footer includes:
        • Copyright symbold + [CurrentYear] + All rights reserved +(folllow by these 4 links)
          • 'Privacy Policy' (clicking it will open a new browser tab displaying Stewart's 'Privacy Policy')
          • 'Terms of User' (clicking it will open  a new browser tab displaying Stewart's 'Terms of Use')
          • 'Disclosures' (clicking it will open a new browser tab with google's page)
          • Licensing' (clicking it will open a new browser tab with cnn's page
        • Disclaimer text is: 'This footer is awesome!'
      • Resize the window for table (VERIFY: the content adjusts to the responsive layout)
      • Resize the window for mobile (VERIFY: the cols stack, adjusting to the responsive layout)
    • Go back to the Consumer site and now switch it to 'Template 2' and change the background color to black #000000
    • Click Save
      • VERIFY: the new html is stored in SysAdmin/Configuration/Configurations-Wordpress/clover.global.footer.html
      • Go to Clover and refreshing the page, 
      • VERIFY: the new 'Template 2' footer appears withblack background, with:
        • CONTACT US - displays (email and tel) appearing 33% of the footer.
          • Click the email field and verify the mail application launches
          • from your mobile device, click on the phone link, verify the phone app on your device opens
        • CLOUDVIRGA (company name) appearing 66% of the footer (right side)and under it contains:
          • company address
          • company nmls#
          • (copyright) symbol + [currentYear] All rights reserved. Privacy Policy (link) + Terms of Use (link) + Disclosures (link) + Licensing (link)
            • Verify these links are point to the same destination as Template 1
          • Disclaimer text: "This footer is awesome!"
    • Go back to Loan Center Admin and now switch it to 'Template 3' and change the background color to #9E2339 (Stewart's red)
    • Click Save
      • VERIFY: the new html is stored in SysAdmin/Configuration/Configurations - Wordpress/clover.global.footer.html
      • Go to cPOS and refresh the page 
      • VERIFY: the new 'Template 3' footer appears with #9E2339  background color, with:
        • Left/third  (33%) is displaying
          • 'Company-Level: Brand Display Name 'CLOUDVIRGA' (heading)
          • 'Company-Level: Address'
          • 'Company-Level: NMLS#'
        • Center/third (33%) is displaying
          1. 'CONTACT US' (heading)
          2. [contact-email]
          3. [contact-telephone]
        • Right/third (33%) is displaying
          1. 'LEGAL LINKS' (heading)
          2. Privacy Policy(link)
          3. Terms of Use(link)
          4. Disclosures(link)
          5. Licensing(link)
        • Lower full (100%) contains
          1. <hr> (line)
          2. (copyright) symbol + [currentYear] All rights reserved. 
          3. Disclaimer text goes: "This footer is awesome!"

Acceptance Criteria #3: Styling a Division

A. Retail: 'Cloudvirga' (using the same retail environment)

  1. On the Hierarchy Selector select:
    • Channel: 'Direct'
    • Division: 'Stratosphere Mortgage'
  2. VERIFY: underneath the hiearchy selectors displays 'Stratosphere Mortgage (Division)'
  3. In the Logo subsection, VERIFY it is currently loading "Cloudvirga's logo with the 'Pull Logo From" should be set on 'COMPANY'
  4. Select 'Division'
  5. VERIFY: the 'Stratophere' logo loads to the right of the select field
  6. Add this url path for favicon: https://favicon-public.s3-us-west-1.amazonaws.com/stratosphere/ 
  7. Expand on the Colors subsection
  8. VERIFY: the colors are inheriting parent 'company' level colors:

    LoanCenter Admin (Color) Field Label

    SysAdmin/Configurations/Configurations-Wordpress

    Default Value

    VERIFY:

    Primary Color

    Clover.global.color.primary

    #9E2339

    {existing}

    Secondary Color

    Clover.global.color.secondary

    #0075AA

    {new change}

    Indicator/Badge Color

    Clover.global.color.badge

    #43464A

    {new change}

    Static Text and Icon Colors

    Clover.global.color.static

    #9E2339

    {existing}

    Input Field Text Color

    Clover.global.color.input

    #046492

    {existing}

    Text Link Color

    Clover.global.color.link

    #0075AA

    {new change}

    Background Color

    Clover.global.color.background

    #f2f2f2

    {existing}

    Background Image URL

    Clover.global.background.image

    #f2f2f2

    {existing}
  9. Apply these colors for Stratosphere Mortgage:

    LoanCenter Admin (Color) Field Label

    SysAdmin/Configurations/Configurations-Wordpress

    Default Value

    VERIFY:

    Primary Color

    Clover.global.color.primary

    #046492

    {existing}

    Secondary Color

    Clover.global.color.secondary

    #4f8300

    {new change}

    Indicator/Badge Color

    Clover.global.color.badge

    #4f8300

    {new change}

    Static Text and Icon Colors

    Clover.global.color.static

    #046492

    {existing}

    Input Field Text Color

    Clover.global.color.input

    #046492

    {existing}

    Text Link Color

    Clover.global.color.link

    #0f4880

    {new change}

    Background Color

    Clover.global.color.background

    #f5f5f5

    {existing}

    Background Image URL

    Clover.global.background.image

    #f5f5f5

    {existing}
  10. Expand on the fonts:
    • Change the font name to: Open Sans
    • Change the font url to: https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600 
  11. Expand on the Footers subsection
    • Select Template 1 
    • VERIFY: it is currently inheriting 'Company' level styling and links info.
    • Change the footer background color to #336699;
    • On the Pull Data From field, select 'Division'
    • VERIFY: the data is pulling the division level information from SysAdmin (for Stratosphere)
      • Branding Display Name: "Stratosphere Mortgage" 
      • Different Address
      • Different NMLS#
    • Contact Us fields
      •  Enter a different email address for the field
      • Enter a different telephone number, (you can enter your office/cell phone) just to test if it works once you're testing in Clover.
    • Legal Links
    • Change the Disclaimer text to 'Stratosphere Footer is out of this world!'
  12. Click Save
  13. Go to iMP SysAdmin and log in as an Admin
  14. VERIFY in SysAdmin/Configuration/Configurations-Wordpress/ for:
    • 'Logos' got stored in:
      • clover.logo.header.image
      • clover.logo.menu.image
    • 'Colors' got stored in:
      • clover.global.color.badge
      • clover.global.color.input
      • clover.global.color.link
      • clover.global.color.primary
      • clover.global.color.secondary
      • clover.global.color.static
      • clover.global.background.color
      • clover.global.background.image
    • Fonts got stored in:
      • clover.global.font.family
      • clover.global.font.url
    • Footer html got stored in:
      • clover.global.footer.html 
  15. Go to Clover and type in the vanity url that was created for "Stratosphere Mortgage"
    • VERIFY: the header is display "Stratosphere" logo
    • VERIFY: the color styling as described in (req. #10 above) is loading
    • VERIFY: on the Registration page (below the password fields) when clicking the links for:
    • VERIFY: the footer template is Template 1 with background color #336699
      • VERIFY: the left is displaying 'STRATOSPHERE MORTGAGE" (as the company name)
      • VERIFY: the address is displaying the same one that is from Loan Center or SysAdmin (division-level) for Stratosphere
      • VERIFY: the NMLS# for Stratosphere is loading
        • click on the NMLS#
          • VERIFY: it takes you to the NMLS website
      • VERIFY: the email you created for Stratosphere is displaying
        • click the email link
          • VERIFY: email application (ex: Outlook opens)
      • VERIFY: the telephone you created for Stratosphere is displaying
        • from mobile device, click on the link
        • verify the phone app launches.
      • VERIFY: the legal links point to:
      • VERIFY: the disclaimer text displays 'Stratosphere Footer is out of this world!'
  16. Go to 'Cloudvirga' parent level cPOS URL
    • VERIFY: the header is still the 'Cloudvirga' logo
    • VERIFY: the color scheme is still:

      LoanCenter Admin (Color) Field Label

      SysAdmin/Configurations/Configurations-Wordpress

      Default Value

      VERIFY:

      Primary Color

      Clover.global.color.primary

      #9E2339

      {existing}

      Secondary Color

      Clover.global.color.secondary

      #0075AA

      {new change}

      Indicator/Badge Color

      Clover.global.color.badge

      #43464A

      {new change}

      Static Text and Icon Colors

      Clover.global.color.static

      #9E2339

      {existing}

      Input Field Text Color

      Clover.global.color.input

      #046492

      {existing}

      Text Link Color

      Clover.global.color.link

      #0075AA

      {new change}

      Background Color

      Clover.global.color.background

      #f2f2f2

      {existing}

      Background Image URL

      Clover.global.background.image

      #f2f2f2

      {existing}
    • VERIFY: the Footer 'Template 3' footer appears with  #9E2339 background color, with:
      • Left/third  (33%) is displaying
        • 'Company-Level: Brand Display Name ' CLOUDVIRGA' (heading)
        • 'Company-Level: Address'
        • 'Company-Level: NMLS#'
    • Center/third (33%) is displaying
      • 'CONTACT US' (heading)
      • [contact-email]
      • [contact-telephone]
    • Right/third (33%) is displaying
      • 'LEGAL LINKS' heading
      • Privacy Policy link
      • Terms of Use link
      • Disclosures link
      • Licensing link
    • Lower full (100%) contains
      • <hr> line
      • copyright symbol + [currentYear] All rights reserved 
      • Disclaimer text is 'This footer is awesome!'
  17. Go back to Loan Center Admin
  18. Go back to the Footer section for "Stratosphere"
    • Remove the last 2 legal links (Disclosures and Licensing)
    • VERIFY: those links are removed from the footer.
  19. Click Save
  20. Go to cPOS for "Stratosphere Mortgage"
    • Verify those 2 legal links are removed from the footer
  21. Go to SysAdmin and login as an Admin
  22. VERIFY: the updated foote  in SysAdmin/Configuration/Configurations-Wordpress/ for:
    • Footer html got stored in:
      • clover.global.footer.html 

B. Go to a TPO Environment

  1. Style the business entity division for "Blue Mortgage"
    • on Logo subsection:
      • Pull the Logo from "Division" level for "Blue Mortgage"
    • Use Blue as primary color)
    • add any other color scheme you want for the other color fields
  2. Style the business entity division for "Green Mortgage"
    • Pull the Logo from "Division" level for "Green Mortgage"
    • on Logo (section)
    • (ex Use: Green as primary color)
    • add any other color scheme you want for the other color fields.
  3. Have the Footer for both  Brokerages inherit the Company level information for "ABC Lender"
    • Footer background color for:
      • Blue Mortgage (use blue)
      • Green Mortgage (use green)
    • Company: ABC LENDER
      • Company-level address
      • Company-level NMLS#
    • CONTACT US
      • same company-level email address
      • same company-level support phone#
    • Legal Links
      • same company-level Privacy Policy
      • Same company-level Terms of Use
    • Disclaimer text: 'This is a TPO disclaimer'
  4. Click Save
    • Go to SysAdmin and login as an Admin
    • Verify  in SysAdmin/Configuration/Configurations-Wordpress/ for:
      • 'Logos' got stored in:
        • clover.logo.header.image
        • clover.logo.menu.image
        • clover.favicon.folder
      • 'Colors' got stored in:
        • clover.global.color.badge
        • clover.global.color.input
        • clover.global.color.link
        • clover.global.color.primary
        • clover.global.color.secondary
        • clover.global.color.static
        • clover.global.background.color
        • clover.global.backround.image
      • 'Fonts' got stored in:
        • clover.global.font.family
        • clover.global.font.url
      • Footer html got stored in:
        • clover.global.footer.html 
    • Go to cPOS
    • When loading the clover vanity URL instance for these brokerages:
      • VERIFY: the header represents the logo you have for Blue Mortgage, and Green Mortgage
      • VERIFY: the color schemes reflect what you created for "Blue Mortgage" and "Green Mortgage"
      • VERIFY: the footer content is loading with what you created for "Blue Mortgage" and Green Mortgage"
        • VERIFY: the 'Company-Level" information is ABC LENDER (address + NMLS#)
        • VERIFY: the 'Contact Us' information is the same company-level info
        • VERIFY: the legal links are the same company-level links.
  5. Style a different business entity for "Orange Mortgage"
    • Use orange as the primary color
    • Add any other color scheme you want for the other color fields.
    • Style the business entity division for "Orange Mortgage"
      • On Logo subsection
        • Pull the Logo from "Division" level for "Orange Mortgage"
      • Use orange as the primary color
      • Add any other color scheme you want for the other color fields.
    • Have the footer this time be "Custom HTML"
      • Create your own custom html, for example:
         

        <footer style="background-color:orange; color:#fff; padding: 15px 0;">
        <h4>Orange Mortgage</h4>
        <p>This is custom html</p>

        </footer>
    • Click Save
    • Go to SysAdmin and login as an Admin
    • VERIFY: in SysAdmin/Configuration/Configurations-Wordpress/ for:
      • 'Logos' got stored in:
        • clover.logo.header.image
        • clover.logo.menu.image
        • clover.favicon.folder
      • 'Colors' got stored in:
        •  clover.global.color.badge
        •  clover.global.color.input
        • clover.global.color.link
        • clover.global.color.primary
        • clover.global.color.secondary
        • clover.global.color.static
        • clover.global.background.color
        • clover.global.backround.image
      • 'Fonts' got stored in:
        • clover.global.font.family
        • clover.global.font.url
      • Footer html got stored in:
        • clover.global.footer.html 
      • Go to cPOS and open the vanity URL created for "Orange Mortgage"
        • VERIFY: The header is displaying "Orange Mortgage" (logo)
        • VERIFY: The styling is reflected on the color schemes you created for Orange Mortgage
        • VERIFY: The footer is displaying the custom html footer.

AC4 Styling a Branch

  1. Pick any environment
  2. Style a specific branch differently from it's parent Division or great grand parent Company
  3. If the Branch in SysAdmin already has a logo stored on the branch level
    • On Logo selector select the Branch
    • VERIFY: the logo of that branch displays
  4. On the Colors (create any color scheme you want to use to match with the Branch logo)
  5. On the Fonts you can use the same as parent or select a different one from Google Fonts.
  6. On the Footer
    • Pull information from the "Branch"
    • VERIFY:
      • "Branding Display Name" for the branch displays
      • "The address" of that branch displays
      • "the NMLS" is pulling the divisions.
    • Provide a: 
      • contact email
      • contact telephone
    • On Privacy Policy select the checkbox to use company level
      • VERIFY: The Company privacy policy URL link is inserted in the field
    • On Terms of Use (select the checkbox) use company level
      • VERIFY: The 'Company" Terms of Use url link is inserted in the field
    • Disclaimer Text: Add extra long text with over 500 words. (lorem ipsum)
  7. Click Save
  8. Go to iMP SysAdmin and log in as an Admin
  9. VERIFY that in SysAdmin/Configuration/Configurations-Wordpress/ for:
    • Logos got stored in:
      • clover.logo.header.image
      • clover.logo.menu.image
      • clover.favicon.folder
    • Colors got stored in:
      • clover.global.color.badge
      • clover.global.color.input
      • clover.global.color.link
      • clover.global.color.primary
      • clover.global.color.secondary
      • clover.global.color.static
      • clover.global.background.color
      • clover.global.backround.image
  10. Fonts got stored in:
    • clover.global.font.family
    • clover.global.font.url
  11. Footer HTML got stored in:
    • clover.global.footer.html 
  12. Find the LO who exist under that branch, in the clover url type in the enviornment where this branch exist along with the lsid in the url.
  13. VERIFY: the branding you created for the Branch is loading up on clover
    • Header (with branch logo)
    • Body content with your created color schemes
    • Footer is displaying "Branch Level Info" (address and NMLS# of the division)
      • The contact email and telephone 999999999999999990you provided
      • The Privacy Policy and Terms of Use link (of the company level)
      • The very long disclaimer text with over 500 words

Acceptance Criteria #5: Checking to see if current Retail customer's custom html footer loads up

  1. Go to the lower environments in WordPress of our current retail customers
    • FAM, Fairway, Envoy, Strong Home, Preferred Rate, SunWest, etc
  2. On the left nav go to iMP
    • Make sure on the WP company hierarchy selector you are set on the 'company level'
    • Capture the hex fields that are already set up for these customers
    • Capture the custom html that is already in there
  3. Go login in Loan Center as an Admin for each of these env.
  4. Hierarchy Selector
    • VERIFY: the client environment you are loading is displaying the client company name as the Company dropdown (disabled)
    • VERIFY: the client 'company-level' name is appearing in the <h1>
  5. For Branding and Content (h2 accordion), go to 'UI Styling' (tab)
  6. Logo subsection
    • VERIFY: The 'Use Different" logo is pre-selected
    • VERIFY: The url paths of the logos are in header and menu logo fields
    • VERIFY: The favicon includes a url 
      • Note: some customers may not have this
  7. Colors subsection
    • With all screen captures done for each Retail client (color hex code) captured from WordPress
    • VERIFY: the same color hex values are displaying
  8. Font (section)
    • VERIFY: the same font family and url is pre-populated
  9. Footer (section)
    • VERIFY: the Template selection is set to "Custom HTML"
    • VERIFY: the custom html is already in the text area field

Corresponding Feature #445944

 

Related articles

Comments

0 comments

Please sign in to leave a comment.