Login and registration in HTML page Hitskin_logo Hitskin.com

This is a Hitskin.com skin preview
Install the skinReturn to the skin page

The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.
4 posters

    Login and registration in HTML page

    Kami-sama
    Kami-sama
    Forumember


    Female Posts : 407
    Reputation : 12
    Language : EN, RU, DE, LT
    Location : Lithuania

    In progress Login and registration in HTML page

    Post by Kami-sama June 19th 2017, 5:43 pm

    Technical Details


    Forum version : #phpBB2
    Position : Founder
    Concerned browser(s) : Google Chrome
    Who the problem concerns : Yourself
    Forum link : ( link is hidden, you must reply to see )

    Description of problem

    Hello!

    Is it possible to have login and registration in HTML page? Not just have links to the current login/registration pages. Basically, an HTML page would be the Home page. It would have 2 options: login or register. Upon option selection you would have the appropriate forms. Only after filling them in you would be brought logged in to the actual forum index.

    Would it be possible just by using available templates?
    I have a feeling this might not be possible... In that case, what is the best way to have on login/ registration pages same styling as in HTML page?

    EDIT: also, upon logout, are you brought to index page or homepage (HTML)?


    Last edited by Kami-sama on June 24th 2017, 2:49 am; edited 1 time in total
    Luiz~
    Luiz~
    New Member


    Male Posts : 17
    Reputation : 9
    Language : PT
    Location : Brazil

    In progress Re: Login and registration in HTML page

    Post by Luiz~ June 19th 2017, 8:53 pm

    Hello,

    It is possible to make the form for the login. The same for logout. However, it is not possible to do to register, since the registration page is unique and can not be replicated / modified too deeply.

    The login form code:
    Code:
    <form action="/login" method="post" name="form_login">
      <div class="form-group">
        <label for="username">Username:</label>
        <input type="text" name="username" id="username" size="25" maxlength="40" />
      </div>
      <div class="form-group">
        <label for="password">Password:</label>
        <input type="password" id="password" name="password" size="25" maxlength="25" />
      </div>
      <div class="form-group">
        <input type="checkbox" name="autologin" id="autologin" checked="checked" />
        <label for="autologin">Auto-login.</label>
      </div>
      <div class="form-group">
        <input type="submit" name="login" id="login" value="Login" />
      </div>
      <div class="text-group">
        <a href="/profile?mode=sendpassword">Password reset.</label>
      </div>
    </form>

    o/
    Kami-sama
    Kami-sama
    Forumember


    Female Posts : 407
    Reputation : 12
    Language : EN, RU, DE, LT
    Location : Lithuania

    In progress Re: Login and registration in HTML page

    Post by Kami-sama June 19th 2017, 8:57 pm

    Oh, that's a great news still Smile)
    I will try this code right away.

    Regarding, register. I think we can change (maybe have in HTML) the register rules?
    And is there a way to change register page style to match headers?
    (I assume that would include some JS, done some modifications this way already)
    I would mainly want to remove announcement/ header/ footer. Basically to end up with HTML background and the form itself and customised buttons.

    EDIT: so the code is working great. Just needed to add this (to enable as homepage):
    Code:
    <a href="https://www.forumlt.com" target="_blank">forumlt.com</a>

    Is there a specific setting for logout redirection?
    I haven't noticed any.
    Kami-sama
    Kami-sama
    Forumember


    Female Posts : 407
    Reputation : 12
    Language : EN, RU, DE, LT
    Location : Lithuania

    In progress Re: Login and registration in HTML page

    Post by Kami-sama June 20th 2017, 7:53 pm

    Okeeey. So in short:

    1) How to redirect unsuccessful login to same login screen? (wrong password, nothing inputed)
    2) How to redirect logout to the default homepage/ loginscreen?
    3) Is it possible to strip registration page from announcements, navigation bar,....
    avatar
    Guest
    Guest


    In progress Re: Login and registration in HTML page

    Post by Guest June 21st 2017, 6:46 pm

    Hi,

    1)After the user submits the data, the page is reloaded. After the reload, you want to be taken back to the initial page or you don't want any redirection at all?
    2)When you logout, you are taken to a page asking you if you're sure. After clicking on yes, you are redirected to a page saying you're logged out. If you want to be taken to the homepage after click on yes, you'll have to add this JS code with placement on all pages:
    Code:
    if(/logout/.test(window.location.search)){
    $("[name='confirm']").click(function(e){
    e.preventDefault();
    var tid=$("[name='tid'").val(), key=$("[name='key']").val();
    window.location="/login?logout=1&tid="+tid+"&key="+key;
    });
    };
    3.I don't really understand this one.
    Kami-sama
    Kami-sama
    Forumember


    Female Posts : 407
    Reputation : 12
    Language : EN, RU, DE, LT
    Location : Lithuania

    In progress Re: Login and registration in HTML page

    Post by Kami-sama June 21st 2017, 7:00 pm

    Hey. Thank you or the reply!

    1) Well with the login there are couple outcomes:
    - login successful (working perfect now)
    - login unsuccessful -> message about wrong details -> 2 options given - link to main page and link to page "help.forumotions.com/login"

    In this case I think "/login" page should always redirect to the main page or the HTML login page. I think this could be done with simple if - checking what is current page, if yes, loading desired page.... OR even better outcome would be, to show the error message in the same HTML login page. I think that's not possible...

    2) What about the logout option in the nav bar? Will the code work using logout option from there? Also, maybe you could put comments in the code... I don't understand it fully -.-

    3) Basically, is it possible to disable annauncement, navigation bar, ... on some desired pages? I assume by using some JS that applies "display:none;".

    4) Is there and IF to check if the user is logged in. Example:
    - IF webpage = desiredwebpage
    - - then IF user isNOT LOGEDIN
    - - - DO redirect page
    - - ELSE do nothing
    avatar
    Guest
    Guest


    In progress Re: Login and registration in HTML page

    Post by Guest June 21st 2017, 7:23 pm

    Hi,

    I made a mistake in the code about the second issue:
    Code:

    $(function(){ /*Wait for the page to become fully loaded*/
    if(/logout/.test(window.location.search)){ /*If the string logout is present in the page link*/
    $("[name='confirm']").click(function(e){ /*When user clicks on yes*/
    e.preventDefault();/*Prevent the default action(sending the user to the page saying successfull logout*/
    var tid=$("[name='tid'").val(), key=$("[name='key']").val();/*Get data that has to be send to the server*/
    window.location="/login?logout=1&tid="+tid+"&key="+key;/*Go to the page that automatically logs you out and sends you to the first page*/
    });/*Close the click event function*/
    };/*Close the if*/
    })/*Close the main function*/

    About the first issue:
    Code:

    $(function(){
    if(/login/.test(window.location.pathname) && $("a:contains('Click here to try again')").length){
    var link_page="link";
    $("a:contains('Click here to try again')").attr("href", link_page);
    };
    })
    In
    Code:
    var link_page="link";
    replace link(the second appearance) with the link of your custom login page.

    The third issue:
    Code:
    $(function(){
    var pages=["page1", "page2"];
    var elements=["elem1", "elem2"];
    var len1=pages.length, len2=elements.length, j=0;
    for(var i=0;i<len1;i++){
    if(window.location.pathname==pages[i]){
    j=1;
    break;
    };
    };
    if(j){
    for(var i=0;i<len2;i++){
    $(elements[i]).hide();
    }
    };
    })
    Edit the array pages so that it contains the pages where you want the elements to be removed. Edit the elements array so that it contains the selectors of the elements.

    4.To check if the user is logged in:
    Code:
    if(_userdata.session_logged_in){
    /*The user is logged in*/
    } else {
    /*The user is logged out*/
    }
    To check if you are on a specific page:
    Code:
    if(window.location.pathname=="url"){
    /*The user is on the page*/
    } else {
    /*The user is not on the page*/
    }

    I haven't tested any of the codes, so if there are any issues with them, let me know.
    Kami-sama
    Kami-sama
    Forumember


    Female Posts : 407
    Reputation : 12
    Language : EN, RU, DE, LT
    Location : Lithuania

    In progress Re: Login and registration in HTML page

    Post by Kami-sama June 21st 2017, 7:26 pm

    Oh thanks, some of these parts I have used before. I will test later on and will let you know Wink
    avatar
    Guest
    Guest


    In progress Re: Login and registration in HTML page

    Post by Guest June 21st 2017, 7:31 pm

    You're welcomed. Good luck! Smile
    Kami-sama
    Kami-sama
    Forumember


    Female Posts : 407
    Reputation : 12
    Language : EN, RU, DE, LT
    Location : Lithuania

    In progress Re: Login and registration in HTML page

    Post by Kami-sama June 21st 2017, 10:47 pm

    (may I just say.... this was a B*******h to test Very Happy each time login, logout, login,.... god XD)

    1) All good. I now get what you did. Tho had to replace text, as my forum is not in english Wink

    2) Couple more questions about the code (I am eager to learn)
    "/*Get data that has to be send to the server*/" - so sending to server time of logout, or that user has logged out?
    Code:
    window.location="/login?logout=1&tid="+tid+"&key="+key;
    where should I specify the correct end location? (HTML main page/login page). Not sure tbh.

    3) This was is not responding for me... Maybe I am adding elements wrong?
    Code:
    var elements=["#fa_toolbar", ".mainmenu", "#fa_ticker_block"];
    Previously I used
    Code:
    document.URL.indexOf
    (that worked for me with URLs)
    EDIT: mainmenu seam to have disappeared after I changed
    Code:
    if(document.URL.indexOf(pages[i]) >= 0){
    so I guess using IDs is an issue now...

    4) Same issue like in 3rd problem. BUT. After replacing
    Code:
    window.location.pathname
    with
    Code:
    document.URL.indexOf
    it seamed to work
    avatar
    Guest
    Guest


    In progress Re: Login and registration in HTML page

    Post by Guest June 22nd 2017, 5:03 am

    2)There is a page on every forum that automatically logs you out and than sends you back to the main page. If you want to be send to the login page, I can make a code for that too.

    3)I'll look into the code and update that post latter. window.location.pathname or location.pathname is just a part of the link(example:/login?logout here login is the pathname and ?logout is the search)

    4.I explained location.pathname at 3
    Kami-sama
    Kami-sama
    Forumember


    Female Posts : 407
    Reputation : 12
    Language : EN, RU, DE, LT
    Location : Lithuania

    In progress Re: Login and registration in HTML page

    Post by Kami-sama June 22nd 2017, 12:32 pm

    2) well that is what I needed Very Happy after pressing logout button user should be redirected to HTML login page ;D

    3) Okey, let me know how it goes. I will test it a bit as well

    EDIT: I found what was the issue with items removed for guests. There were some missing ; for
    Code:
    $(function(){
    Smile
    avatar
    Guest
    Guest


    In progress Re: Login and registration in HTML page

    Post by Guest June 22nd 2017, 2:30 pm

    2)
    Code:
    $(function() { /*Wait for the page to become fully loaded*/
        if (/logout/.test(window.location.search)) { /*If the string logout is present in the page link*/
            var sending = 0; /*No request sent to the server*/
            $("[name='confirm']").click(function(e) { /*When user clicks on yes*/
                if (sending) return; /*If request has already been sent, don't do anything*/
                sending = 1; /*Update the variable so that we know the request has already been sent*/
                e.preventDefault(); /*Prevent the default action(sending the user to the page saying successfull logout*/
                var tid = $("[name='tid'").val(),
                    key = $("[name='key']").val(); /*Get data that has to be send to the server*/
                $.post("/login?logout=1&tid=" + tid + "&key=" + key, function(data) { /*Send a request to the server to log you out*/
                    window.location = "link"; /*Redirect you to the page after the request finishes*/
                });
            }); /*Close the click event function*/
        }; /*Close the if*/
    }) /*Close the main function*/

    You managed to solve 3 yourself?
    Kami-sama
    Kami-sama
    Forumember


    Female Posts : 407
    Reputation : 12
    Language : EN, RU, DE, LT
    Location : Lithuania

    In progress Re: Login and registration in HTML page

    Post by Kami-sama June 22nd 2017, 2:56 pm

    Oh, amazing, that did the trick!
    I will test everything now to see if anything else needs to be adjusted.
    So far looks great. I will mark the issue SOLVED when I complete testing Wink

    P.S. Yes I solved that one myself. Some clauses were missing and etc Wink
    avatar
    Guest
    Guest


    In progress Re: Login and registration in HTML page

    Post by Guest June 22nd 2017, 2:57 pm

    Ok, glad I could help you Smile
    brandon_g
    brandon_g
    Manager
    Manager


    Male Posts : 10112
    Reputation : 923
    Language : English
    Location : USA

    In progress Re: Login and registration in HTML page

    Post by brandon_g June 22nd 2017, 3:50 pm

    Hello,

    Is this solved?

    -Brandon



    Login and registration in HTML page Brando10
    Remember to mark your topic Login and registration in HTML page Solved15 when a solution is found.
    General Rules | Tips & Tricks | FAQ | Forgot Founder Password?

    Login and registration in HTML page Scre1476
    Team Leader
    Review Section Rules | Request A Review | Sticker Points
    Kami-sama
    Kami-sama
    Forumember


    Female Posts : 407
    Reputation : 12
    Language : EN, RU, DE, LT
    Location : Lithuania

    In progress Re: Login and registration in HTML page

    Post by Kami-sama June 22nd 2017, 4:15 pm

    I will let you know Wink
    Still testing every link, page and etc
    Ape
    Ape
    Administrator
    Administrator


    Male Posts : 19218
    Reputation : 1999
    Language : fluent in dork / mumbojumbo & English haha

    In progress Re: Login and registration in HTML page

    Post by Ape June 24th 2017, 1:20 pm

    I have reset your thread as in progress so staff don't move this
    Please only mark as solved if you are 100% sure it is solved.



    Login and registration in HTML page Left1212Login and registration in HTML page Center11Login and registration in HTML page Right112
    Login and registration in HTML page Ape_b110
    Login and registration in HTML page Ape1010