Request: Beautifiying ‘Home Register’

Hi,

With WP Bakery (formerly Visual Composer) installed you will be able to create a new page or edit the imported Home Register demo like any other page – this can be done via the back-end or the front-end. You can also import any other demo page that we have already built that you like the look of and adjust the content to suit your needs.

From your screenshots the only thing I can see that KLEO does not do out of the box is the inline login form in the menu area.

Kieran

Hi,

1. Redirect on login – please install Peter’s Login Redirect from the WordPress plugin repository by going to WP Admin > Plugins > Add New. Once you have installed this you can go to WP Admin > Settings > Login / Logout Redirects and set a redirect on login to your desired page for the user role ‘Subscriber’.

2. Menu – Please add the below CSS to the WP Bakery per page CSS, you can do this via the cog icon at the top of the editor (see screenshot).

.primary-menu.collapse.navbar-collapse.nav-collapse {display: none !important;}

3. Register shortcode – please hover over the register shortcode, click the pencil icon to edit, in the configuration modal that opens scroll to ‘Show for logged in users too’ and set ‘No’ in the drop down.

Kieran

Hi,

1. It looks like you have set the Home Register page to be the homepage – the page is just visuals there is no other logic behind it so it will show to both logged in and logged out users. Is your site going to be private? If so you can use the below code to redirect users away from BuddyPress pages to Home Register and set your home page to Activity (or whatever page you desire) via WP Admin > Settings > Reading > Static Page.

// Redirect to register if logged out and page is BuddyPress
function kleo_page_template_redirect()
{
    //if not logged in and on a bp page except registration or activation
    if( ! is_user_logged_in() &&
        ( ( ! bp_is_blog_page() && ! bp_is_activation_page() && ! bp_is_register_page() ) )
    )
    {
        wp_redirect( home_url( '/home-register/' ) );
        exit();
    }
}
add_action( 'template_redirect', 'kleo_page_template_redirect' );

In the above example you should update the line where you see /home-register/ to suit the page slug of Home Register if you have edited it to anything other than the default from the demo content.

2. I’m probably going to have to look at the page to see what is going on there. Please share admin access, in a private reply, via this ticket. If you do not wish to share access please make sure the row is set to full height and padding for top and bottom is set to 0.

3. You should add this at the top of the main row before everything else by clicking the plus icon in the middle of the top row. When the modal opens to select an element search for ‘Galaxy Particles’ and set your desired values for this element.

Thanks,

Kieran

Hi,

At the bottom of the page you added a row with a gap element included, this made a gap of 90px in total at the bottom of the page (see screenshot).

I have removed this for you and it now displays as expected

Kieran

Hi,

In that case, as per my earlier reply, I have readded the 30px padding to the top and bottom of the row and it now displays correctly at that screen size.

Kieran

Hi,

That’s great to hear, if you ever need more assistance with anything else feel free to open a new ticket and we’ll be happy to assist.

I didn’t know it meant light/sun in India, in Ireland where this spelling comes from it means dark. It’s a bit of a Yin/Yang thing I guess 🙂

If you haven’t already done so please consider leaving the support received / theme a review on Theme Forest – every review really does help. https://themeforest.net/item/kleo-pro-community-focused-multipurpose-buddypress-theme/reviews/6776630

All the best with your project,

Kieran.

Thanks so much for updating your review, it really does help 🙂 We’re happy to help as always.

Kieran.

Hi,

You can change the color transparency by editing the page, clicking the pencil edit icon for the 3rd row, selecting the design options tab that opens in the modal window and then open the background color picker tool. At the bottom of the bar you will see a percentage slider for alpha (transparency), slide this to a number less than the current 20 for more transparency or a number greater than 20 for less transparency (see screenshot).

With regards to the code above, Peter’s Login Redirect will redirect a user upon login or logout and does not interact with the default home page – therefore you can use both the code and plugin without any conflict. Please make sure to take the code from my reply and not the unformatted pasted version from your above reply.

Thanks,

Kieran