• Resolved Jessica

    (@thejessicapage)


    I am trying to figure out how to do the following:
    Either be able to add text to the WP-Login Page above and below the logo,
    Or
    Create a custom login page that will be used instead of the default login page.

    I have been looking for tutorials on how to do this and I have not found exactly what I am looking for. The wordpress codex seems to allude to how to create a custom login page but I am a little confused by it.

    Can anyone help me figure this out?

    Thanks in advance for your time.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator t-p

    (@t-p)

    Thread Starter Jessica

    (@thejessicapage)

    Hi Tara, I appreciate the response but that does not actually help me. I mentioned that I had tried the codex and was not able to do what I wanted. As I did not give the link I can see why you would have included it in case.

    I was looking for a tutorial that would explain the process.

    I do not want to use a plugin, I want to learn how to do it myself.

    Again, thank you for taking the time to respond.

    Moderator bcworkz

    (@bcworkz)

    I’m sorry I don’t know of any tutorials, it’d be much easier than writing what follows!

    Even if you don’t want to use an established plugin, you can learn much by seeing how other coders do things. It may be worth taking a look at the source code of Tara’s linked plugins.

    As it happens, adding text below the logo is fairly simple. You just need to hook the ‘login_message’ filter and return what ever HTML you want displayed, it is immediately echoed out by the filter. My hook reference is targeted for writing a plugin, but it also applies to customizing your theme as well. For themes, the code would go in functions.php.

    To protect your theme customizations, create a child theme. For that matter, Writing a Plugin isn’t necessarily any more difficult. However, if you end up with a custom login page, which involves a custom page template, stick with a child theme. Custom page templates in a plugin get sort of complicated.

    As easy as adding text below the logo is, adding it above in the proper “clean” manner through a filter is impossible. Inserting it after the page loads with javascript or jQuery is always a possibility, but can be problematic if the user has javascript disabled. The inserted text also tends to load a split second after everything else, which many find unacceptable.

    If text above the logo is really that important, and jQuery is unacceptable, you will need to create a custom login page. The Codex section on this could definitely be improved. What it is suggesting is you create a custom page template to act as the login page. The template must include a call to wp_login_form(). You can add any code and HTML above and below this. The same filters available within the form are available as they are on wp-login.php.

    Once the template is created, create a page based on this template the same as you would create any other WP page. You do not need to add any content on the page edit screen, the purpose here is merely to assign a slug to the page so we can link to it.

    One glaring omission is how to get your custom page used in place of the default. I’ve not done this myself, so I may be missing something, but I would add a rewrite rule to .htaccess to route all requests for wp-login.php to my custom page.

    Hopefully that’s enough to get you started. If you get stuck somewhere or something just doesn’t make sense, feel free to come back here and ask. Good luck!

    Thread Starter Jessica

    (@thejessicapage)

    Bcworkz,
    You are fabulous. Thank you so much for taking the time to help me. This is great info and I am going to work on it today. I will take a look at the plugins that Tara listed as well to get a feel for how they work.

    Again, Thank you. Truly appreciated!
    ??

    Jessica

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘How To Replace The WP-Amin Login Page With A Custom Login Page’ is closed to new replies.