We’re with you. JoomShaper is offering a 20% Discount on all plans due to the impact of COVID-19.

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Changing button border color

Featured Lock Resolved Issue
Hey there, I have an issue changing the color of the button border/hover color as I would like to have it match the rest of the site. There is no color option in the add-on for these forms, and this color doesn't appear in the custom Helix Ultimate section. Any guidance? Thanks in advance!!

JS button border.png

Attachments (1)

  • JS button border.png
    JS button border.png 224.5 KB

7 Answers

Sifat - Staff

More than a month ago #Permalink
Thanks for your query. It would be easier to solve your issue if you could share the exact page url here. But you can use this css into your custom css and that'll change the border color for that button.

.sppb-ajaxt-contact-form button[type="submit"] {
border: 2px solid red;

Here you'll find all the informations regarding custom css https://www.joomshaper.com/documentation/helix-framework/helixultimate#documentation-heading-1_8

-Best Regards

Hayden Cyr

More than a month ago #Permalink
Thank you for that response. I think I didn't give enough information in my first post. The issue is that the buttons look great and like they are supposed to look with the template, but only in the backend using Page Builder frontend editor. But they render completely differently when I see them visiting the frontend. I have included screenshots to show you the differences. Below is a link to the development site.

This is happening with all of the buttons on the site, not just this one. I would like them to respond as they do in the template. I am not sure where I have changed the CSS for these buttons, there is nothing in the custom code section of Helix Ultimate and nothing on the page CSS.

Thank you for your help.


live site view with incorrect button.png
backend view with correct button.png

Attachments (2)

  • live site view with incorrect button.png
    live site view with incorrect button.png 38.8 KB
  • backend view with correct button.png
    backend view with correct button.png 189.1 KB

Sifat - Staff

More than a month ago #Permalink
Thanks for your reply. Please check this screenshot http://prntscr.com/pftu2t
I found it's working fine here.

Note: Please disable all cache plugins if enabled. And remove all the cache from admin panel and recheck again. Hope this'll help.

-Best Regards

Hayden Cyr

More than a month ago #Permalink
Hey, thank you for this reply. It seems that it is happening due to the "compress css" in Helix. I have cleared css then turned off "production mode" in Page Builder Configuration and also cleared Joomla Cache. But this problem comes back as soon as I turn on Compress CSS in Helix again. Is there a way to clear this erroneous css from Helix?

Thanks for working through this with me.

Sifat - Staff

More than a month ago #Permalink
Thanks for your reply. Please turn off the compress css while you change anything in development mode. Otherwise no changes will be applied. Or you can disable the compress css if that solves your issue. http://prntscr.com/pgy4xd

-Best Regards

Hayden Cyr

More than a month ago #Permalink
The problem is that in another thread that I am supposed to turn Compress CSS to "On" so that changes to the custom preset will actually work. If I have it off, then there are no changes to the colors selected and altered. So in two different threads, I've been told two different things about the same "Compress CSS" option in Helix. Each one causing issues.

Also, telling me to disable the compress css, doesn't that hurt site performance issues? I'd rather fix the problem and be able to have the site be faster.

Thanks again for your thoughts on this.

Sifat - Staff

More than a month ago #Permalink
Thanks for your reply. I think you are mixing two things. One is compress SCSS http://prntscr.com/phunme
and another is compress CSS

And both of them has their description at bottom.

You can disable the compress CSS if that causing any issue for you.

-Best Regards

There are no replies made for this post yet.
Be one of the first to reply to this post!




Community Users


Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us