Compatibility:

WebSite X5 Evo and Pro


As you know, with WebSite X5 you can set up some pages of your website- all the ones you want- so that they can be visited by users who have registered and who have access to the necessary login credentials (more information on How to create a members' area and define access to it).


If you  set up a locked section of your project, you may want to add a login/logout field directly on the template header. That's precisely what you can do by using the Login & Logout optional Object. Check out some examples on our Preview page.


How to set up the Login & Logout Object

As we said, the best solution is usually to add the Login & Logout Object directly on the Template Header rather than use it as a  page content: in this way, in fact, your users will be able to log in on any page of your website.


If you want to proceed in this way, you need to:

  • Go to Step 2 - Template Settings and click on Template Content.
  • Use the editor available in the Header section to add the Login & Logout Optional Object in the wished position of the template header.
  • Open the Object Login & Logout  settings window by double-clicking on it.
  • First decide what you want to display. The following options are available in the Display menu:
    • Show Login, if not connected show Logout: the Login field will be displayed and, after the access, it will be substituted with the Logout one.
    • Show Login only, if connected hide Login:  only the Login field will be displayed and, after the access, it will disappear without showing the Logout button.
    • Show Logout only, if not connected hide Logout: only the Logout button will be displayed, which will then disappear after disconnecting without being substituted by the Login button. 
  • Now you can define all the settings for the fields and buttons. If you selected the Show Login, if not connected show Logout option, you can use the Element menu to select whether you want to work on the Login or on the Logout. If, on the other hand, you selected one of the other 2 options, you will only find the specific settings for the element you want to make available. 
  • As far as the Login is concerned, you have access to the following Settings:
    • Layout: you decide whether the Username and Password filed will be displayed on the same row (the one next to the other) or column (the one under the other).
    • Username, Password, Button: you can report the labels for the fields the user will use to report his or her Username and Password, as well as the text for the Login button.
  • As far as the Logout is concerned, you can have access to the following Settings:
    • Introduction:  you can write down a text which tells the users they have logged in. For instance, you could write "Welcome" and then use the User option in order for the user's name to be displayed afterwards. Such text will be displayed before the Logout button.
    • User: you can choose which user's data you want to display after the introductory text. The possible options are Name, Surname, Name and Surname, E-mail
    • Button: the label for the Logout button.
  • As far as the graphic style goes, you can use the usual options to define:
    • the texts Style
    • the texts, fields and buttons Colors
    • the elements Margins
    • the fields and buttons Borders
  • Click OK when you are happy with the result.


Do you want to use this Object on your website pages? Install Login & Logout now: it's free.