Hello! I’m working on editing a post with a lot of inline code blocks. As far as I can remember I created them all using three backticks in the editor, like ```.
Looking at my page in my theme (source) I see one code block that has different margins than the others. I checked to see why, and it seems like most of my code blocks are enclosed in a “pre” and a “code”, which makes sense to me. The different code block has the same tags but they’re enclosed in a <figure class=“kg-card kg-code-card”>.
I like the margins better on the figure version.
My question is, how did I create that? I don’t see a “code” option in the menu when I click the little plus symbol in the editor, is there some other way to create these?
The figure version is what you should see if you use ``` to create a code card in the editor. I’m not sure how you got just <pre><code> without the figure wrapper unless your earlier posts were all written inside a markdown card?
Aha, thanks! I just edited that post, created a code block with with ```, hit the “Update” button and I still get the version that is not wrapped in a code card. So, it seems reproducible for me. I’m using the hosted version with Ghost Pro.
I didn’t originally create these inside a markdown card, but thinking back I think it went like this.
I wrote the post as a draft and entered the one code box that is a code card. I made some quote cards listing lines of the code from the box. Then I published. Later I came back, added primsjs to the site, and yesterday I decided I wanted to edit the post to make the quote cards into code instead, so I edited the published post, created new code sections with ```, and used the Update button to update the published post. Each of these new code sections are not in cards.
When I tried again just now I also edited the published post. Is creating it before publish the difference here?
I posted too soon! Just to test that theory I just created a new post, entered a few code blocks with ``` and entered some text, and published. The published version is also not creating figure cards to wrap the <pre><code> elements