App Footer

Example


<vega-app-footer
  term-of-use-label="Terms of use"
  term-of-use-url-target="_blank"
  privacy-policy-label="Privacy Policy"
  privacy-policy-url-target="_blank"

></vega-app-footer>

document.querySelector('vega-app-footer').additionalLinks = [{
                label: 'Another Link',
                URL: 'https://google.com',
            }];

Usage

The vega-app-footer component is used at the bottom of all Heartland pages, and is used to show terms of service and a link to the privacy policy. On pages where there is a need to use an alternate links, such as for the Google reCAPTCHA element, there is the option to include a link to Google’s privacy policy and terms of service.

Properties

Name Description Default
content The content of app footer. Note: The year shows the current year.
string
© 2023 Heartland Payment Systems, LLC – a Global Payments company. All rights reserved.
term-of-use-label This contains the terms of use label.
string
Terms of Use
term-of-use-url This contains the terms of use URL.
string
https://www.heartland.us/terms
term-of-use-url-target Indicates whether to open TOS link in current or a new page or tab. Can be set as _self or _blank. _self
privacy-policy-label This contains the privacy label.
string
Privacy Policy
privacy-policy-url This contains the privacy URL.
string
https://www.heartland.us/privacy-policy
privacy-policy-url-target Indicates whether to open privacy policy link in current or a new page or tab. Can be set as _self or _blank. _self
hide-default-links Hides the default terms of use and privacy policy links
boolean
false
additionalLinks The additional links of app footer.
{label: string, URL: string}[]
[]
show-disclaimer This indicates whether show disclaimer.
boolean
false
disclaimer-url-target Indicates whether to open disclaimer link in current or a new page or tab. Can be set as _self or _blank. _self

Accessibility

  • Elements must have sufficient color contrast
  • id attribute value must be unique
  • Links must have discernible text