The main visual element of the donate page is composed of a pair of images, that allow the user to select the amount to donate. These images are meant to help the donor visualize the impact of his contribution, and make it more tangible than just a number.
The two images represent a "before" and "after" state, showing the donor how his donation is helping the cause. For example, if you are collecting donations in order to save your aminals, the "before" image can show the animal in black and white and thO e after image in olor. Or it could be black a blackand white picture changing to color.
An example of before and after photos
Be creative and try to think of a way to illustrate or symbolize the positive impact that the donation will have.
Important: When selecting the images, be sure to select high quality images in landscape mode. The images you upload will be scaled automatically to 420x300, but if you want full visual control you should scale the images yourself to these exact dimensions using image editing software.
- Color theme - select the theme that matches your images or brand.
- Title - the main heading of the donate page. Use this for an inspirational sentence or slogan.
- Subtitle - a sub-heading below the main one, which can be used to explain about the donation process, to remind the donor that his donation is tax-deductible, and so on.
- Block size - the donation images are broken into square blocks, with each block representing a donation amount. To increase the donation size, the user simply highlights more blocks. By setting the block size, you can choose how many squares will be available for selection: 35, 140, 315 and so on. A larger number of blocks gives the donor more fine-grained control over the donation size.
- Show grid - whether to display grid lines over the images. Try the different options and choose the one which looks best.
- Smallest donation value - the donation amount when only one block is highlighted.
- Per block donation value - the donation amount for each subsequent block beyond the first. For example, if the smallest donation value is set to $20 and the per block donation value is set to $5, the blocks will represent donations of $20, $25, $30, $35 and so on.
- Default donation - the donation amount that is initially displayed before the donor selected a different amount. Set this to a high value to encourage larger donations, but not too high as it may discourage smaller donors if they feel that this amount is "out of their league".