Creating Your First Campaign

This is where the Digioh fun begins: you'll build a real, on-brand campaign and get it live on your site. We'll use one of Digioh's pre-built themes so you get a professional result fast, then show you how to make it match your brand and collect the data you actually need.

A Tour of the Design Editor

Every Campaign is built and edited in the Design Editor, and it's where you'll spend most of your time in Digioh. Before touching anything, it's worth walking through what you're actually looking at, since the editor packs a lot into one screen.

When you open a Campaign, you land on the editor: the visual, WYSIWYG representation of what visitors will actually see. Almost everything you add or edit shows up here in real time. In the top left corner of the editor is the Settings dropdown, your entry point to campaign-wide configuration that isn't tied to any single element: Campaign Settings, Display Rules, Account & Campaign Styles, and Integrations. You'll come back to this menu regularly, so it's worth knowing it's there before you need it.

To the left side of the editor, you'll find your pages listed out. A Campaign is made up of one or more pages: a simple email capture Campaign might have just one, while a more involved flow could have a main offer page, a Thank You page, and one or more Extra pages you branch to based on what the visitor selects. Click the gear icon next to a page's name to duplicate or delete it. Each page carries its own settings, split across multiple tabs: Layout, Form, Buttons, Text, Images, and HTML. Each tab covers a different part of the page's configuration, so it's worth knowing what lives where:

• Layout tab: the page's dimensions, responsive behavior, border, background, and Extra CSS. This is also where Page Branches control jump or skip logic for multi-page flows.

• Form tab: everything related to the form on that page, including what happens After Form Submit (go to the next page, redirect, close the Campaign, and so on) and the Fields subtab (covered later in this article). You can also use the Label and Inputs tabs to style the look of your form fields.

• Buttons tab: every button on the page, in one place. Configure what happens When Clicked: submit the form, go to the next page, redirect to a URL, close the Campaign, and more. Each button state (Default, Hover, Selected) can be styled separately.

• Text tab: headlines, body copy, and disclaimers. Style it under Text Styles.

• Images tab: pick an existing image from your account or click + Add Image to upload a new one directly in the editor.

• HTML tab: raw HTML for anything the standard tabs don't cover, like an embedded widget or custom markup from your design team.

Finally, when you first create a Campaign, you'll have to choose a type, which affects some of what's available in the tabs above:

• Pop Up: appears centered on the screen, over the page content. Best for high-attention offers like email capture or a discount code.

• Sidebar: anchors to a corner of the screen. Less intrusive than a pop up, good for persistent offers, and also a good way to tease a pop up before it displays.

• Inline / Embedded: built directly into a page on your site, like a content block. Good for placements within a blog post or landing page.

• Banner: a strip along the top or bottom of the screen. Good for sitewide announcements.

Campaign Settings

Open Campaign Settings from the Settings dropdown to configure options that apply to the whole Campaign, not any single page or element:

• Campaign type: switch between Pop Up, Sidebar, Inline/Embedded, and Banner at any time. Your existing design is preserved if you change your mind later.

• Screen behavior: choose whether the Campaign displays as Fixed/Full-Screen or Responsive, controlling how it scales across screen sizes.

• Screen Overlay Background: control how the overlay appears behind the Campaign and in front of the page.

• Close Button Settings: toggle on a built-in close button that's automatically added to every page of the Campaign, no need to drag one onto the design yourself.

• Campaign Metadata: key-value pairs scoped to this Campaign, used to control Custom JS behavior (like a Campaign ID or a tracking toggle) without hardcoding values into your scripts. Metadata can also be set at the Account, Page, Element, and Field level; Campaign Settings is where you set it at the Campaign level.

Making Updates in the Editor

Building a Campaign is rarely a one-and-done pass. You'll come back and adjust things, and most of that happens through a small set of repeated moves:

• Select and move: every element can be repositioned by clicking it and dragging it into place. Use the exact Size and Position fields at the bottom of the element's settings when you need pixel-perfect placement instead of a freehand drag.

