Working with Shortcodes in Splash Pages

A shortcode is a small portion of a text and it is a part of a larger set of programming code that can be used in splash pages. Shortcodes are designed to be re-useable and add functionality, such as linking different areas of a program together.

Click  to view shortcodes.

There are common shortcodes for Pre-Login Page & Post-Login Page, and also there are some unique shortcodes for each page.

More details about each shortcode can be viewed by click on the  icon of each shortcode.

Pre-Login Splash Page Settings

1. Forms

a. Registration Form

Registration Form shortcode which can be used in a Pre-Login page, allows new guests to create their accounts in the Starling Wi-Fi system. There are some attributes of the Registration Form.

• Register-Text: Use to assign a different label for the Register button such as “Connect” or “Accept Terms & Conditions”
• Mask-Phone: Allows to mask mobile number
• Phone-Country-Code-Text: Use to define the country code

[[RegistrationForm register-text='Registration’ mask-phone=“(###) ### ## ##” phone-country-code-text=“+1”]]

1. Login Form

Login Forms shortcode can be used to log into the Starling system directly without going through the registration process. This will be applicable for users who have vouchers, or users who have already registered with the system. There are some attributes of the Registration Form.

• Login-Text: Use to assign a different label for the Register button such as “Connect” or “Accept Terms & Conditions”
• Mask-Phone: Allows to mask mobile number
• Phone-Country-Code-Text: Use to define the country code

[[LoginForm login-text='Connect’ mask-phone=“(2##) ### ## ##” phone-country-code-text=“+1”]]

Add Registration or Login Form

To add a Form in the HTML tab, take the cursor to the place where Form needs to be added, and click on the Registration Form or Login Form from the list of shortcodes located on the right-hand side of the page. After adding the Form to the splash page, it can be customized through the Form’s options. Click on the  icon to get the Form’s options and enable the necessary fields that are required for registration or login then click on close. Click on the “Save” button to save the changes to the splash page.

Registration form settings:

The fields can be “Required”, “Enabled”, or both. Select "Enabled" to make the field visible on the form and select "Required" to make the field required to get the post-login. The locations of the fields can be changed using the button on the left.

Custom field titles can be typed in multiple languages. These languages can be selected from Settings > System Settings > Advanced > Locales > Enabled Languages. After that, they can be customized at the “Registration Fields” section.

Login form settings:

2. Authentication Links

Authentication Links are available as a shortcode to set up social logins on the splash page. To add the social login link, take the cursor to the place where the link needs to be added and click on the required shortcode from the list of Authentication Links located on the right-hand side of the page.

3. Authentication Attributes

Authentication Attributes shortcodes are to embed an HTML data attribute to allow guests to authenticate on to your Wi-Fi via social login links. These should be embedded as an inline attribute within an existing HTML element in your HTML.

4. Language

There are two shortcodes under language: Language Selector and Current Language. A Language Selector shortcode can be used to select the language of the splash page.

The Current Language shortcode displays the selected language which could be required for the splash page design purpose.

To add the Language shortcode, take the cursor to the place where a shortcode needs to be added and click on the required shortcode from the list of shortcodes located on the right-hand side of the page.

5. Images

Image shortcodes can be used to insert images into the splash page. Images can be inserted as an Image Segment or as an Image URL.

When adding the image using an image segment, a shortcode should not be inserted within any HTML segments. Take the cursor to the place where the image needs to be inserted and click on the Image Segment from the list of shortcodes located on the right-hand side of the page.

After clicking on the Image Segment, the “Insert Media” window will pop up. It can also be accessed by clicking on  button. After that, click “Upload Files” button to upload the files from your local to the system.

Select the image after uploading it and click the “Insert Image Tag”.

Image URL also can be added using the same method, but it should be inserted within <img> segments.

Click “Create Folder” to create a media folder to collect the required media under a folder.

6. Misc

a. Terms and Conditions Text

A Terms and Conditions Text shortcode can be used to display the terms and condition text defined in the venue where Splash Page will be associated. To add the Terms and Conditions Text, take the cursor to the place where the Terms and Conditions Text need to be added, and click on the Terms and Conditions Text located on the right-hand side of the page. 

b. Error Messages

An Error Message shortcode can be used to display an error message if the connection is not successful. To add the Error Messages, take the cursor to the place where Error Message needs to be added, and click on the Error Message located on the right-hand side of the page. 

c. Splash Ads

A Splash Ads shortcode can be used to add built splash ads on the splash page. To add the splash ads, take the cursor to the place where splash ads need to be added and click on the Splash Ads located on the right-hand side of the page. Pop up window will appear to select the splash ad that needs to be added. Select the splash ad segment from the list, and click on the “Add” button to add the splash ad.

d. Mini Survey

A Mini Survey shortcode can be used to add built mini surveys on the splash page. To add the mini survey, take the cursor to the place where mini surveys need to be added and click on the mini surveys located on the right-hand side of the page. 

e. Service Profile Selector

A Service Profile Selector is to select the service profile to be added to the splash page. To select the Service Profile, click on the “Service Profile Selector” button. This shortcode can be used to add a Service Profile on the splash page. To add the service profile, take the cursor to the place where the service profile needs to be added and click on the service profile located on the right-hand side of the page. Pop up window will appear to select the service profile(s) that needs to be added. Select the service profile(s) from the list, and click on the “Add” button to add the service profile.

Post-Login Splash Page Settings

1. Online

In the Online section, there is a Countdown Timer shortcode. Countdown Timer shortcode embeds an HTML block indicating the remaining time that a guest has on their current Wi-Fi session.

2. Language

The Language section is the same as in the Pre-Login Splash Page Settings.

3. Image

The Image section is the same as in the Pre-Login Splash Page Settings.

4. Misc

a. Guest Name

A Guest Nameshortcodecan be used to display the name of the guest. It will display the same name that the guest used to register to the Starling Guest Wi-Fi system. To add the Guest Name shortcode, take the cursor to the place where the Guest Name shortcode needs to be added and click on the required shortcode from the menu located on the right-hand side of the page.

b. Disconnect Link

A Disconnect Link shortcode can be used to add built a disconnect link on the splash page. To add the disconnect link, take the cursor to the place where disconnect link need to be added and click on the Disconnect Link located on the right-hand side of the page.

c. Splash Ads

The Splash Ads section is the same as in the Pre-Login Splash Page Settings.

d. Receive Marketing Checkbox

A Receive Marketing Checkbox shortcode can be used to add built a receive marketing checkbox on the splash page. To add the checkbox, take the cursor to the place where disconnect link need to be added and click on the Receive Marketing Checkbox located on the right-hand side of the page.

e. Profile Link

A Profile Link shortcode can be used to add built a profile link on the splash page. To add the profile link, take the cursor to the place where profile link needs to be added and click on the Profile Link located on the right-hand side of the page.