Styling the form design with CSS

Back to the homepage

Styling the form design with CSS

You can customise the look of your forms with the help of your own CSS instructions to fit your web page. The individual styling allows you the greatest possible design flexibility.

Procedure
You can style the corresponding form on the basis of our current HTML/CSS with your desired CSS and images. Please do not copy our complete CSS, but only change the places you want to change. Our CSS should only serve as a help for the IDs and classes, which you can also find out with the help of Firebug for Firefox.

Depending on the selected design template the URL to the donation form CSS file is:
https://secure.fundraisingbox.com/paymentAddOn/style.css
https://secure.fundraisingbox.com/paymentAddOn/style2.css
https://secure.fundraisingbox.com/paymentAddOn/style3.css
https://secure.fundraisingbox.com/paymentAddOn/style4.css
https://secure.fundraisingbox.com/paymentAddOn/style5.css
https://secure.fundraisingbox.com/paymentAddOn/style6.css
https://secure.fundraisingbox.com/paymentAddOn/style7.css

The resulting CSS is entered into the advanced settings of your form under design settings. It is automatically included as the last CSS after all others, which allows you to overwrite or extend all previous definitions.

If you do not want to use an existing design template and prefer to style everything from scratch, select "Do not load default style sheets" in the preferences.

SSL encryption:
If you want to use your own elements such as images and fonts, you must upload them onto a Server with SSL support (or SSL-enabled storage solutions, such as AWS S3 or CloudFront) and add a reference into your CSS. If you use elements without SSL encryption, the browser will not recognise the page as secure.

Since not everyone owns an SSL certificate or wants to buy it separately, you also have the possibility to upload the items in your FundraisingBox. Go to "Settings > My Customer Account" and there to "Documents & Files". Now select "Direct link file" and upload the files.

Normally, uploaded files are not visible and accessible from the outside, but with these files you now see a so-called "direct link", which makes the file accessible by a "key" made publicly accessible. You can now use this HTTPS address as a path in your CSS.

Export to PDF