Hello,
I am using a pop up login plugin where i need to add class in link to trigger the pop up, like <button class="lrm-login lrm-hide-if-logged-in" > Login </button> to trigger pop up login when clicked on login text.
Now, i can easily add the widget, but couldn't find any way to add that class to the buttons of the widgets.
Please guide me regarding this..
Hi @civilenggnotes,
Please read Alvina's answer here: https://wpforo.com/community/postid/45698/
hi @sofy
i just followed the steps in the post. it is working for "Please login or register to reply to this topic." message when trying to reply in forum post. but it is not for the "Please login or register" message when clicking on "add comment" button or the login/register button on the sidebar widget.
I was trying inspection tool from google chrome. and I guess I found some solution, but don't know to go apply it. when I inspect the login button, I get the following code.
<a href="https://www.civilenggnotes.in/community/civil-engineering-softwares/system-requirements-for-autocad-2021/?foro=signin" class="wpf-button"><i class="fas fa-sign-in-alt"></i> Login</a>
It is to be replaced by
<a href="#Login" class="wpf-button lrm-login lrm-hide-if-logged-in"><i class="fas fa-sign-in-alt"></i> Login</a>
The same thing is to be applied to register button with a little modification.
Hi @sofy
Please have a look in this matter. I am waiting for a long time. I have changed everywhere to pop up the login model, except this one. I could not find any solution to change the class of the button of the sidebar widget.
I would also suggest to use the unprefixed and standard value in your code – some browsers already have them, as Firefox.
Then, you can simple toggle the class when a button is clicked. Depends if you want remove the class when the same button is clicked again, you have to use addClass or toggleClass:
Hi @johns0265
Thanks for your suggestions. But i am totally a non-techy. Therefore, i could not understand completely what did you said..
hello, any expert here to help??
Use the following js code:
jQuery(document).ready(function($){$('.wpf-prof-footer > .wpf-prof-loginout a:first-of-type').attr('href', '#Login').addClass('lrm-login lrm-hide-if-logged-in');});
Use the second way explained in this article: https://www.collectiveray.com/add-javascript-to-wordpress
Hi @sofy
I tried to use the code in the header, but it is not working. Where to add this??
And will it work for login button only, or for registration button too??
hi @sofy
the login button is working fine, then tried the same for the register button. what should be JQuery for register??
and will that code be in the same js file?? actually I am using the 1st method described in the link you provide,.
try this one:
jQuery(document).ready(function($){$('.wpf-prof-footer > .wpf-prof-loginout a:last-of-type').attr('href', '#Register').addClass('lrm-register lrm-hide-if-logged-in');});
and will that code be in the same js file?? actually I am using the 1st method described in the link you provide.
yes, you can add it in the same file.
Here I'll show you with a simple example on how to dynamically add or remove CSS class of link tags using jQuery methods.
