wordpresswoocommerceelementor

WooCommerce Login/Register + Dashboard Wordpress 6.5

I have a question what seems to be not found anywhere.

In my header I have added "Login". I use Woocommerce for my webshop.

Header "Login"

If I press it I go to the dashboard (because i'm logged in to wordpress ofcourse).

Dashboard

But when i'm logged out my page looks like this.

enter image description here

As known this login/register page is messed up and needs to be added. But I can't find this page anywhere because i'm logged out and I can't add find it in "all pages" nor added it with Elementor.

How can I change this page?

I know there are plugins like "Profile Builder, etc.." that can make login / register buttons but the main thing is I want to have a consumer do the next.

1. Press "login" button

2. Brings the consumer to the login/register page

3. When the client has logged in or have made an account he will be directed to the dashboard.

4. When he is logged in and presses the "login" button he goes still to the dashboard till he logs out there.

Extra:

If possible and someone can help me with changing "Login" to "Login/Register" when client has done this the button changes aswell to the name "Account" or something untill he logs out.

Thank you for the help

Solution

  • Change your form-login.php page in the backend (Cpanel) File Manager. You can added your styles there easily if you know what you want. I have unfortuantly not found a solution in the frontend with use of Wordpress / Elementor for this issue.

    enter image description here

    Answer on "EXTRA"

    Make a shortcode:

    function custom_login_status() {
    if (is_user_logged_in()) {
        $user = wp_get_current_user();
        $account_url = wc_get_page_permalink('myaccount');
        return '<a href="' . esc_url($account_url) . '" class="custom-login-status"><i class="fas fa-user"></i> <span>Account (' . esc_html($user->display_name) . ')</span></a>';
    } else {
        $login_url = wc_get_page_permalink('myaccount');
        return '<a href="' . esc_url($login_url) . '" class="custom-login-status"><i class="fas fa-sign-in-alt"></i> <span>Inloggen</span></a>';
    }
}
add_shortcode('inlog_status', 'custom_login_status');

function custom_login_status_css() {
    echo '
    <style>
        .custom-login-status {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-decoration: none;
            color: #ffffff;
            font-family: "Poppins", sans-serif;
            font-weight: 600;
            font-size: 0.9rem;
        }
        .custom-login-status i {
            font-size: 24px;
            color: #ffffff;
        }
        .custom-login-status span {
            margin-top: 4px;
        }
        .custom-login-status:hover {
            color: #ffffff;
        }
        .custom-login-status:hover i {
            color: #ffffff;
        }
        .custom-login-status:active {
            color: #ffffff;
        }
        .custom-login-status:active i {
            color: #ffffff;
        }
        .custom-login-status:focus {
            color: #ffffff;
        }
        .custom-login-status:focus i {
            color: #ffffff;
        }
    </style>
    ';
}
add_action('wp_head', 'custom_login_status_css');