• Restyle an existing element: select it and adjust its settings just like you would when adding it fresh. Nothing about editing an existing element is different from configuring a new one, so everything in the section above still applies.

• Copy settings instead of redoing them: the Buttons, Text, Images, and HTML tabs all support Copy Design Settings From and Apply Design Settings To. Use these to pull one element's styling onto another, or push your changes out to several elements at once, instead of manually re-matching fonts, colors, and spacing by eye.

• Duplicate rather than rebuild: both pages and full Campaigns can be duplicated. Duplicating a page keeps its layout and content as a starting point; duplicating a whole Campaign (from the Campaign List) carries over its integrations too, which is a fast way to spin up a variant of something you've already built.

Collecting the Data you Need: Fields and Zero-Party Data

The whole point of a Campaign is usually to collect something: an email, a preference, an answer that helps you personalize what comes next. That data is called zero-party data, information visitors volunteer directly, and it lives in your form's fields.

Every form has four default fields: Name, Email, Phone, and Opt-In. Email and Phone come with basic format validation built in, and Opt-In always appears at the bottom of the form regardless of how many other fields you add.

Beyond those four, add Custom Fields under the page's Form tab, in the Fields subtab. Digioh supports several field types depending on what you're collecting:

• Textbox or Text Area: open-ended free text, single or multi-line.

• Dropdown or Radio: a single choice from a defined list, good for preferences like "favorite category" or "how did you hear about us."

• Checkbox: a single on/off choice, commonly used for additional opt-ins.

• Hidden: not shown to the visitor, used to capture something automatically, like a UTM parameter or a value set by a button click.

• Date Picker (dropdown or calendar): for birthdays, event dates, or anything date-based.

Step 1: Create your campaign from a Quick Start Theme

Quick Start Themes give you a professionally designed Campaign with best-practice Display Rules already configured, so you're not starting from a blank editor or guessing at targeting.

Browse and pick a theme

1. From the Campaign List in your account, select Create New Campaign, then from the Use Case dropdown, select Quick Start. This opens the theme gallery, Digioh's library of pre-built, ready-to-launch designs.

2. Filter the gallery by campaign type using the Pop Up, Sidebar, Inline, and Banner options at the top, to narrow the library down to the format you want. Additionally, you can filter by Use Case to find themes built to do what you need.

3.  Browse the filtered themes and choose the one closest to the experience you want to create. Everything in a theme is fully editable, so it doesn't need to be a perfect match; treat it as a strong starting point, not a final answer. You can also preview any theme before creating it, to step through the full experience first.

4. Select Create and give your Campaign a name. It opens directly in the Design Editor, already built out with the theme's layout and copy placeholders, plus the Quick Start theme's prebuilt Display Rules.

Step 2: Customize with Account Styles and Campaign Styles

Rather than manually restyling every text and button element, use styles to apply your brand's colors, fonts, and button treatments in a few clicks.

• Account Styles are reusable presets shared across every Campaign in your account - ideal for things like your primary CTA button or body text, since you'll likely reuse them. Important: editing an Account Style updates it everywhere it's applied, so review changes carefully before saving.

• Campaign Styles work the same way but apply only to the current Campaign - use these when a specific Campaign needs its own look. 

To apply or create styles:

1. Open the Text or Buttons tab for the item you want to style.

2. In its settings, open the Styles dropdown. If styles already exist, apply one directly. If not, select Set Up Now to create your first one (or, for Account Styles, go to Settings → Edit Account Styles).

3. Adjust Typography (font, size, color, alignment) or Button & Link settings (border, background, spacing) as needed.

4. Save your styles, then confirm the look across the Campaign.

Once you're happy with the styling, you can preview your campaign at any time, right from the editor: select Preview, then Preview on Blank Site. This gives you a fully working version of the campaign so you can test submissions and confirm your data flows correctly before publishing.

Your campaign is designed, styled, and ready to go, but it isn't live yet, and that's exactly right for now. Before anyone sees it, there's targeting to set up: next, let's go over Display Rules, which control who sees your campaign and when, and cover how to actually get it published once that's dialed in: Conditioning your campaign with Display Rules.