Get Login button to fire modal window

[gm713]

Hi,

If I create a button/link for login, how do I trigger a modal window instead of directing the user to the login page?

[loraehmke]

I’m also having this problem. Please let me know what you find out.

[Catalin]

Hello,

Please take a look in this file:

..\kleo\page-parts\general-popups.php

to see the template of the modal.

To add a link that opens the modal you need to create a link tag and add “bp-menu bp-login-nav” class or “bp-menu bp-register-nav” class to its structure.

like

COPY CODE

<a href="#"></a>

Thank you,
Catalin

Thank you,
Catalin

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[loraehmke]

I can replicate the pop-up by adding it as a link in a page, but I’m unclear how to do this in the top menu navbar?

[gm713]

Hi Caitlin,

I’m sorry, I don’t quite follow. Attached are the screenshot of how I’m defining a button. Should I be doing something differently?

Attachments:

You must be logged in to view attached files.

[gm713]

@loraehmke how did you get it to work. Do you mind pasting the code here?

[gm713]

@loraehmke to answer your question, go to Appearance>Menu and under “select a menu to edit” pull up your top menu. Once loaded, find login and register links under “BuddyPress” options on the left and add to menu, and you should be all set.

PS: if you don’t see BuddyPress on the left, scroll all the way up to the top of the page, and click on “Screen Options” to reveal options and select “BuddyPress”.

Hope that helps!

[loraehmke]

Thanks, @gm713. I have no issues adding the Login and Register links to the top menu. However, my issue is that they don’t really work because by the time users get to the home page, they are already “logged in.” Currently, when users type in my site home page URL, they go to the standard wordpress login page (see attachment) instead of the front end of my home page. My preference would be to have users go directly to the home page (not the wordpress login page). Once there, users could select either Login or Register and a pop-up modal window would appear. Does that make sense?

For your issue, I’m not sure how to make it as a Button, but you can do it as a link. Then maybe you could style the link to look like a button? Here is what I did:

1. Create a Text Block (or put it in one of your current text blocks).
2. Within, text block, switch to Text View and add this code: log in. Then, in the “Extra Class Name field” add this code: bp-menu bp-login-nav (see screenshot)

On a side note, there’s gotta be a way to do this as a button. But I can’t figure it out either.

Attachments:

You must be logged in to view attached files.

[gm713]

@loraehmke Thanks for your inputs. For your issue, it’s simply a matter of setting the website landing page to your home page.

Go to Settings>Reading option and then set Static page Front Page to desired page. Screenshot attached for your reference.

PS: The screen grab colors look slightly different since it’s not taken from the Kleo template but a different site. From a functionality/settings point of view, it should be no different.

Attachments:

You must be logged in to view attached files.

[loraehmke]

@gm713 thanks. Unfortunately, I already had it set to a Static page – Front page with my home page selected. That’s why I’m so confused. When I’m logged out of the site, I always go to the login page instead of the home page. There must be something else I’m missing.

[Catalin]

Hello,

@loraehmke: do you have any redirect plugin installed?

Please send me admin credential to your website to take a look. Reply as private for security reasons.

Thank you,
Catalin

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[loraehmke]

This reply has been set as private.

[Catalin]

Hello,

Please take a look at this:

https://wordpress.org/plugins/peters-login-redirect/

You can redirect users to different locations after logging in and logging out with this plugin.

Thank you,
Catalin

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[gm713]

Hey Catalin,

Any update on how to trigger the login via a button link?

Thanks!

[Catalin]

the link structure should be like this:

COPY CODE

<a href="#" title="link">link</a>

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[gm713]

Thanks, you mentioned that before, but I want to use a button to fire the popup and not a text link. Is that possible?

[Catalin]

hello,

You can create the link and adding class=”kleo-show-login” to the a tag and then style it using CSS. Where do you want to add it? Show me and I will provide you the necessary code.

Thank you,
Catalin

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[gm713]

Thanks for you reply. Please find the “Sign Up” link on the homepage http://greencardez.net within the Forums section (3rd section from top with blue background)

[Catalin]

also add this in your style.css file from your child theme:

COPY CODE

.btnboton_doi:hover, .boton_doi:hover
{
  text-decoration: none !important;
}

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[gm713]

Great, thanks. That did it.

Before closing this issue out, I have “bp-menu bp-login-nav boton_doi kleo-show-login” in the extra calls field. Do all these need to be in there, or do I need to remove any.

[Catalin]

no, leave them there… 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Author]

Posts