1. Links (<a> tag)

There are a number of data attribute options which define link types. Each link type can use additional data attributes to further define how the link will operate.

  • Valid services match those listed in framework settings for ‘services’

Examples:
 <a href="#" data-ae-register-window="true" data-ae-return="http://asite.com/handler">REGISTER</a>
 <a href="#" data-ae-login-window="true" data-ae-return="
http://asite.com/handler">LOGIN</a><br/><br/>
 <a href="#" data-ae-login-link="facebook">facebook login</a>
 <a href="#" data-ae-login-link="twitter">twitter login</a>
 <a href="#" data-ae-register-link="twitter">twitter register</a>
 <a href="#" data-ae-logout-link="true">LOGOUT</a>

2. Custom Forms (<form> tag)

Data attributes can also be applied to on page forms in order to create custom data capture flows outside of the built-in framework.

3. Optional Additional Information (<div> tag)

Data attributes can be used to specify additional information that should be injected into the authentication flow.

Additional information can also be set programmatically via the aeJS.settings property ‘extra_info’. Additional information consists of a title (<h3> tag) and associated content (<div> tag).

Example:
 <div data-ae-extra-info="global" data-ae-extra-info-position="top" style="visibility:hidden;">
 <h3>GLOBAL TITLE TOP</h3>
 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 <img src="<insert image>" width=300 align="left" hspace=10 > Sed justo risus, tristique at bibendum vitae, vulputate at nibh. Donec eget nunc ac quam pellente.</div>
 </div>

Did this answer your question?