# Hotspot graphic popup style customisation

**URL:** <https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204>\
**Category:** General Help\
**Created:** [August 16, 2018, 3:57pm UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204 "2018-08-16T15:57:02Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![Angela\_Gigica](https://avatars.discourse-cdn.com/v4/letter/a/a8b319/32.png) [@Angela\_Gigica](https://community.evolveauthoring.com/u/Angela_Gigica)\
**Post date:** [August 16, 2018, 3:57pm UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/1 "2018-08-16T15:57:02Z")

</div>

I’ve been going around in circles trying to customise the ‘close’ button colour on the pop-ups of of the hotspots of my graphic. I checked the style for the article, the style for the button in the theme…  
I checked the component item style… I can’t find where the settings are for this.  
can anyone point me in the right direction? many thanks!

 ![36](https://canada1.discourse-cdn.com/flex031/uploads/evolveauthoring/original/1X/64a7a056c3965115498e4a2c060d86faa7deb9b0.png)

---

<div class="post-metadata">

**Author:** ![appitierre](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/appitierre/32/10_2.png) [@appitierre](https://community.evolveauthoring.com/u/appitierre)\
**Post date:** [August 21, 2018, 3:25pm UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/2 "2018-08-21T15:25:53Z")

</div>

Hello @Angela_Gigica - this is probably coming from inside an Article Style . Click on the relevant article style \> Element \> Button.

The attached screenshot provides some context.

 ![16](https://canada1.discourse-cdn.com/flex031/uploads/evolveauthoring/original/1X/677c64ed5bfe2fa637254f9f74ffd652b3a417ea.jpeg)

Also as you develop with a theme consider toggling “Show Article Style Labels in Preview” from under the General settings in your theme. This will display labels on articles showing which Article Style is being used. They are not included in a published course, so your learner won’t see them.

---

<div class="post-metadata">

**Author:** ![Angela\_Gigica](https://avatars.discourse-cdn.com/v4/letter/a/a8b319/32.png) [@Angela\_Gigica](https://community.evolveauthoring.com/u/Angela_Gigica)\
**Post date:** [August 21, 2018, 5:01pm UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/3 "2018-08-21T17:01:08Z")

</div>

Thank you, that’s quite handy being able to see which style I’ve used for each element.

---

<div class="post-metadata">

**Author:** ![Steve](https://avatars.discourse-cdn.com/v4/letter/s/f19dbf/32.png) [@Steve](https://community.evolveauthoring.com/u/Steve)\
**Post date:** [December 10, 2020, 3:33am UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/4 "2020-12-10T03:33:09Z")

</div>

I’ve running batty as well. None of my button styles are lining up with the hot spot button. I’ve applied multiple styles and none have the colour I’m seeing in the pop up. Any further help is much appreciated.

---

<div class="post-metadata">

**Author:** ![hbailey](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/hbailey/32/603_2.png) [@hbailey](https://community.evolveauthoring.com/u/hbailey)\
**Post date:** [December 10, 2020, 10:11am UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/5 "2020-12-10T10:11:06Z")

</div>

Hi Steve!

The hot-graphic pop-ups are notifications - so you need to change the Notification Dialog settings for this button. They can be found in the main Theme settings list.

 ![image](https://canada1.discourse-cdn.com/flex031/uploads/evolveauthoring/original/1X/298868370294836037562bedf81683ba6c7f27e3.png)

Hope that helps!

---

<div class="post-metadata">

**Author:** ![Steve](https://avatars.discourse-cdn.com/v4/letter/s/f19dbf/32.png) [@Steve](https://community.evolveauthoring.com/u/Steve)\
**Post date:** [December 10, 2020, 3:49pm UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/6 "2020-12-10T15:49:50Z")

</div>

You are my saviour! I think I checked everywhere but there.

Unrelated question, that is somewhat relevant. The dialogue isn’t passed accessibility muster. I want to display the content inline. but below the image (not above). I think it’s confusing (and looks terrible to have it above). Is there a way to put it below?

---

<div class="post-metadata">

**Author:** ![hbailey](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/hbailey/32/603_2.png) [@hbailey](https://community.evolveauthoring.com/u/hbailey)\
**Post date:** [December 14, 2020, 10:03am UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/7 "2020-12-14T10:03:06Z")

</div>

Hi Steve,

Do you mean the dialog pop up when one clicks on a hotspot within the hotgraphic?

---

<div class="post-metadata">

**Author:** ![Steve](https://avatars.discourse-cdn.com/v4/letter/s/f19dbf/32.png) [@Steve](https://community.evolveauthoring.com/u/Steve)\
**Post date:** [December 17, 2020, 9:11pm UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/8 "2020-12-17T21:11:43Z")

</div>

Hey, sorry missed this coming in.  
Yes, hotspot in the hotgraphic. I ended up contacting support on this, and they confirmed it only displays above (which makes no sense to me - but maybe if I saw it below, it would make less sense.

S

---

<div class="post-metadata">

**Author:** ![DonnaWestwood](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/donnawestwood/32/367_2.png) [@DonnaWestwood](https://community.evolveauthoring.com/u/DonnaWestwood)\
**Post date:** [July 8, 2021, 12:38pm UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/9 "2021-07-08T12:38:38Z")

</div>

Hello! any idea if you can change the border radius for this close button? All my other buttons have rounded edges? Thanks!!

---

<div class="post-metadata">

**Author:** ![hbailey](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/hbailey/32/603_2.png) [@hbailey](https://community.evolveauthoring.com/u/hbailey)\
**Post date:** [July 13, 2021, 11:16am UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/10 "2021-07-13T11:16:57Z")

</div>

Hi Donna,

This button is taken from the base Button settings of the Theme - see below.

![image](https://canada1.discourse-cdn.com/flex031/uploads/evolveauthoring/original/1X/148b0991b9277ddfd293c3aeaa18d96d7fbf861c.png)

---

<div class="post-metadata">

**Author:** ![DonnaWestwood](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/donnawestwood/32/367_2.png) [@DonnaWestwood](https://community.evolveauthoring.com/u/DonnaWestwood)\
**Post date:** [July 13, 2021, 12:52pm UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/11 "2021-07-13T12:52:45Z")

</div>

Thank you so much!! Very helpful!! 🙂

---

<div class="post-metadata">

**Author:** ![Clipp](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/clipp/32/890_2.png) [@Clipp](https://community.evolveauthoring.com/u/Clipp)\
**Post date:** [May 5, 2022, 1:57am UTC](https://community.evolveauthoring.com/t/hotspot-graphic-popup-style-customisation/204/12 "2022-05-05T01:57:21Z")

</div>

Legend, have spend over an hour trying to find this within the Article Styles
