I'm looking to improve the look of buttons on CiviCRM public forms. I am using a bootstrap sub-theme. Are the button classes documented anywhere? Any suggestions for addressing this?

Using Drupal 7 & CiviCRM 5.x


If you're using Drupal + CiviCRM you should check out the "Shoreditch" theme for CiviCRM which changes the CiviCRM UI to use bootstrap based styling.

CiviCRM Name and Address profile on D7, Civi 5.1.2 using ShoreDitch

Note: Shoreditch is in Alpha state and undergoing active development, we are using this in production and aside from a few minor issues it's working very well.

If you're not using Drupal you would want to look at overriding the CSS in your CMS/site theme. You can get the button classes etc using the "Web Inspector" in any major web browser - these are not directly documented at present.

  • Shoreditch doesn't address public forms, or at least I haven't seen how.
    – Yossi
    Jun 5 '18 at 19:44
  • @Yossi Shoreditch absolutely covers CiviCRM profiles (public forms), I've added a screenshot to demonstrate this. Jun 5 '18 at 19:48
  • Thanks... Maybe the civicrm_theme module is causing a conflict on my end... does it address mobile displays?
    – Yossi
    Jun 5 '18 at 20:18
  • @Yossi yes - mostly. You'll want to make sure your CRM theme is also bootstrap based or otherwise that it gets out of the way and lets Civi do the heavy lifting. If you find issues with it definitely get them raised as Shoreditch is looking likely to be the future of the CiviCRM UI Jun 5 '18 at 20:19
  • There is also the Civi Bartik Public theme: github.com/CiviCooP/civi_bartik_public which is for public civicrm pages. And let you define the color scheme etc... Jun 6 '18 at 8:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.