By establishing your Design Settings in Virtuous Raise, you will be able to standardize the branding across all your Pages and Forms. Let’s review how the Design Settings work!
Table of Content
- Global Design Settings
- Overriding Design Settings on Pages and Forms
- Additional Page and Form Settings, Design, and Preview
Global Design Settings
To access your Design Settings in Virtuous Raise, navigate to Settings > System Settings > Design.
The first portion of the screen will allow you to define your Font and Radius settings. The border radius dictates how rounded the borders are for the various field boxes in your Form or Page. Select the “Font Family” dropdown menu to choose your default Font.
The next portion of the screen will allow you to define your various Brand Colors. You can use hex codes by entering the code into the box or use the visual selector by selecting the color box and using the pop out selector.
Overriding Design Settings on Pages & Forms
Within each separate Page or Form, you can override the global design settings to further tailor a donor’s experience based on the Form or Page itself.
To locate a Page or Form to customize, click Fundraise from the lefthand menu and the select the one you want to customize.
Depending on the component type, various Settings and Design aspects can be modified on the right hand side of the screen. For example, a Header will allow Design customization of the Background Color, Link Color, and CSS Class. While its Settings allow for customization of a Logo, Custom links and the addition of a link to the Donor Portal.
Additionally, Form components provide much more extensive customization of Design and Settings given their complexity. To easily locate the Form's settings, hover your cursor over the Form component and then look for the Form Settings button at the top. Selecting this will open up its Design settings to the right side of the page. You will also see additional Settings options for controlling the column layout as well.
Options available to you in the Design settings include adjusting the Form's background color and image (with the ability to use a different image on mobile devices), section padding, content width and a CSS Class option.
Lastly, each Section (where components like Forms are placed) can be customized as well. Hover your cursor in the blank space above a component, and you will see the Section outlined in green. Click that Section and its Settings and Design options will appear in the menu on the right just like the others.
Additional Page and Form Settings, Design, and Preview
Within each Page or Form builder, notice icons in the top left-hand corner. These include Navigator, Add Component, Prompts, Settings, and Design.
Selecting the gear icon opens additional options: Settings, Trust & FAQ Center, Social Sharing, Page Expiration, International Support, and Test Mode.
Settings
On the first tab, Settings shows required fields like Page name and slug.
Reporting & Tracking: where the designated Default Project, Segment, and Gateway for the Page or Form. And Confirmation Details: where you can choose your Recurring and Acknowledgment email templates, and the option to send test confirmation emails.
The second option, Trust & FAQ Center allows you to instill trust in your donors by answering common security, tax, and alternative giving questions right from your donation Page or Form without taking them out of the donation flow.
All new pages and forms will have this option turned on by default, with some basic copy included to get you started. For example "Is my donation secure?" followed by a text answer or "Other ways to give" followed by a custom URL.
The third option under Settings, Social Sharing allows you to customize how your donation Page content will display when the link is shared on social media platforms.
The fourth option under Settings, Page Expiration, allows you to set a specific date for the Page to expire and no longer be accessible.
As an example, you may have a branded Page for your 50th Anniversary Gala Page that should no longer be active one month after the event has concluded.
Enter the exact date in the Expiration Date field.
Select which of the two Redirect Type options you would like donors to experience.
- Custom URL: Enter a specific URL to send donors to
- Redirect to Page: Select a specific Giving Page to redirect donors to
Lastly, decide if the Page should be archived upon expiration. Note: at this time, you are not able to unarchive pages in Raise.
International Support controls how your Page manages foreign currency. Select from the dropdown International to allow donors to choose their preferred currency or Off to hide the currency selector from the form and only allow donations to be accepted in the gateway currency.
Test Mode puts your form or page in a testing environment that simulates creating real objects without the risk of affecting real transactions or moving actual money. This can be used to test your form, integrations, and/or custom code without making actual charges or payments. To view the data that is sent through a Test Mode form, you must turn on View Test Data in your account settings. Learn more about Test Mode and testing payment methods.
Note: Turning this on will lock your page or form into Test Mode until toggled off. All data that comes through the form (even real transactions from your published page) will be considered test data.
Design
The paint icon is for managing the page design. The Style section defaults to your organization's Design Settings. Changes made here will only impact the selected Page or Form, and will not update global settings. Custom Code Snippets are also accessible here.
Use the Preview, or eyeball icon, at the top right of your donation page or form to preview any design changes in a new tab in your browser.
Lastly, the eyeball icon will open a preview of your donation page or form in a new tab in your browser.
Need More Help?
Need more help optimizing your Giving Pages? Virtuous Professional Services can customize, build, and optimize your Virtuous Raise Forms or Pages to boost donor engagement. Click here to learn more about our Professional Services offerings, or contact your Customer Success Manager to get started!