A step-by-step guide to adding the Splash Screen block to your UniLink page so you can show a full-screen branded intro, launch gate, or seasonal announcement before visitors reach your main content.
- The Splash Screen block shows a full-screen page before your bio page loads — visitors must click through it (or wait for an auto-advance timer) to reach your main content.
- Unlike the Welcome Message popup, the Splash Screen completely replaces the page until the visitor advances — use it only when the friction is intentional and justified by context (launch day, exclusive content, age gate).
- Always include either a skip button or an auto-advance timer — a visitor stuck indefinitely on a splash screen with no way forward will close the tab, not your CTA.
- Video backgrounds with audio on autoplay will be blocked by most mobile browsers — use muted video or a static image background if mobile traffic is significant for your page.
There are situations where the standard bio page flow — visitor arrives, sees links, clicks — is not the right structure for what you are building. A launch-day page for a product drop benefits from a moment of anticipation before the grid of products appears. An event-specific page for a sold-out show might want a full-screen hero moment before the setlist and merch links. An age-restricted page needs a confirmation gate before the content loads. The Splash Screen block exists for these situations. It puts a full-screen experience in front of your main page — a visual gate that the visitor passes through deliberately before reaching the content. The friction is the point. When the context justifies a gate, the Splash Screen makes the arrival feel like an event.
What the Splash Screen block does
The Splash Screen block intercepts the visitor before your main page content loads and shows a separate full-screen view. This is categorically different from the Welcome Message popup: the Welcome Message appears on top of your page while the page remains visible behind it. The Splash Screen replaces the page entirely. Your links, blocks, and layout are hidden behind the splash until the visitor explicitly clicks through — or until an auto-advance timer counts down and moves them forward automatically. Once the visitor passes the splash, it does not appear again on the same session unless you configure it to show on every visit.
The splash screen canvas is fully configurable. The background can be a solid color, a custom image, or a video. Over the background, you place a headline, body text, and a CTA button — the button is the primary mechanism for advancing past the splash ("Enter Site," "Shop the Drop," "Yes, I'm 18+"). The button label is the most important piece of copy on the entire splash: it is what the visitor reads, evaluates, and clicks to proceed. Beyond these core elements, you can add a skip link that lets visitors bypass the splash without interacting with the CTA, and you can set an animation style for how the transition between the splash and your main page happens. The overall effect, when configured well, is a brief but intentional branded moment before the visitor reaches your content.
The auto-advance timer deserves specific attention because it is what separates a well-configured Splash Screen from a dead end. If you set an auto-advance timer, the splash will automatically move the visitor to the main page after a defined number of seconds — even if they do not click the CTA button. This is essential for any splash screen that does not require an active decision from the visitor (a countdown, an atmospheric intro, a seasonal announcement). For age gates or consent screens where the visitor must actively confirm something, you would intentionally not use auto-advance — the point is that the visitor must choose. Understand which type of splash you are building before you configure the block, because the auto-advance setting defines whether the splash is passive or mandatory.
Before you start
- Ask whether a Splash Screen is actually the right tool: The Splash Screen adds friction before every visitor reaches your content. For an everyday bio page that links to your social profiles and latest posts, this friction has no payoff — it just slows visitors down. The Splash Screen is justified when the context demands it: a product launch, an exclusive drop, a special event, an age gate. If you cannot articulate why a visitor who already clicked your bio link in Instagram still needs to pass through a full-screen gate before seeing your page, skip this block and use the Welcome Message instead.
- Decide on advance mechanism: Determine whether visitors must actively click through (mandatory CTA, no auto-advance) or whether the splash auto-advances after a few seconds. For atmospheric or announcement splashes, auto-advance at 3–5 seconds is better UX. For consent or age gates, mandatory click-through is appropriate. You can combine both: include a CTA button and set auto-advance, so visitors who read quickly can proceed immediately while others are moved forward automatically.
- Prepare your background asset: If you are using an image background, prepare a high-resolution image (at least 1920×1080px) that looks compelling when cropped to different screen ratios on mobile. If you are using video, prepare a muted loop under 10 MB — most mobile browsers will not autoplay video with audio, and a video that fails to load leaves the visitor on a blank screen. If you are using a solid color, pick a brand color with enough contrast for your text to be legible over it.
- Write your CTA button label specifically: The button label needs to describe what happens when the visitor clicks — not generic action words. "Enter" works for a branded intro. "Shop the Drop" works for a product release. "Yes, I'm 18+" works for an age gate. "Click here" works for nothing — it is the laziest possible label for the most important button on your splash screen.
How to add the Splash Screen block to your page
- Open your page in the Dashboard: Log in to UniLink, go to My Pages, and click Edit on the page where you want to add the splash intro.
- Add the block: Click + Add Block in the editor. Find Splash Screen in the block picker — it may appear under Marketing, Engagement, or as a featured block type. Select it. The block appears in your editor panel with a full set of configuration options.
- Set the background: In the block settings, choose your background type — color, image, or video. For a color background, use the color picker to set your brand color. For an image, upload through the media picker. For a video, upload an MP4 file or enter a video URL. If using video, locate the mute toggle and enable it — unmuted video will be blocked on most mobile browsers.
- Enter your headline and body text: The headline is the most prominent text element on the splash. Keep it short — five to eight words — and make it immediately communicative. Body text is optional and should add context, not repeat the headline. Two sentences maximum.
- Configure the CTA button: Enter the button label (specific action language, not generic). For a Splash Screen that links directly to the main bio page, you can leave the URL blank and the button will simply advance past the splash. If the splash CTA is sending visitors to a different destination (a pre-order form, a product page, an external site), enter the full URL.
- Set the auto-advance timer (optional but recommended): Find the auto-advance setting and enter the number of seconds before the splash automatically moves the visitor to your main page. For atmospheric intros, 3–5 seconds is appropriate. For announcement splashes, 5–8 seconds gives visitors time to read. For mandatory gates (age verification, consent), leave auto-advance off.
- Enable the skip button (optional): Toggle on a skip link or skip button to give visitors an explicit option to bypass the splash without interacting with the CTA. Place the skip link in a corner position (typically top-right) and label it something low-pressure ("Skip intro" or "Go straight to page"). The skip option improves experience for returning visitors who have already seen the splash.
- Choose animation style: Select how the transition from splash to your main page is animated — fade, slide, or instant. Fade is the most neutral choice and works across device types. Slide animations can feel jarring on small screens if the content layout shifts significantly after the transition.
- Save and publish, then test thoroughly: Click Save and Publish Page. Open your live page in an incognito browser tab and verify the splash loads correctly, the background renders, the button advances to the main page, and the layout holds on a mobile viewport. Also test the auto-advance if you enabled it by waiting on the splash without clicking.
Key settings explained
| Setting | What it controls | Best practice |
|---|---|---|
| Background type | Whether the full-screen canvas shows a solid color, a static image, or a looping video | Use image for most launch and event contexts; use color for clean, typography-forward splash screens; only use video if you have a high-quality loop under 10 MB and mobile fallback is acceptable |
| Headline | The primary text displayed over the background — the first thing the visitor reads | Five to eight words that name what is happening — "The Drop Is Live," "Welcome to the Show," "New Collection — Just Landed" — not brand slogans or generic welcomes |
| Body text | Supporting text below the headline for additional context | Optional; if used, limit to two sentences that answer a question the headline raises — do not repeat the headline in longer form |
| CTA button label | The clickable text the visitor uses to advance past the splash | Make it describe the action: "Enter," "Shop Now," "See the Collection," "Yes, I'm 18+" — the button label is the single most important copy element on the splash screen |
| Auto-advance timer | Number of seconds before the splash automatically transitions to the main page without a click | Set to 3–5 seconds for atmospheric intros; 5–8 seconds for announcement content the visitor needs time to read; leave off for mandatory consent or age gates where an active decision is required |
| Skip button | An optional link that lets visitors bypass the splash entirely without interacting with the CTA | Always include a skip option for any non-mandatory splash — returning visitors who have already seen the intro will appreciate it, and it reduces tab abandonment from impatient visitors |
| Video mute | Whether video backgrounds play with audio | Always mute video backgrounds — unmuted video autoplay is blocked by mobile browsers by default, which means the visitor lands on a silent broken experience; muted video loads and plays reliably across devices |
| Animation | Transition style when advancing from splash to main page — fade, slide, or instant | Fade is the most reliable and least disorienting transition across all screen sizes; slide is visually dynamic but can feel abrupt on mobile if the page layout differs significantly from the splash layout |
When a Splash Screen earns its friction — and when it does not
The fundamental question to ask before enabling a Splash Screen is: does the person who clicked your bio link actually need to pass through a gate before reaching your content? In most cases, the answer is no. Someone who tapped your Instagram bio link is already interested — they chose to leave the app and visit your page. Putting a full-screen obstacle between that intent and your content is friction with no obvious payoff unless the splash itself delivers something of value. A ten-second logo animation delivers nothing. A "Welcome to my page" headline over a gradient delivers nothing. A countdown to a product that drops in five minutes delivers anticipation, context, and urgency — that delivers something.
The Splash Screen performs well in a narrow set of contexts where the gate itself is part of the value proposition. A launch-day page where the splash confirms "The Drop is Live" and the CTA button says "Shop Now" turns the splash into a conversion moment — the visitor clicks the button already primed to buy rather than arriving cold on a page full of links they have to parse. A seasonal page for a holiday collection that opens with a full-screen atmospheric image and auto-advances after four seconds gives the audience a branded moment that feels intentional rather than accidental. An age verification gate for adult content is legally and ethically necessary, not optional — the splash serves a function the visitor expects and accepts. In all three cases, the friction is justified because the splash delivers something: confirmation, atmosphere, or consent.
The Splash Screen performs badly when it is used as decoration. A creator who adds a splash screen because they think it "looks professional" is adding friction without value. The visitor who clicked from Instagram does not care about a branded loading animation — they care about the content on the other side. Any second spent on a splash that is not delivering information, atmosphere, or a required gate is a second the visitor is measuring against their patience. On mobile, where page abandonment is highest and attention windows are shortest, unearned friction is especially costly. Run the Splash Screen when the context earns it, and remove it when the campaign is over.
Troubleshooting
| Problem | Likely cause | Fix |
|---|---|---|
| Splash screen does not appear — visitors go straight to the main page | Block saved but page not published, or splash is disabled in the block settings | Confirm the splash block is toggled on in the block settings; click Publish Page in the Dashboard; test in an incognito tab to simulate a fresh visitor |
| Video background is black or not playing | Video file too large, unsupported format, or the browser blocked autoplay | Use an MP4 file under 10 MB encoded at H.264; ensure the mute toggle is enabled — browsers block autoplay for videos with audio; add a static image as a fallback background |
| CTA button does not advance past the splash | A destination URL was entered that the browser blocked, or the page was not published after the button URL was changed | If the button is meant to advance to the main page (not an external URL), clear the URL field and leave it blank; republish and retest |
| Auto-advance timer not working — splash stays indefinitely | Timer value left at zero or not saved, or page not republished after changing the timer setting | Open block settings, confirm the timer field has a positive integer value, save, and republish; test by waiting on the splash without clicking the CTA |
| Splash looks correct on desktop but broken on mobile — text overflows or image crops poorly | Image not optimized for mobile aspect ratio, or headline text too long for narrow screens | Use a 9:16 or square image crop for the background; shorten the headline to five words or fewer; preview the splash on a simulated mobile viewport before publishing |
| Returning visitors always see the splash on every visit | Splash block configured to show on every visit, or no frequency suppression is set | Check the block's frequency settings and adjust to "once per session" or "once ever" if you do not want returning visitors to see the splash repeatedly; for campaign splashes, consider setting an end date and disabling the block after the campaign |
| No skip option visible — visitors feel trapped on the splash | Skip button toggle is off in the block settings | Enable the skip button in block settings and label it clearly ("Skip intro" or "Go to page"); always provide an escape route unless the splash serves a mandatory gate purpose like age verification |
Best fit for
- Creators launching a product drop or new collection who want a full-screen branded moment that primes the visitor to buy before they reach the product links
- Artists, musicians, or event organizers using the bio page as an event-specific landing experience where atmosphere and anticipation are part of what they are selling
- Pages serving adult or age-restricted content where a consent or age verification gate is required before showing the main content
- Seasonal campaigns (holiday collection, limited-time drop, exclusive event) where the page is intentionally different for a defined window and the splash signals that change to returning visitors
Not the right tool if
- Your page is an everyday link-in-bio page with social links, a contact button, and your latest posts — the friction the Splash Screen adds is not earned and will reduce the number of visitors who reach your content
- Your audience is primarily returning visitors who already know your page — a splash they have seen multiple times is irritating, not branded; use the Welcome Message with "once ever" frequency instead
- You want to collect emails before visitors see your content — the Welcome Message block with email capture is better suited for this because it shows the page behind the popup, which gives the visitor context for what they are subscribing to
- Your mobile traffic is high and you plan to use a video background with audio — autoplay with audio is blocked on iOS and Android by default, leaving mobile visitors on a non-functional splash screen
Frequently asked questions
What is the difference between the Splash Screen block and the Welcome Message block?
The Splash Screen replaces your page entirely until the visitor advances — they cannot see or interact with any of your content until they click through or the auto-advance timer expires. The Welcome Message is a popup overlay that appears on top of your page — the visitor can see your page behind it and accesses it immediately after closing the popup. Splash Screen is higher friction and appropriate for intentional gates. Welcome Message is lower friction and better for announcements, email capture, and general greetings. When in doubt, the Welcome Message is the safer default because it does not block access to your content.
Can I make the Splash Screen appear only on the first visit and not on return visits?
Yes, check the frequency settings in the Splash Screen block configuration. Options typically include every visit, once per session, and once ever. The "once ever" setting suppresses the splash after the first view using a browser cookie — returning visitors go straight to your main page. This option works well for campaign splashes where you want the initial arrival to feel special but do not want to interrupt regular visitors on subsequent sessions.
Can the Splash Screen CTA button send visitors to an external page instead of advancing to my bio page?
Yes. The CTA button URL field accepts any valid URL — you can send visitors to an external product page, a registration form, a streaming platform, or any other destination. If the URL field is left blank, the button simply advances the visitor to your main bio page. This gives you flexibility: the Splash Screen can function as a standalone entry page where the primary CTA sends visitors off-site, with the bio page available as a secondary destination via the skip link.
My video background is not playing on iPhone. How do I fix this?
iOS Safari blocks autoplay for any video that is not explicitly muted. Open your Splash Screen block settings and confirm the video mute toggle is enabled. If the toggle is on and video still fails to play, the file format may be the issue — iOS supports H.264 MP4 most reliably; avoid WebM or other formats that iOS handles inconsistently. A practical fallback: upload a high-quality static image as the background alongside the video; if the video fails to load, the image renders instead and the visitor still gets a visually complete splash screen.
Should I use the Splash Screen for my regular everyday bio page?
No. The Splash Screen is designed for moments — launches, events, seasonal campaigns — where the gate is contextually justified. For an everyday bio page where visitors are coming to find your links, check your latest content, or contact you, the Splash Screen adds friction without purpose. Use it for a defined campaign window, then remove or disable the block when the campaign ends. Your regular page visitors are the people most likely to engage with your content repeatedly over time; unnecessary friction in their path reduces how often they come back.
- The Splash Screen replaces your entire page until the visitor advances — it is a full gate, not a popup overlay, and the friction it adds is only worth it when the context demands a deliberate entry moment.
- Always include either an auto-advance timer or a skip button — a splash with no way forward and no timer traps visitors and causes tab abandonment; the escape route is not optional for atmospheric splashes.
- Video backgrounds must be muted to autoplay reliably on mobile browsers — iOS and Android block autoplay for audio-enabled video by default, which means an unmuted video background produces a broken experience for the majority of mobile visitors.
- The CTA button label is the most important copy element on the splash — write it as a specific action word that describes what happens when clicked, not a generic placeholder like "Continue" or "Click here."
- Use the Splash Screen for campaign windows with a defined start and end — launch week, event day, holiday drop — and disable or remove the block when the campaign is over to avoid friction fatigue from your returning audience.
Ready to make your page arrival feel like an event? Create your free UniLink page and add a Splash Screen block for your next launch or campaign — a full-screen intro that primes your audience before they reach your content.