Want your checkout screen to match your style?
We are happy to introduce Custom Header Design, a simple way to create elegant and simple constancy across platforms. Brand your Pure Charity checkout screen with custom links, images, and colors that feel like they've never left your website. Make the backend user interface seamlessly reflect your style. It's a powerful tool that's easy to use.
To access Custom Header Design, from your nonprofit dashboard, under Settings, click Custom Design.
It's pretty straightforward. Upload your logo—we'll resize it for you—and then link your logo to the appropriate webpage. Usually this will be your organization's homepage. For Pure Charity, that would be http://www.purecharity.com.
Choose your header background color. Usually, this color is the same color as the color of your logo, but sometimes it's something else. The color values are in hexadecimal. Not sure what your hex color values are? From the Google Chrome browser, you can right click on your webpage and click Inspect. This will bring up a lot of code. If you're not used to seeing this, don't panic. At the top of the menu that opened on the far left-hand side is a small square with an arrow pointing into it, when you hover over this icon, it should say, "Select an element in the page to inspect it." Click this icon, then click on any image or text or background you want to find out the color of. The color will be listed on the bottom right corner of the window that popped up when you clicked Inspect. If you don't see it right away, select the arrow beside the word Color to drop down the menu and see the color values listed there. You'll want to match the header background color to whatever color the menu bar on your website already is. Same with the header text color—go ahead and match it with the text color of your website's menu bar.
Link 1, 2, and 3 Text as well as their Addresses are for you to create redirects back to other features. We strongly encourage you to only use one link, however, as once someone is on a check out screen, we don't want them to have a lot of options to click away. We would highly recommend adding a link to your personal help desk so that if donors have questions about their gift, they can easily be connected to your organization
You can then change the color of body text, background, and submit button. On a best practice note, usually the color of the submit button matches the color of the header background. Use the color inspection tools to match the text and background color to the text and background color on your current website.
Setting your custom header design will change your checkout screens across all features, your nonprofit's admin dashboard and individual fundraiser dashboards.
Have questions about this feature or curious to hear more about what we've been working on for you? Contact your account lead or contact Support at email@example.com