WordPress how to display registration/authorization form in any place on the site?

To display a registration or login form in a custom location on a WordPress site, you can use shortcodes, widgets, or embed the code directly into theme files. Here are some methods:

1. Using a Plugin

The easiest way is to use a plugin such as User Registration, WPForms, or Theme My Login. These plugins provide shortcodes that you can place anywhere on your site.

Example:

[theme-my-login]

2. Displaying Forms Using WordPress Functions

If you prefer not to use plugins, you can leverage WordPress’s built-in functions to display forms.

Login Form

Use the wp_login_form() function to display a login form:

<?php
wp_login_form(array(
    'redirect' => home_url(), // URL to redirect after login
));
?>

To create a shortcode:

function custom_login_form_shortcode() {
    ob_start();
    wp_login_form(array(
        'redirect' => home_url(),
    ));
    return ob_get_clean();
}
add_shortcode('custom_login_form', 'custom_login_form_shortcode');

Insert [custom_login_form] into the WordPress editor.

Registration Form

For a registration form, you can use:

<?php
echo '<form method="post" action="' . esc_url(site_url('wp-login.php?action=register', 'login_post')) . '">';
echo '<p><label for="user_login">Username</label><br>';
echo '<input type="text" name="user_login" id="user_login"></p>';
echo '<p><label for="user_email">Email</label><br>';
echo '<input type="email" name="user_email" id="user_email"></p>';
echo '<p><input type="submit" value="Register"></p>';
echo '</form>';
?>

3. Adding the Form to a Theme File

If you want to place the form in a theme template, add the following code to the desired file (e.g., header.php, page.php, or sidebar.php):

<?php if (!is_user_logged_in()): ?>
    <div class="custom-login-form">
        <?php wp_login_form(); ?>
    </div>
<?php endif; ?>

4. Using Widgets

If your theme supports widgets, you can add the “Meta” widget, but it includes extra links. For a custom display, use a shortcode (as shown above) in a text widget.

5. Styling and Customizing the Forms

You can style the forms with CSS or override default templates for full customization.

Example CSS for wp_login_form:

.custom-login-form form {
    max-width: 300px;
    margin: 0 auto;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #f9f9f9;
}
.custom-login-form input {
    width: 100%;
    margin-bottom: 10px;
    padding: 10px;
}

Choose the method that suits your project best and customize it as needed!

How useful is the publication?

Click on a star to rate it!

Average score 5 / 5. Number of grades: 1

No ratings yet. Rate it first.

Similar posts

How to transfer a site from dle to WordPress?

Transferring a website from DLE (DataLife Engine) to WordPress can be a complex process, especially if the site has a lot of content. Here’s a step-by-step guide: 1. Preparation 2. Export Data from DLE DLE uses its own database structure, so you’ll need to export data and convert it into a format compatible with WordPress:…
Read more