Site and page editors can use the following cards to display a variety of content directly on their sites and pages, including dashboards, stories, documents, and even other sites and pages:
- Gallery card—Display a variety of content or events, including those that are part of a site, initiative, or project catalog, and public or organizational content that is not shared to a catalog. This card is mobile responsive, meaning content will display correctly on any size of device.
License:
The events feature requires a license to ArcGIS Hub Premium. - Category card—Display datasets and other content types by category (a pre-filtered search of your site catalog by groups, tags, or categories). Choose an icon to represent each category you create.
- Map card—Display a web map or web scene on your site. Using row card settings, you can adjust its display to span the entirety of your site or display it next to other content at a fixed width.
- Application card—Displays a supported ArcGIS application, such as web apps, dashboards, Insights pages, Experience Builder web apps, and storymaps.
Note:
Displaying content on a site or page does not automatically add the item or items to the site's content catalog. When using the Gallery, Map, and Application card, you must also add the item to your site's content catalog if you want it to be discoverable in your site's search results. For more information, refer to Add existing content.
Common items displayed on sites and pages include dashboards, stories, and web maps. These items are created and managed in ArcGIS Online. When populating a card with content, you can choose from your own content or content that's been shared with your groups, your organization, or the public.
Display a gallery of content
Use the Gallery card to display content items or events with their thumbnail and summary. Visitors can open an item in a gallery by selecting the item's card. Populate the gallery using a content or event catalog, or by selecting individual items. You can also use a variety of filters to configure a Gallery card such as type, sharing level, tags, groups, and more.
To display a gallery of content or events, complete the following steps:
- Open a site or page in edit mode.
- On the Customize panel, select Layout.
- Drag a Gallery card onto a row in the layout.
- Under Select type, choose Content to add content or choose Events to add events.
Note:
If you change the type selection, the following fields will reset: Filters, Default layout, Layout options.
- Under Select source, choose one of the following options:
- All content or All events—Search all that you can access.
- Catalog—Search within a specific catalog. Choose Select catalog, select a catalog and select Add.
Note:
If you change the source selection, the Filters field will reset.
- Select a sort method under Sort by and select a sort order under Sort order.
- To limit the number of content items or events that display, enter a value under Limit results.
- To narrow results, select Filters and set a Parameter, Criteria, and value (depends on selected parameter). Select Create filter to add additional filters.
Note:
For manual selections, you can change the display order. - Select Appearance and configure the following settings:
- Select Layout to set the default display style and styles available for visitors to choose.
- Select Cards and choose a heading size, image type, thumbnail display option, and settings for corners, drop shadow, and buttons.
- Select Options to choose whether the card opens in the same tab or a new tab with the Open in... setting.
- Select Save layout.
Display categories of data
Use icons to represent related content, such as Hydrology to represent datasets, web maps, and applications that have either been assigned related tags or organized into groups.
To display categories of data, complete the following steps:
- Open a site or page in edit mode.
- On the Customize panel, select Layout.
- Drag a Category card onto a row in the layout.
- Under the Data menu, choose one of the following options:
- Tag query—Enter a tag query. All datasets with this tag on their respective ArcGIS Online item will be returned in search results.
- Category query—Identify Categories that your organization has established.
- Group—Select a group. All datasets in this group will be returned in the search results.
- Edit the link text for your category.
- To represent your category with an icon from the library:
- Select Choose from library and select Pick an icon.
- Choose an icon and choose Select.
- Select the box to the right of the icon to change the color.
- To use your own
icon:
- Select Provide URL for your own and enter the URL.
- Provide Alt text for the icon to help non-sighted users and improve your site’s accessibility.
Note:
Custom icons should be saved as a .svg or transparent .png file. Icons will be scaled to fit 120x120 pixels. - Select Save layout.
Display a map
Use the Map card to display a web map or web (3D) scene directly on the site or page.
Note:
If you're currently using an Iframe card to embed a web map or web scene, consider using the Map card instead, as it is easier to configure and is more performant.
To display a map, complete the following steps:
- Open a site or page in edit mode.
- On the Customize panel, select Layout.
- Drag a Map card onto a row in the layout.
- Choose Select map.
- Find a map by searching or using filters, select a map, and select Save.
- To display a title, select the toggle button for Title, edit as needed, and choose alignment.
- Set a height value for Height (in pixels).
- Select Enable map legend to display a legend.
- Select Hide on mobile if you don't have a mobile version of the map.
If you have a version of the item that's better suited for mobile devices, you can add the item under the Mobile option and use the Default option for the original item.
- Select the toggle buttons for Enable sharing, and Button always visible, if needed.
- Select Save layout.
Display an application
Use the Application card to display an item directly on the site or page. The following items are supported:
- Apps—applications, forms (Survey123), and web mapping applications
- Documents—PDF, Microsoft Excel, Microsoft PowerPoint, iWork Keynote, iWork Pages, iWork documents, and Visio documents
- Datasets
- Dashboards
- Sites and pages
To display an application, complete the following steps:
- Open a site or page in edit mode.
- On the Customize panel, select Layout.
- Drag an Application card onto a row in the layout.
- Choose Select application.
- Find an application by searching or using filters, select an application, and select Save.
- Set a Height value (in pixels).
- Enable scrolling by turning on Auto.
Tip:
Scrolling is not always suitable on mobile devices as a user may be unable to pass over the application. Ensure that a scrollable iframe works on a mobile device before applying your changes. - Select Hide on mobile if you don't have a mobile version of the application.
If you have a version of the item that is more suitable for mobile devices, you can add the item under the Mobile option and use the Default option for the original item.
- Select the toggle buttons for Enable sharing and Button always visible, if needed.
- Select Save layout.