topic Re: Experience builder background images & style in ArcGIS Experience Builder Questions

Experience builder background images & style

cole_KTB — Wed, 01 Feb 2023 17:09:02 GMT

Hey there,

I want to add an image as the full page background for my experience (web version). It looks like I can only use a fill color for body contents/background. Seems silly there is no way to make a full page image background.

If this is not possible, is it possible to have an image as the background to a block, AND* overlay it with a transparent color so that text can be visible? I am able to add an image for blocks, but no other customization options seem available.

Thanks in advance for any help!

Re: Experience builder background images & style

BethAnnWinebarger — Wed, 01 Feb 2023 17:26:25 GMT

That sounds similar to something I wanted to do -- Full screen image with text over top.

How I did it (which may not be the 'best practices' method) was to use a text widget, make it full screen size, and make the background an image. I adjusted the position of the text with some blank lines. Then used Character Effects to make the white text stand out better against the picture.

Re: Experience builder background images & style

cole_KTB — Wed, 01 Feb 2023 17:58:19 GMT

Hi Beth,

Thanks for that work around. I am trying something similar with an image card, but hoping that there is a better method!

Re: Experience builder background images & style

JenniferAcunto — Wed, 01 Feb 2023 18:13:28 GMT

I've done a full page image card with a full page text card on top that had a transparent background color. Then I stacked cards on top of all that with my actual text so that I could ensure the positioning was where I wanted.

Re: Experience builder background images & style

cole_KTB — Wed, 01 Feb 2023 18:50:02 GMT

That looks really good! Yeah, so far I am using the image cards with some success, but I wish I could have a set background image with text features scrolling over the image as the user goes down the page (parallax scroll).

I do appreciate the help!

Re: Experience builder background images & style

BW44 — Tue, 24 Oct 2023 14:53:24 GMT

To add a static background image and have scrolling content layout in front of it:

Steps:

In Experienc Builder, choose "+ Create New" option.
Select the "Blank scrolling" template.
Select the blank page and turn ON the Header.
You'll see a few icons in the blank Page, hover over them and select the option to insert a screen group. Choose the Showcase template.
Keep only one Screen from the Screen Group (it will have 3 as a default).

Helpful links:

https://doc.arcgis.com/en/experience-builder/latest/build-apps/add-a-page.htm#ESRI_SECTION1_6581E275AB864FB19089D8D4D8B83E53

Hope that helps!

Re: Experience builder background images & style

AlderMaps — Wed, 24 Jan 2024 22:04:53 GMT

Just what I was looking for. I want a fullscreen background image + survey on top, but I want a scrolling page so I can have the footer (but the footer isn't intruding until one scrolls to the bottom).

I need to remind myself that not all of the goodies are sitting in the widget pane (at least, I don't see "screen" there). Thanks!