# Creating Themes Guide

**URL:** <https://community.evolveauthoring.com/t/creating-themes-guide/615>\
**Category:** General Help\
**Created:** [October 10, 2019, 7:37am UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615 "2019-10-10T07:37:09Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![Dave\_Galvin](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/dave_galvin/32/299_2.png) [@Dave\_Galvin](https://community.evolveauthoring.com/u/Dave_Galvin)\
**Post date:** [October 10, 2019, 7:37am UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/1 "2019-10-10T07:37:09Z")

</div>

Hi - I am trying to create theme to represent my company’s branding. For the most part things are ok. However, there are some elements I can’t seem to change; I’m obviously editing the wrong area. There are so many options.  
When this happens I take a look at the element selector tool in Chrome (ctrl + alt + i), to look at the HTML and CSS. Only sometimes does this work for me. Is there another way of using this tool to help me pinpoint the correct elements? Or, is there another way?

Thanks

---

<div class="post-metadata">

**Author:** ![Malte\_Weber1](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/malte_weber1/32/198_2.png) [@Malte\_Weber1](https://community.evolveauthoring.com/u/Malte_Weber1)\
**Post date:** [October 10, 2019, 8:06am UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/2 "2019-10-10T08:06:11Z")

</div>

Hey Dave!  
I’m in the same situation right now. If you go into the preview mode of the course you will find a separate Evolve inspector in the bottom right corner. Nevertheless, I can only join you - I still have buttons or Accordion Menu Drop Downs in my test course with the wrong colors, because I can’t find the right settings.

---

<div class="post-metadata">

**Author:** ![Dave\_Galvin](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/dave_galvin/32/299_2.png) [@Dave\_Galvin](https://community.evolveauthoring.com/u/Dave_Galvin)\
**Post date:** [October 10, 2019, 10:08am UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/3 "2019-10-10T10:08:49Z")

</div>

Hi Malte - thanks for your message, it’s good to know it’s not just me 🙂 The Evolve inspector was a good shout, thanks for that. I will give that a try and let you know.

---

<div class="post-metadata">

**Author:** ![Muhammad\_Daniel](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/muhammad_daniel/32/300_2.png) [@Muhammad\_Daniel](https://community.evolveauthoring.com/u/Muhammad_Daniel)\
**Post date:** [October 12, 2019, 11:22am UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/4 "2019-10-12T11:22:47Z")

</div>

Hi, best way I find to keep things clear is to use Article styles. Then you can apply different styles to different articles and enable show styles in Live Preview to see what styles are being used easily. Then focus in on the different elements of that style in the theme without it affecting other article styles.

Hope that helps!

Muhammad

---

<div class="post-metadata">

**Author:** ![Dave\_Galvin](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/dave_galvin/32/299_2.png) [@Dave\_Galvin](https://community.evolveauthoring.com/u/Dave_Galvin)\
**Post date:** [October 14, 2019, 7:39am UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/5 "2019-10-14T07:39:17Z")

</div>

Hi Muhammad,

Thanks for the tips. I have started creating Article styles for different requirements, this seems to be a good way of editing.

Dave

---

<div class="post-metadata">

**Author:** ![Muhammad\_Daniel](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/muhammad_daniel/32/300_2.png) [@Muhammad\_Daniel](https://community.evolveauthoring.com/u/Muhammad_Daniel)\
**Post date:** [October 14, 2019, 8:07am UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/6 "2019-10-14T08:07:15Z")

</div>

Hi Dave,

You’re welcome 🙂

Yeh article styles are good - you can even do different background images for them if you’re feeling really fancy!

Feel free to ask if you need any tips - been working with Evolve a few years now so have come across most issues… it’s a great tool but sometimes bit obscure…

Muhammad

---

<div class="post-metadata">

**Author:** ![Dave\_Galvin](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/dave_galvin/32/299_2.png) [@Dave\_Galvin](https://community.evolveauthoring.com/u/Dave_Galvin)\
**Post date:** [October 15, 2019, 1:06pm UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/7 "2019-10-15T13:06:33Z")

</div>

Hi Muhammad,

Thanks for getting back to me. I’m sorry for messaging you again, but do you know how I can change the colours on the hot graphic pulsing buttons? I have looked everywhere, and I when I think I have found the answer, it doesn’t work.

Many thanks  
Dave

---

<div class="post-metadata">

**Author:** ![Muhammad\_Daniel](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/muhammad_daniel/32/300_2.png) [@Muhammad\_Daniel](https://community.evolveauthoring.com/u/Muhammad_Daniel)\
**Post date:** [October 15, 2019, 1:33pm UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/8 "2019-10-15T13:33:07Z")

</div>

No worries - in your article style, go to ‘Component Item’ element, then ‘Appearance’ and change the Component Item Background Colors

---

<div class="post-metadata">

**Author:** ![Dave\_Galvin](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/dave_galvin/32/299_2.png) [@Dave\_Galvin](https://community.evolveauthoring.com/u/Dave_Galvin)\
**Post date:** [October 15, 2019, 1:47pm UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/9 "2019-10-15T13:47:13Z")

</div>

Thanks Muhammad - I’m not sure if some settings are overiding what I am trying to do. I can’t seem to change the colours for the circle buttons. I was able to edit the colour of the pop up box and text.

---

<div class="post-metadata">

**Author:** ![Muhammad\_Daniel](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/muhammad_daniel/32/300_2.png) [@Muhammad\_Daniel](https://community.evolveauthoring.com/u/Muhammad_Daniel)\
**Post date:** [October 15, 2019, 2:02pm UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/10 "2019-10-15T14:02:51Z")

</div>

Hmm not sure then - that works for me! Best to put in a ticket - Malcolm will get back to you pretty fast and he can what’s going on in your Evolve…

---

<div class="post-metadata">

**Author:** ![Dave\_Galvin](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/dave_galvin/32/299_2.png) [@Dave\_Galvin](https://community.evolveauthoring.com/u/Dave_Galvin)\
**Post date:** [October 15, 2019, 2:21pm UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/11 "2019-10-15T14:21:31Z")

</div>

Thanks again, will do.

---

<div class="post-metadata">

**Author:** ![LuMurray](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/lumurray/32/303_2.png) [@LuMurray](https://community.evolveauthoring.com/u/LuMurray)\
**Post date:** [October 16, 2019, 12:33pm UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/12 "2019-10-16T12:33:33Z")

</div>

Hi Muhammad

This is really helpful!

Just adding to this question, do you know if it is possible to change the size of the hot graphic icons? They look overly large on the hot graphic I have developed.

Thanks  
Lucy

---

<div class="post-metadata">

**Author:** ![Muhammad\_Daniel](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/muhammad_daniel/32/300_2.png) [@Muhammad\_Daniel](https://community.evolveauthoring.com/u/Muhammad_Daniel)\
**Post date:** [October 16, 2019, 1:01pm UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/13 "2019-10-16T13:01:41Z")

</div>

Hi Lucy,

Not as far as I know… Have you looked at using the Infographic component? It’s quite new - I use it alot not… allows hidden hotspots etc which is pretty cool!

Kind regards,

Muhammad

---

<div class="post-metadata">

**Author:** ![LuMurray](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.evolveauthoring.com/lumurray/32/303_2.png) [@LuMurray](https://community.evolveauthoring.com/u/LuMurray)\
**Post date:** [October 16, 2019, 8:53pm UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/14 "2019-10-16T20:53:28Z")

</div>

Thank you, I shall have a look again, but I don’t think it is a current option. I like the sound of the hidden hotspots.

---

<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:** [October 29, 2019, 10:14am UTC](https://community.evolveauthoring.com/t/creating-themes-guide/615/15 "2019-10-29T10:14:52Z")

</div>

Don’t think this is an option according to available settings.
