This article walks you through customizing the look and behavior of your online giving form.
Where to find it
From the Portal Studio (the /website builder), open the Giving Widget tab. You'll land on a page titled Giving Widget with a Live Preview on the right that updates as you make changes.
💡 Tip: Use the Show hints / Hide hints link at the top of the panel to toggle the helper text under each setting. Save with the Save Changes button (or press Ctrl/Cmd + S), and use Reset to Defaults to start over.
1. Header & Branding
Option | What it does |
Show Header Section | Display a title and welcome message above the giving form. |
Header Title | The heading shown to donors (e.g. "Give to Our Church"). |
Welcome Message | A short message under the title. |
Brand Color | Used for buttons, accents, and interactive elements. Use a hex code (e.g. |
Form Background | The background color of the form area. |
Text Color | The color of the text inside the form. |
2. Form Layout
Option | What it does |
Corner Roundness | How rounded input fields appear (slider). |
Button Roundness | How rounded buttons appear (slider). |
Label Position | Where labels appear relative to inputs (Top, Left, Right). |
Label Text Alignment | Align label text Left, Right, or Center. |
Space Between Fields | Spacing between fields (slider). |
Space Between Sections | Spacing between major sections (slider). |
3. Text & Buttons
Option | What it does |
Base Font Size | Size of input and label text (Small 14px, Medium 16px, Large 18px, Extra Large 20px). |
Header Text Size | Size of the header text (Small 12px through Extra Large 18px). |
Button Size | Small, Medium, or Large. |
Submit Button Text | The text on the main action button (e.g. "Continue to give"). |
4. Giving Options
Option | What it does |
Show Preset Amounts | Display quick-select buttons for $10, $20, $50 (plus an "Other" amount). See How to enable custom giving amounts. |
Payment Frequency Options | Toggle which frequencies are available: One Time, Weekly, Bi-Weekly, Monthly. At least one must stay enabled. |
Show Fee Breakdown | Show processing-fee details to the donor. |
Show Notes Field | Let donors add a note to their donation. |
5. Confirmation Messages
Option | What it does |
Success Message | Shown after a successful payment (e.g. "Thank you for your donation"). |
Error Message | Shown if a payment fails. |
Redirect After Payment | Send donors to a custom page after giving. Must start with |
6. Embed & Sharing
This is where you publish and share your form:
Embed Code — copy the HTML and paste it into your website where the form should appear. The widget automatically uses your customized settings.
Direct Link — a shareable link to your giving page, ideal for email, text messages, QR codes, and social posts.
Live Preview: Every change you make updates instantly in the preview on the right, so you can fine-tune before sharing.
💡 Pro tips
Match your brand color and fonts to your church website for a cohesive look.
Keep payment frequencies to just the ones you actually use.
Personalize your thank-you message with a next step, like joining a group.
Always test the form with the Direct Link before embedding.
Still need help? Start a chat with us.