# How to force the theme for viewers on specific articles

**URL:** <https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534>\
**Category:** Themes\
**Created:** [April 15, 2020, 11:54am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534 "2020-04-15T11:54:08Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![rrapp](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/rrapp/32/7340_2.png) [@rrapp](https://forum.ghost.org/u/rrapp)\
**Post date:** [April 15, 2020, 11:54am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/1 "2020-04-15T11:54:08Z")

</div>

It seems that the default mode (light or dark) of Ghost depends on the default settings of the device accessing the website. Is there a way to force the theme for readers on a specific article?

---

<div class="post-metadata">

**Author:** ![Stromfeldt](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/stromfeldt/32/13572_2.png) [@Stromfeldt](https://forum.ghost.org/u/Stromfeldt)\
**Post date:** [April 15, 2020, 12:10pm UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/2 "2020-04-15T12:10:10Z")

</div>

Are Custom Templates what you’re looking for?

[https://ghost.org/tutorials/custom-page-templates/](https://ghost.org/tutorials/custom-page-templates/)

---

<div class="post-metadata">

**Author:** ![thebear.dev](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/thebear.dev/32/13956_2.png) [@thebear.dev](https://forum.ghost.org/u/thebear.dev)\
**Post date:** [May 8, 2021, 5:45am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/3 "2021-05-08T05:45:03Z")

</div>

I think that @rrapp, just like me, is looking for a way to force either dark or light mode upon the user. If you know how, please share.

I would love to apply dark mode as the default mode.

---

<div class="post-metadata">

**Author:** ![Stromfeldt](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/stromfeldt/32/13572_2.png) [@Stromfeldt](https://forum.ghost.org/u/Stromfeldt)\
**Post date:** [May 8, 2021, 6:03am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/4 "2021-05-08T06:03:09Z")

</div>

Yes, but they stated that they’re looking to

> [@rrapp](#):
>
> force the theme for readers on a specific article

not the entire site. Hence a custom post template that can be selected post by post.

But then again, if I recall correctly I’ve seen minimaluminium or somebody else point out that one can inject a few JS lines into code injection in order to disable/enable dark/light mode, which I suppose could in place be added into _post_ code injection on a case by case basis.

---

<div class="post-metadata">

**Author:** ![thebear.dev](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/thebear.dev/32/13956_2.png) [@thebear.dev](https://forum.ghost.org/u/thebear.dev)\
**Post date:** [May 8, 2021, 6:25am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/5 "2021-05-08T06:25:45Z")

</div>

Okay. If you have an injection that disables light mode and forces dark, please share it. @minimaluminium do you by any chance have an injection for it?

---

<div class="post-metadata">

**Author:** ![Stromfeldt](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/stromfeldt/32/13572_2.png) [@Stromfeldt](https://forum.ghost.org/u/Stromfeldt)\
**Post date:** [May 8, 2021, 6:33am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/6 "2021-05-08T06:33:57Z")

</div>

There wouldn’t be a broad-based code injection for that across all themes, it would be based specifically on how light/dark mode was set up for each individual theme.

---

<div class="post-metadata">

**Author:** ![thebear.dev](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/thebear.dev/32/13956_2.png) [@thebear.dev](https://forum.ghost.org/u/thebear.dev)\
**Post date:** [May 8, 2021, 6:52am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/7 "2021-05-08T06:52:24Z")

</div>

Okay. I’m using Dawn but I am in the process of switching over to Ease. Do you, by any chance, have a injection for Ease?

---

<div class="post-metadata">

**Author:** ![Stromfeldt](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/stromfeldt/32/13572_2.png) [@Stromfeldt](https://forum.ghost.org/u/Stromfeldt)\
**Post date:** [May 8, 2021, 6:58am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/8 "2021-05-08T06:58:47Z")

</div>

Nope, but dark mode for those two themes may be coded the same as I think they were both designed by minimaluminium. Go through his comment history (which I don’t think would be all that long) and you may find something. Then again that code may have been mentioned by Kevin, whose comment history is of course rather long. Or alternatively do a search or two.

---

<div class="post-metadata">

**Author:** ![thebear.dev](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/thebear.dev/32/13956_2.png) [@thebear.dev](https://forum.ghost.org/u/thebear.dev)\
**Post date:** [May 8, 2021, 7:00am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/9 "2021-05-08T07:00:07Z")

</div>

Yep, cool. Thanks!

---

<div class="post-metadata">

**Author:** ![minimaluminium](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/minimaluminium/32/2652_2.png) [@minimaluminium](https://forum.ghost.org/u/minimaluminium)\
**Post date:** [May 10, 2021, 2:54am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/10 "2021-05-10T02:54:40Z")

</div>

For Dawn theme, to make it dark globally, this script can be used in the injection.

```auto
<script>
    localStorage.setItem('dawn_theme', 'dark');
</script>

```

But when we use it in a post specific code injection, it won’t work as expected. Because once a reader visits the post, the theme will be dark globally.

To make it work for a specific post, we can inject the class of `<html>` element. By adding this in a post specific code injection, the dark mode will only work on that post, not globally.

```auto
<script>
    document.documentElement.classList.add('theme-dark');
</script>

```

Please note that this is only for Dawn theme. Ease theme doesn’t have dark mode feature.

---

<div class="post-metadata">

**Author:** ![thebear.dev](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/thebear.dev/32/13956_2.png) [@thebear.dev](https://forum.ghost.org/u/thebear.dev)\
**Post date:** [May 10, 2021, 4:43am UTC](https://forum.ghost.org/t/how-to-force-the-theme-for-viewers-on-specific-articles/13534/11 "2021-05-10T04:43:20Z")

</div>

Thank you.