Styling an Online Express Donation form

Kenny MacKenzie
Kenny MacKenzie
Fifth Anniversary
in Blackbaud Raiser's Edge NXT®: General Discussions
Hi community,

I am looking for a good solution to easily style an online express donation embed form. Currently it does not pick up styles inherently, so asking if there may be a CSS base file available that people have used, or other approaches to creatively displaying these forms in a content page. Has anyone had difficulties in styling?


Thanking you all  :)

K
Tagged:

Comments

  • Chris Martin
    Chris Martin
    Tenth Anniversary Kudos 2 Participant Facilitator 1
    Hey Kenny MacKenzie‍. I can share a little insight to why your OLX forms might not be inheriting some of your website's CSS automatically. When we set about to build the visual form designer in OLX, we wanted it to be easy enough for non-website-gurus to add some basic styling to their OLX forms without ever having to mess with their website's CSS. And at the end of the day, OLX forms are made up of plain old HTML elements. So when you apply colors, fonts, etc in the OLX form designer, the form loads its own CSS file in the donor's browser to try to match the styling set in the form designer. But...


    We also know that many of our customers do have folks on staff who are comfortable working with CSS. So we have these competing needs: On the one hand, customers who want their OLX forms to look on their website just like it looks in the form designer...and on the other, folks who want their OLX forms to inherit their website's CSS. We chose to err a bit on the side of making life a little easier for non-technical users and we authored our OLX forms' CSS style rules to be "just specific enough" (more specific style rules win out over less specific ones) to allow styling applied in the form designer to win most of the time.


    But the good news is that 100% of the styles are override-able. You may just have to write your website CSS rules to be more specific. The topic of CSS specificity is a little technical and is outside the scope of what's appropriate to get into here. But just know that if you get your style rules for any of the HTML elements in your OLX forms specific enough, they'll absolutely respect your site's CSS. 


    Hopefully that helps some.

    Chris Martin

    Blackbaud Product Management

Categories