The ArcGIS Web AppBuilder app title is not displayed after resizing on a website

Description

When embedding a web app created from ArcGIS Web AppBuilder in a website and resizing the app to fit, the title of the app does not display in the title header. In the HTML source of the web page, the title display property is set to 'none'.

Cause

The space between the title and the widgets in the app is reserved. Resizing the app causes the title to be hidden from view.

Solution or Workaround

Use one of the following workarounds to resolve this issue.

Change the app theme and layout

Change the app's theme and layout to position the search bar below the title header. This provides more space for the title and avoids it from being hidden. Refer to Theme for the available themes in ArcGIS Web AppBuilder.

1. In ArcGIS Online, navigate to Content > My Content.
2. Click the ellipsis  button for the app, and click Edit Application.
3. On the Theme tab, select a theme. In this example, Jewelry Box Theme is selected.
4. In the Layout section, select a layout with the search bar below the title header.

5. Click Save.
6. Use the URL of the updated app to embed in the website.

Shorten the length or reduce the font size of the title

For the title to fit in the header when resizing the embedded app, rephrase to shorten the length or reduce the font size.

1. Repeat Steps 1 and 2 from the first workaround.
2. Click the Attribute tab.
3. Under Branding, click Customize font style .
4. In the Customize font style dialog box, type a shorter, new title. Click the drop-down arrow for Size to select a smaller font size.

5. Click OK, and click Save.
6. Use the URL of the updated app to embed in the website.