Style Ninja Forms multipart buttons

Hi. I am working on this Ninja form: http://samverkanmotbrott.se.loopiadns.com/?nf_preview_form=1

I would like to have the multipart links as buttons instead of just text. Ninja forms suggested to add a picture as a background but I don’t really like that. Do you know if there is any other way to style this as button?

Tomas

Hi there,

Thanks for writing in.

I don’t see any form there :slight_smile:

Perhaps it needs logging in? You may also try contacting the plugin author, we’re not sure how their CSS and class name.

Thanks!

Sorry. I think I sent you the wrong link. This is the link: http://samverkanmotbrott.se.loopiadns.com/blankettbestallning/

Hi there,

Thank you for providing the link. Please kindly add the code below to X > Launch > options > JS:

jQuery('.nf-previous, .nf-next').addClass('button');

The code above searches for the ninja form navigational buttons and adds a class of button to them. whenever an element has a button class in our theme it will switch it looks to the overall button layout.

Hope it helps.

hi.
I added the code but cannot see any difference. Can you take a look?

Tomas

Hi Tomas,

That code is working fine.

Could you please provide us with your admin account so we can take a closer look?

Thanks.

Sure.

It is the links “Grannsamverkan”, “Grannstöd”, “Töm bilen själv”, “Övrigt material” and “Beställarens uppgifter” that I would like to have styled as a button instead of as just text.

Tomas

Hello @TomasJarvling,

Can you please confirm the login details as I am unable to login with the shared one? Also while sharing credentials please make use of secure note feature so that the information is in between you and Themeco staff.

Thanks.

Ok. I reset the password and I think I wrote it in the secure note. Can you try again.

Hi there,

I see that you have other links on your mind but unfortunately, the given URL is not valid anymore and again the user pass is not working for me.

The code is correct but it is a matter of the correct selection of the link which you want to make it as the button.

Would you please kindly give us a new URL and User/Pass and a screenshot of the links that you want to be changed?

Thank you.

Sure. This is the page: http://samverkanmotbrott.se.loopiadns.com/blankettbestallning/
These are the links that I would like to have styled as buttons: http://samverkanmotbrott.se.loopiadns.com/media.samverkanmotbrott.se/public_html/2017/09/Skärmavbild-2017-09-08-kl.-22.43.29.png

I am a little bit unsure of how to make a “secure” answer with password etc. But i wrote the password in the secure note field. The admin is the same

Hi there,

Thank you for providing the link and screenshot. Judging the information you gave us kindly change the code in X > Launch > Options > JS to:

jQuery('.nf-breadcrumbs a').addClass('button');

I still can not access to your dashboard it says the User/Pass is incorrect. I think we access from the wrong location? Is this a correct URL to access the dashboard?: http://samverkanmotbrott.se/wp-login.php

Thank you.

Ahh. That explains it. The site I am working on now is a preview site for samverkanmotbrott.se. I am setting the site up at a different web host and will move the domain as soon as I am ready. Login via this adress: samverkanmotbrott.se.loopiadns.com/wp-login
I added the code but didn’t see any difference for the links - no buttons yet

Hello There,

Please double check the credentials. Give us the access in this order:

  • WP Login url
  • WP username
  • WP password

Thank you in advance.

Have written the credentials in the secure note. Make sure after login that the url is samverkanmotbrott.se.loopiadns.com since this is the testsite

Tomas

Hi there,

Thanks, I’m able to log in.

Is this http://samverkanmotbrott.se.loopiadns.com/blankettbestallning/ still accessible to your end? Because it freezes my browser. And it uses 4gb of ram, something is wrong with your page. I tried another different browser and it loads, but the problem is it freezes after it loads so I can’t troubleshoot either. Plus, when it loads, it’s different from the screenshot you provided http://samverkanmotbrott.se.loopiadns.com/media.samverkanmotbrott.se/public_html/2017/09/Skärmavbild-2017-09-08-kl.-22.43.29.png.

The question is still the same, is this http://samverkanmotbrott.se.loopiadns.com/blankettbestallning/ the correct URL?

Or maybe, the freezing is caused by ninja form and it doesn’t load at all, hence it’s not the same in my view.

So instead, I created a draft page here http://samverkanmotbrott.se.loopiadns.com/194-2/ and the same issue, the form is not loading at all.

BUT, I think I know why the above javascript isn’t working. Because the form is dynamically generated and that code is executed even before the form is generated.

Please try this one instead,

jQuery( function($) {

function nform_button () {

setTimeout( function() {

$('.nf-previous, .nf-next, .nf-breadcrumbs a').addClass('button x-btn');

}, 1000 );

}

$(document).ready(nform_button);
$(window).load(nform_button);

} );


This is not the best solution, it’s better to contact ninja form support as they may give you multiple workarounds including API or their own javascripts.

Thanks!

Hi.
That was strange. I shut ninja forms down. But i experienced the same issue as you - the page freezes. I changed to another standard theme and tried another page - the welcome page. That worked.
I changed back to X-theme but then I got the same error again - the page freezes.
Could something have happened with X?
As It is now - when not using Ninja forms - i cannot switch to Theme

Hi there,

Yes, I noticed that. Would you mind providing your FTP login credentials as well? I like to check it there, all plugins are disabled and it still freezing when X theme is active.

For the meantime, please try re-installing your X theme.

Thanks!

Hi There,

I tried to activate X theme then check error logs via FTP but I can’t find it. When using X theme the page loads as 404 page not found then it freezes. I change it back to twenty fifteen. Since there’s caching plugin, can you try to clear cache and then change back to X theme. Let’s try if this is not a caching issue. Also check in with your hosting provider regarding error logs. Let’s see the actual error information logs.

HI. I have talked to the provider and have added this code to the .htaccess file:
php_value error_reporting 2047
php_value error_log /din/absoluta/sökväg/httpd-error.log
php_value log_errors_max_len 52428800

They said that error messages should appear.

Can you take a look?

And I was thinking. The theme worked fine before I added this code:

jQuery(’.nf-breadcrumbs a’).addClass(‘button’);

Is it possible to remove that to see if it works? But I cannot access the customizer since it freezes.

Tomas