Automatic Website Login

This function allows you to display a website content that is behind a login. You can thus use it for the login on a website.

For each relevant playlist element (see in chapter → Add Link/Website/Stream ) you only need to set up the automatic website login once.

Note:

This function depends on the structure and programming of the website being used. A successful login can therefore not be guaranteed. Due to subsequent changes to the website, a login that has already been successfully used may no longer be possible.

  I. Go to Website

 II. Copy CSS Selectors

III. Setup in Account

I. Go to Website

Open your browser and access the login page of your desired website.

Note:

This example uses the Chrome browser and the URL of the  Cloud Software login page. This URL is used to illustrate the following description. Please enter the URL of your desired web page in the search bar of the browser.

II. Copy CSS Selectors

Open Developer Tools

Press the  → F12 key (Chrome) to open the Developer Tools.

Then make sure that the Elements tab in the Developer Tools section is open.

Select CSS Selectors for the Login Input Field

Click the arrow icon →  at the top left of the Developer Tools area and then move the mouse directly to the login input field.

This selects the appropriate text section with the desired CSS selectors.

Highlight Text Section

Click in the Login input field.

This highlights the corresponding text section with the desired CSS selectors.

Copy Text Section

  1. Right-click on the selected text section.

    This opens the context menu.

  2. Then go to the menu item → Copy and select the menu item → copy selector in the submenu.

In the example, the clipboard contains the following: #loginInput

Please copy the text sections and thus the corresponding CSS selectors for the password and the login button in the same procedure as described above.

Password Field

In the example, the clipboard contains the followiing: #passwordinput

Login Button​

In the example, the clipboard contains the following: .form-signin-btn

Setup

  1. Log in to your Cloud Software account with your credentials.
  2. Select the playlist that contains the playlist element as a placeholder for the desired website.
  3. Select the playlist element to open the corresponding settings.
  4. Click on the → plus symbol in the URL input window to open the Automatic Login area.

Automatic Login Area​

Click in the preceding box in the Automatic Login area to activate it for an input. 

Pasting the Copied CSS Selectors

  1. Enter the username of your website login in the provided field.
  2. Now paste the copied CSS selectors for the username (in the example the login input field = #loginInput) into the adjacent field.
  3. Enter your password for the concerned website in the provided field.
  4. Then paste the copied CSS selectors for the password (in the example the password field = #passwordinput) into the adjacent field.
  5. Now paste the copied CSS selectors for the login button (in the example = .form-signin-btn) into the right input field at Submit Button.
  6. When you have finished your entries, click → Save.

If required, click → Preview to check the result of your entries.