Mobile Friendly Donation Form with reCaptcha

Options
JP Provencal
JP Provencal ✭
Ancient Membership Facilitator 1 Name Dropper Photogenic
in Blackbaud Raiser's Edge NXT®: General Discussion
We have run into a bit of a snag. When looking at our donation form, everything appears to be scaling correctly to render on our mobile devices, *except* for the reCaptcha which continues to display using the desktop CSS with such code as margin-left: 514px.



Now I'm comfortable enough with CSS to painstakingly go through the rendered code line by line (table cell by table cell) and target the reCaptcha specific sections in an attempt to get it to display properly however we discovered the following message in the forms HTML:



/* Do NOT Include In Stylesheet Editor */


/* We do not want clients styling "reCaptcha" name invisible for licensing reasons */



So a couple of questions?



1) Are we allowed to modify the CSS to affect the reCaptcha?


2) Does Blackbaud already have mobile friendly reCaptcha CSS somewhere?
Tagged:

Comments

  • Ryan Beggs
    Ryan Beggs ✭
    Ninth Anniversary Facilitator 1 Photogenic
    Hello JP,



    I checked on the comments you mentioned and those were added in the product some time ago. It's possible that there were some licensing issues before Google obtained the rights to reCaptcha.



    They now have documentation available on how to change the look and feel of reCaptcha. I see no problem with you adding your own styling to the mix as long as it does not interfere with the base functionality of the form.



    We currently do not have any examples available, but I will look into moving those styles into the main default style sheet editor so they can be easily modified.



    Thanks!


    -Ryan

Categories