> ## Documentation Index > Fetch the complete documentation index at: https://docs.orderprotection.com/llms.txt > Use this file to discover all available pages before exploring further. # Branding Your Claim Portal > Co-brand the claim portal your customers use to file claims — logos, colors, copy, and typography, edited element by element. Your customers file claims on a co-branded portal hosted by Order Protection. The **Claim Portal Designer** lets you make that portal look and sound like your store: click any element in a live preview, and its properties open in a panel beside it. ## Before you start Open **Customizations → Claim Portal** in the left-hand menu. Two settings live here, outside the designer. The Claim Portal settings page showing Branded Claims Domain, Concierge Branding, and the portal preview **Branded Claims Domain** is the URL your customers file claims on, such as `claims.yourbrand.com`. Once you enter a domain, the page shows the DNS record to create — an **A** record pointing at Order Protection's address. Add it in your DNS provider, then follow the [white-label setup guide](/guides/whitelabel) for the full walkthrough. **Concierge Branding** is an on/off setting shown alongside it. If you're unsure whether it should be enabled for your store, check with your Customer Success Manager. Set up the DNS record before you start designing, so you can see your changes on the real domain as you work. ## Opening the designer In the **Claim Portal Preview** section, click **Edit**. The Claim Portal Designer with nothing selected The designer has four parts: * **Properties panel** on the left — where the selected element's settings appear. * **Live preview** in the middle — your actual portal, which updates as you edit. * **Desktop / Mobile** tabs above the preview — switch which breakpoint you're designing. * **Welcome / Claim Selector** switcher on the right — the two pages of the portal. **Publish** sits in the top right, alongside when the portal was last published. ## How editing works Click any element in the preview. It gets a highlight ring, and its properties load in the left panel. With nothing selected, the panel reads *"Select an element to edit its properties."* The heading element selected, showing its Content, Style, Desktop, and Mobile property groups Properties are grouped into collapsible sections. Which ones appear depends on what you've selected: | Group | What's in it | | - | - | | **Content** | The words themselves — heading text, button labels, link text | | **Style** | Colors, text transform, border radius | | **Desktop** | Font size, line height, and letter spacing for desktop | | **Mobile** | The same three values for mobile | Text elements also show a **Custom font** uploader above their properties. The portal's layout is fixed. You can restyle and rewrite the elements that are there, but you can't add, delete, or reorder them. At the top you'll see **Apply styles & page settings to all pages**. This is always on today and can't be turned off — your styling and page settings carry across both pages. Per-page styling is coming in a future release. ## The two pages Use the switcher above the preview to move between them: * **01 Welcome** — where customers enter their order number and email. * **02 Claim Selector** — where they choose what kind of claim to file. The Claim Selector page with the Warranty Claims block selected ## What you can edit ### Welcome page | Element | Properties | | - | - | | **Logo** | Image upload, plus separate desktop and mobile widths | | **Heading** | Custom font, text, font color, text transform, and font size / line height / letter spacing per breakpoint | | **Description** | The same options as Heading, with its own font slot | | **Order Form** | Active border color for the input fields | | **Continue Button** | Border radius, background, background on hover, font color, text transform | | **Warranty Link** | Custom font, prompt text, link text, font color, text transform, and the per-breakpoint type settings | The Continue Button selected, showing its style properties ### Claim Selector page | Element | Properties | | - | - | | **Logo** | Desktop and mobile widths | | **Page Title** | Text, font color, text transform, and per-breakpoint type settings | | **Order Summary** | Show item count, font color | | **Shipping Claims**, **Warranty Claims**, **Returns** | Header, sub-text, and button text for each | | **Restart Claim** | Link text, show restart link, font color | **Text transform** offers None, Uppercase, and Lowercase — a quick way to get all-caps buttons or headings without editing the copy itself. ## Page Settings **Page Settings** sits at the bottom of the properties panel and applies to the portal as a whole rather than to one element. Page Settings expanded, showing Selectors and Page Meta Data & Favicon **Selectors** sets two colors used for selected options in the portal: * **Selected Background** * **Selected Border Color** **Page Meta Data & Favicon** controls how the portal appears in browser tabs and search results: * **Upload Favicon** — a small square image, typically 32 × 32 px. * **Title** — keep it to roughly 60–70 characters so it isn't truncated in search results. * **Description** — a short summary, under about 160 characters. A preview beneath these fields shows how the title and description will look as a search result. Page Settings is edited from the **Welcome** page and applies everywhere. On Claim Selector the section is disabled. ## Designing for mobile Switch to the **Mobile** tab to see the portal in a phone frame. Font size, line height, and letter spacing are stored separately for each breakpoint, so set them on both tabs — changing desktop type won't change mobile. Logo width is also set independently for desktop and mobile. ## Fonts Each text element has its own **Custom font** slot — heading, body, and sub-text are separate typefaces. Each slot accepts a single `.woff` or `.woff2` file. If your font is in another format, convert it first. ## Publishing When you're happy with the design, click **Publish**. A confirmation appears, and once you confirm, your styles are applied to your live claim-filing domain. There is no save or draft. Your changes live in the browser until you publish — if you close the designer with unsaved changes, you'll be asked whether to discard them. **Publishing goes straight to your live portal.** Uploading a file is the exception. The moment you choose an image, font, background, or favicon, that file is saved to your account — before and regardless of whether you publish. ## Questions? If you have questions about your claim portal or your branded domain, reach out to your Customer Success Manager or your shared Slack channel. This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.