nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Example with Explanation for Inline Gallery Items

Janaki_Gattu

Hi,

I am trying to create a new inline gallery items...Could anyone help me with an example to create a Custom Inline Gallery with Custom Gallery Items.#arcgisprosdk

Trouver plus de publications taguées avec

Accepted answers

UmaHarano

Hi Janaki,

Here is a sample of an Inline Gallery in the arcgi-spro-community-samples repo. You can also find some documentation on gallery items in the wiki page.

Thanks

Uma

All comments

UmaHarano

Attached is an updated Web maps Gallery sample with the "categories".

Gallery.zip

Error1.JPG

UmaHarano

Hi Janaki

You can accomplish this by setting the Group property of GalleryItem. In the config.daml where you define the gallery element, set the "showGroup" attribute to "true". Like this:

 <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>galleries</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>gallery</SPAN> <SPAN class="attr-name token">id</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>GalleryDemo_WebMapsGallery<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">showGroup</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>true<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">caption</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>Web Maps Gallery<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">className</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>WebMapsGallery<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">itemsInRow</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>5<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">dataTemplateFile</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>pack://application:,,,/GalleryDemo;component//WebMapsGalleryTemplate.xaml<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">templateID</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>WebMapsGalleryItemTemplate<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">resizable</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>true<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">largeImage</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>Images\GenericButtonOrange32.png<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">keytip</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>z3<SPAN class="punctuation token">"</SPAN></SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>tooltip</SPAN> <SPAN class="attr-name token">heading</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>Web Maps<SPAN class="punctuation token">"</SPAN></SPAN><SPAN class="punctuation token">></SPAN></SPAN>Tooltip text<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>disabledText</SPAN> <SPAN class="punctuation token">/></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>tooltip</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>gallery</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
 <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>galleries</SPAN><SPAN class="punctuation token">></SPAN></SPAN>‍‍‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

Thanks

Uma

Janaki_Gattu

Hi Uma,

I have checked and executed the Data Reviewer Application with the Inline Gallery in it...But the items didnt get loaded in the Inline Gallery on building the solution from the given Examples....May it would load the items once we run the batch reviewer....

But My issue is I would like to create the items in the Inline Gallery with categories as similar to this.

UmaHarano

Hi Janaki,

Here is a sample of an Inline Gallery in the arcgi-spro-community-samples repo. You can also find some documentation on gallery items in the wiki page.

Thanks

Uma

Rejoindre la conversation

Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.

Liens rapides

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.