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

Why Files with Identical Content (*.js, *.php, *.css) Can Have Different Sizes?

When developers compare files with identical content but notice that their sizes differ, it can be perplexing. Let’s explore why this happens and what factors influence the size of files with extensions like *.js, *.php, and *.css. 1. File Encoding One of the key factors affecting file size is text encoding. The most common encodings…
Read more

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