If I'm using Ghost as a data source and it provides article content in HTML code, how can I do code highlighting? about eleventy HOT 7 CLOSED

https://discord.com/channels/741017160297611315/1022195881698672650/threads/1189062692636471436
done

from eleventy.

Looks like you can't do it statically but they have a guide on syntax highlighting on the client side, see https://ghost.org/tutorials/code-snippets-in-ghost/#add-prism-via-code-injection. You can use the same code snippets in your Eleventy layouts/templates.

from eleventy.

Looks like you can't do it statically but they have a guide on syntax highlighting on the client side, see https://ghost.org/tutorials/code-snippets-in-ghost/#add-prism-via-code-injection. You can use the same code snippets in your Eleventy layouts/templates.

Can I do it if I can get the content of the article in markdown format?

from eleventy.

Yep, with the markdown content you can do it during the build instead of on the client.

from eleventy.

Yep, with the markdown content you can do it during the build instead of on the client.

But Ghost's database doesn't actually store markdown at all. It's all escaped HTML code, sigh.
Can I handle it through 11ty's Transform feature?
I tried using jsdom and prismjs library, but it failed. What should I do?

const jsdom = require('jsdom')
const { JSDOM } = jsdom
const prismjs = require('prismjs')

module.exports = (content, outputPath) => {
  if (outputPath.endsWith('.html')) {
    const DOM = new JSDOM(content)
    const document = DOM.window.document

    prismjs.highlightAll(document)

from eleventy.

Can you send your repository? What error did you get? What does the HTML look like of the code blocks Ghost returns in the API? This might be easier if you create a forum post over on the Discord, you'll get faster responses.

from eleventy.

Can you send your repository? What error did you get? What does the HTML look like of the code blocks Ghost returns in the API? This might be easier if you create a forum post over on the Discord, you'll get faster responses.

Thanks, I'm going now.

from eleventy.