We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 15001
    • 697 Posts
    Which the best technique to run WebloginPE in "sidebar mode" with custom texts on buttons?

    I tried using the taconite mode. I also tried specifying a custom Javascript with the &customJs parameter. I found both techniques difficult to use. Especially, I encountered difficulties in personalizing example.js to use my own templates.

    At the end, the easiest way I found to display the login form and a custom ’successful-login’ form on the same page is to use WebloginPE the classic way (i.e. without taconite nor customJs) and to specify custom forms with the &loginFormTpl and &successTpl parameters.

    [[WebLoginPE? &type=`simple` &lang=`fr` &tableCheck=`0`&customTable=`the_extended_attrs` &profileHomeId=`30` &loginFormTpl=`assets/snippets/webloginpe/forms/login_form.fr.tpl` &successTpl=`assets/snippets/webloginpe/forms/success_form.fr.tpl` ]]

    One difficulty is to display custom texts on buttons.
    My trick pass the "service" parameter to the snippet is to dynamically set a hidden field.
    Here’s an example for a custom "Succesful Login" template which displays customized "Profile" and "Logout" buttons :
    <form id="wlpeUserForm" action="[~[*id*]~]" method="POST">
    <div id="wlpeUserButtons">
    <input type="button" id="wlpeProfileButton" value="Profil" onclick="document.getElementById('wlpeWhatToDoButton').value='profile';document.forms[0].submit();" /> 
    <input type="button" id="wlpeLogoutButton" value="Déconnexion" onclick="document.getElementById('wlpeWhatToDoButton').value='logout';document.forms[0].submit();" /><br />
    <input type="hidden" id="wlpeWhatToDoButton" name="service" value="" />

    This works fine, but requires Javascript to be enabled.
    Also, it does not allow displaying error messages like a &customJs script would permit.

    What is your favorite way to run WebLoginPE in sidebar mode?
      • 15001
      • 697 Posts
      Using the button tag instead of the input tag makes possible to set the text displayed by the button to something else than the "value" attribute:

      <button type="submit" id="wlpeLoginButton" name="service" value="login" >Connexion</button>