# Tags position and visibility

**URL:** <https://community.elfsight.com/t/tags-position-and-visibility/141191>\
**Category:** Customization\
**Tags:** event-calendar\
**Created:** [November 6, 2025, 2:25pm UTC](https://community.elfsight.com/t/tags-position-and-visibility/141191 "2025-11-06T14:25:43Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Info\_at\_BEST](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/info_at_best/32/38257_2.png) [@Info\_at\_BEST](https://community.elfsight.com/u/Info_at_BEST)\
**Post date:** [November 6, 2025, 2:25pm UTC](https://community.elfsight.com/t/tags-position-and-visibility/141191/1 "2025-11-06T14:25:43Z")

</div>

1. Is there a way via custom CSS i can hide the tags from showing on the events tiles but still show in the popup when viewing just one selected event?

2. Is there a way to order the content on the event popup so that the tags show below the event description rather than above the event description?

---

<div class="post-metadata">

**Author:** ![Info\_at\_BEST](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/info_at_best/32/38257_2.png) [@Info\_at\_BEST](https://community.elfsight.com/u/Info_at_BEST)\
**Post date:** [November 6, 2025, 2:32pm UTC](https://community.elfsight.com/t/tags-position-and-visibility/141191/2 "2025-11-06T14:32:38Z")

</div>

I got the tags to hide on the event tiles but still show on the popup using the below:

/\* Tags display\*/  
.eapp-events-calendar-tags-component {  
display: none;  
}

So now just need help with the order of the content in the actual popup!

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [November 6, 2025, 2:59pm UTC](https://community.elfsight.com/t/tags-position-and-visibility/141191/4 "2025-11-06T14:59:49Z")

</div>

Here is the CSS code to change the order of the tags and description in the popup:

```auto
.global-styles,
.eapp-events-calendar-modal-modalContent .eapp-events-calendar-popup-item-inner {
  display: flex;
  flex-direction: column;
}
.global-styles,
.eapp-events-calendar-modal-modalContent [class*="edit-item-button__Container-sc"] {
  order: 1
}
.global-styles,
.eapp-events-calendar-modal-modalContent .eapp-events-calendar-close-component {
  order: 2;
}
.global-styles,
.eapp-events-calendar-modal-modalContent .eapp-events-calendar-popup-item-header {
  order: 3
}
.global-styles,
.eapp-events-calendar-modal-modalContent .eapp-events-calendar-popup-item-media {
  order: 4
}
.global-styles,
.eapp-events-calendar-modal-modalContent .eapp-events-calendar-tags-component {
  order: 6;
}
.global-styles,
.eapp-events-calendar-modal-modalContent .eapp-events-calendar-popup-item-description {
  order: 5;
  margin-bottom: 20px;
}
.global-styles,
.eapp-events-calendar-modal-modalContent .eapp-events-calendar-popup-item-row {
  order: 7;
}
.global-styles,
.eapp-events-calendar-modal-modalContent .eapp-events-calendar-popup-item-mapContainer {
  order: 8;
}
.global-styles,
.eapp-events-calendar-modal-modalContent .eapp-events-calendar-organizer-component {
  order: 9
}
.global-styles,
.eapp-events-calendar-modal-modalContent .eapp-events-calendar-divider-component {
  order: 10;
}

```

  

Please add it to the Custom CSS field and let me know if it worked 😉

As for showing/hiding tags, you don’t have to use a CSS code since the widget includes options to control the display of the widget elements in the event cards and popups:

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/1/3/13f94bf97a5fe242ca386b0cb562cad3f3a0ea5e.png) ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/7/c/7c208194d588b1751546dad4b0a2dd9b1d8e4fd1.png)

  

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/1/9/190d1d66ff67e2275fc5ad6ead4bfe7bf3b56eab.png) ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/7/7/7731d5bdddcdb6dceee4d72ef078eb9e94647e1a.png)