# Casper theme and headings

**URL:** <https://forum.ghost.org/t/casper-theme-and-headings/11640>\
**Category:** Developer help\
**Created:** [January 28, 2020, 8:48am UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640 "2020-01-28T08:48:08Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![rajiin](https://avatars.discourse-cdn.com/v4/letter/r/97f17d/32.png) [@rajiin](https://forum.ghost.org/u/rajiin)\
**Post date:** [January 28, 2020, 8:48am UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640/1 "2020-01-28T08:48:08Z")

</div>

So I have been writing some content to my ghost 3.3.0 server and yesterday I noticed some inconvenience with the headings in posts, and the way they are used in other places.

I noticed this because I was making a minor change to the h1 and h2 as in

```
<style>
     h1 { text-transform: uppercase; }
     h2 { text-transform: uppercase; }
</style> 

```

and then I realised that in the post editor, the help text says heading 1, but it is actually heading 2, and on the heading 2 help text, is actually heading 3. This is of course a minor issue once you know, and I haven’t written that much text yet to be a real issue, but I also noticed that the heading tags are used in other places as well, and the one that bugs me the most is the "h2 class=“site-description” that is used in the category page,shouldn’t that just be a paragraph?.

Changing the help text in the editor would also be beneficial I think

---

<div class="post-metadata">

**Author:** ![DavidDarnes](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/daviddarnes/32/3533_2.png) [@DavidDarnes](https://forum.ghost.org/u/DavidDarnes)\
**Post date:** [January 28, 2020, 9:30am UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640/2 "2020-01-28T09:30:56Z")

</div>

I’m not quite sure what you’re referring to, do you mean the headings in the editor are labelled wrong? Or do you mean the headings showing on your site? If you mean the editor then that may be just for presentation, and won’t have an affect on the content in the front-end. If you mean your site then you’re welcome to make edits to your theme by downloading it via the Design view in Ghost admin 🙂

Editing that `site-description` you mention can also be done in the theme 🖌

---

<div class="post-metadata">

**Author:** ![rajiin](https://avatars.discourse-cdn.com/v4/letter/r/97f17d/32.png) [@rajiin](https://forum.ghost.org/u/rajiin)\
**Post date:** [January 28, 2020, 12:14pm UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640/3 "2020-01-28T12:14:00Z")

</div>

![Screenshot from 2020-01-28 13-03-57](https://us1.discourse-cdn.com/flex015/uploads/ghost2/original/2X/7/701852510e4414f0587fcea539bcde369630d69a.png)  
it says heading one, but it is actually a heading 2

I haven’t been looking into theme editing yet, and possibly I hope to hire someone to do that, I work with IT infrastructure, web development is mostly gibberish to me 🙂

---

<div class="post-metadata">

**Author:** ![DavidDarnes](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/daviddarnes/32/3533_2.png) [@DavidDarnes](https://forum.ghost.org/u/DavidDarnes)\
**Post date:** [January 28, 2020, 8:30pm UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640/4 "2020-01-28T20:30:49Z")

</div>

I think that’s just the labels when you hover the options. Here’s what happens when you hover the heading options:  
 ![Kapture 2020-01-28 at 20.29.43](https://us1.discourse-cdn.com/flex015/uploads/ghost2/original/2X/c/c02676a78b5464c60bb221f3d00cb677c716beba.gif)

---

<div class="post-metadata">

**Author:** ![rajiin](https://avatars.discourse-cdn.com/v4/letter/r/97f17d/32.png) [@rajiin](https://forum.ghost.org/u/rajiin)\
**Post date:** [January 29, 2020, 7:58am UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640/5 "2020-01-29T07:58:38Z")

</div>

yes, but the heading one makes a h2 html code, so I think it is misleading.

I made posts with the Heading Two, because I didn’t want multiple Heading One in my post, then I see that those that I thought was Heading Two, actually is Heading Three.

---

<div class="post-metadata">

**Author:** ![DavidDarnes](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/daviddarnes/32/3533_2.png) [@DavidDarnes](https://forum.ghost.org/u/DavidDarnes)\
**Post date:** [January 29, 2020, 11:40am UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640/6 "2020-01-29T11:40:14Z")

</div>

I think you might getting confused and toggling the option the wrong way. You can generate all heading levels using markdown, like so:

```auto
# Heading one
## Heading two
### Heading three

```

The number of `#` denote the heading level 👍

---

<div class="post-metadata">

**Author:** ![vikaspotluri123](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/vikaspotluri123/32/24_2.png) [@vikaspotluri123](https://forum.ghost.org/u/vikaspotluri123)\
**Post date:** [January 29, 2020, 2:01pm UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640/7 "2020-01-29T14:01:37Z")

</div>

@DavidDarnes can you try clicking the `Heading 1` icon in the WYSIWYG and inspecting the element? I’m seeing an h2 created. Using expansions works correctly 👍

---

<div class="post-metadata">

**Author:** ![DavidDarnes](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/daviddarnes/32/3533_2.png) [@DavidDarnes](https://forum.ghost.org/u/DavidDarnes)\
**Post date:** [January 29, 2020, 2:33pm UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640/8 "2020-01-29T14:33:13Z")

</div>

Ah I see the confusion here! The inline editing controls are labelled ‘Heading One’ and ‘Heading Two’ but they are actually `h2` and `h3`. This is intentionally as the post title is meant to be the only `h1` on the page. You can put a `h1` in the content if you want, but you have to use markdown 👍

---

<div class="post-metadata">

**Author:** ![rajiin](https://avatars.discourse-cdn.com/v4/letter/r/97f17d/32.png) [@rajiin](https://forum.ghost.org/u/rajiin)\
**Post date:** [January 29, 2020, 2:55pm UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640/9 "2020-01-29T14:55:32Z")

</div>

exactly

if you have a minimal understanding of html, this is misleading, and I am sure many end up like me having the title as the h1 and then h3 in the rest of the post.

I only found out because I wanted h1 and h2 uppercase, and noticed that my headings in the post didn’t become uppercase since they were actually h3.

---

<div class="post-metadata">

**Author:** ![DavidDarnes](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/daviddarnes/32/3533_2.png) [@DavidDarnes](https://forum.ghost.org/u/DavidDarnes)\
**Post date:** [January 29, 2020, 3:19pm UTC](https://forum.ghost.org/t/casper-theme-and-headings/11640/10 "2020-01-29T15:19:39Z")

</div>

While I can somewhat understand your confusion, this is the very first time I’ve seen this reported. Arguably if they were labelled as ‘Heading Two’ and ‘Heading Three’ someone _without_ HTML knowledge would look at those labels and wonder _“where is ‘Heading One’?”_. Not everyone has the same knowledge of the web 🙂