diff --git a/exampleSite/content/en/blog/bootstrap-elements.md b/exampleSite/content/en/blog/bootstrap-elements.md
index 7d7a0fc1b..1b6a37324 100644
--- a/exampleSite/content/en/blog/bootstrap-elements.md
+++ b/exampleSite/content/en/blog/bootstrap-elements.md
@@ -18,17 +18,17 @@ Hinode provides several shortcodes that wrap common Bootstrap components. Refer
 
 As an example, the following shortcode displays the full text of an abbreviation on hover.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* abbr "CI/CD" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Accordion
 
 As an example, the following shortcode displays an accordion with three elements, of which the first element is expanded.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* accordion */>}}
   {{</* accordion-item header="Accordion Item #1" show="true" */>}}
@@ -43,25 +43,25 @@ As an example, the following shortcode displays an accordion with three elements
   {{</* /accordion-item */>}}
 {{</* /accordion */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Alert
 
 As an example, the following shortcode displays a simple alert.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* alert color="danger" dismissible="true" */>}}
     A simple danger alert—check it out!
 {{</* /alert */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Badge
 
 Use the badge shortcode to display a badge for a heading.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example >}}
 Heading 1 {{</* badge title="New" */>}}
 {.h1}
@@ -81,35 +81,35 @@ Heading 5 {{</* badge title="New" */>}}
 Heading 6 {{</* badge title="New" */>}}
 {.h6}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Breadcrumb
 
 As an example, the following shortcode displays a breadcrumb for the blog page.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* breadcrumb path="blog" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Button
 
 As an example, the following shortcode displays a tooltip for a dark button with a badge.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* button color="secondary" tooltip="Click on the inbox to view your unread messages" href="#!" badge="99+" */>}}
     Inbox
 {{</* /button */>}}
 {{< /example>}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Button group
 
 As an example, the following shortcode displays a group of three buttons.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* button-group aria-label="Basic example" */>}}
   {{</* button color="primary" href="#!" */>}}Left{{</* /button */>}}
@@ -117,24 +117,24 @@ As an example, the following shortcode displays a group of three buttons.
   {{</* button color="primary" href="#!" */>}}Right{{</* /button */>}}
 {{</* /button-group */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Card
 
 As an example, the following shortcode displays a stacked card that links to the [about]({{% ref "about" %}}) page. It includes a custom header.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* card path="about" padding="3" class="col-6 mx-auto" color="body-tertiary"
   header="publication" footer="none" button=true /*/>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Card group
 
 As an example, the following shortcode displays a card group of three elements.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* card-group padding="3" gutter="3" button=true buttonType="link" cols=2 scroll=true */>}}
     {{</* card title="Bootstrap framework" icon="fab bootstrap" */>}}
@@ -149,13 +149,13 @@ As an example, the following shortcode displays a card group of three elements.
     {{</* /card */>}}
 {{</* /card-group */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Carousel
 
 As an example, the following shortcode displays a centered carousel with three slides, 16x9 aspect ratio, and a relative width of 67% on large screens.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* carousel ratio="16x9" class="col-sm-12 col-lg-8 mx-auto" */>}}
   {{</* img src="img/coffee.jpg" caption="slide 1" */>}}
@@ -163,13 +163,13 @@ As an example, the following shortcode displays a centered carousel with three s
   {{</* img src="img/dunes.jpg" caption="slide 3" */>}}
 {{</* /carousel */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Collapse
 
 As an example, the following shortcode displays a button that, when clicked, triggers a panel to appear or disappear.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* button collapse="collapse-1" */>}}
     Trigger panel
@@ -180,23 +180,23 @@ As an example, the following shortcode displays a button that, when clicked, tri
     revealed when the user activates the relevant trigger.
 {{</* /collapse */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Command prompt
 
 Use the `command` shortcode to generate a block with a default bash command prompt.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* command */>}}
 export MY_VAR=123
 {{</* /command */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 Specify `user` and `host` to add the user context to the prompt. In addition, use `(out)` to specify an output line and use `\` to denote a line continuation.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* command user="user" host="localhost" */>}}
 export MY_VAR=123
@@ -210,7 +210,7 @@ echo "goodbye"
 (out)goodbye
 {{</* /command */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Docs
 
@@ -222,47 +222,47 @@ Use the `docs` shortcode to display the content of a `js`, `scss` or `toml` file
 
 Use the `example` shortcode to display a code example and to render a preview of the same input.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* command */>}}
 export MY_VAR=123
 {{</* /command */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## File
 
 Use the `file` shortcode to print and highlight the full content of a given input file.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* file path="./config/_default/languages.toml" id="file-collapse-1" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Icon
 
 As an example, the following shortcodes show a square check, a brand logo, a circle check, and a custom icon.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* fa square-check */>}}
 {{</* fab linkedin */>}}
 {{</* fas circle-check */>}}
 {{</* icon custom activity */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Image
 
 As an example, the following shortcode displays an image with rounded corners and a 4x3 aspect ratio in portrait mode.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="img/flowers.jpg" ratio="4x3" caption="Figure caption" class="rounded col-md-6"
   portrait=true wrapper="text-center" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 The same image, but then using Markdown syntax:
 
@@ -273,25 +273,25 @@ The same image, but then using Markdown syntax:
 
 As an example, the following shortcode displays a regular vector image.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="/img/logo_icon.svg" class="col-sm-6 col-lg-4" wrapper="text-center" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 As an example, the following shortcode displays a vector image with a symbol reference.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="/img/logo_var.svg#logo" class="col-sm-6 col-lg-4" wrapper="text-center" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Link
 
 As an example, the following shortcodes render links in different formats.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 
 - {{</* link hinode >}}Named link with default settings{{< /link */>}}
@@ -311,23 +311,23 @@ As an example, the following shortcodes render links in different formats.
 - {{</* link "components/#map" /*/>}}
 
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Mark
 
 Use the `mark` shortcode to highlight text. The inner content is used as input.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 Use the mark shortcode to {{</* mark >}}highlight{{< /mark */>}} specific text.
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Nav
 
 As an example, the following shortcode displays a tab group with vertically aligned pills.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
   {{</* nav type="pills" vertical="true" */>}}
     {{</* nav-item header="Nav Item #1" show="true" */>}}
@@ -342,23 +342,23 @@ As an example, the following shortcode displays a tab group with vertically alig
     {{</* /nav-item */>}}
   {{</* /nav */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Navbar
 
 As an example, the following shortcode displays a light navigation header.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* navbar id="navbar-sample" path="blog" color="primary" size="md" search="false" menus="sample" title="Brand" mode="false" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Persona
 
 As an example, the following shortcode displays a persona card with a primary color.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* persona thumbnail="/img/creator-1x1.jpg" title="Creators" color="primary" */>}}
   As a content creator you value your independence. You like to take control of your
@@ -370,55 +370,55 @@ As an example, the following shortcode displays a persona card with a primary co
   Hinode.
 {{</* /persona */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Release
 
 As an example, the following shortcode displays a default release button.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* release version="v0.14.1" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Spinner
 
 As an example, the following shortcode displays a centered spinner.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* spinner color="info" class="text-center" */>}}
 Loading...
 {{</* /spinner */>}}
 {{< /example>}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Sub
 
 As an example, the following shortcode displays subscript text.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example >}}
 H{{</* sub 2 */>}}O is a liquid.
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Sup
 
 As an example, the following shortcode displays superscript text.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example >}}
 2{{</* sup 10 */>}} is 1024.
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Table
 
 As an example, the following shortcode displays a responsive table.
 
-<!-- markdownlint-disable MD037 MD058 -->
+{{% comment %}}<!-- markdownlint-disable MD037 MD058 -->{{% /comment %}}
 {{< example lang="markdown" >}}
 {{</* table */>}}
 | #  | Heading | Heading | Heading | Heading | Heading | Heading | Heading | Heading | Heading |
@@ -428,23 +428,23 @@ As an example, the following shortcode displays a responsive table.
 | 3. | cell    | cel     | cel     | cel     | cel     | cel     | cel     | cel     | cel     |
 {{</* /table */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 MD058 -->
+{{% comment %}}<!-- markdownlint-enable MD037 MD058 -->{{% /comment %}}
 
 ## Timeline
 
 As an example, the following shortcode displays a timeline with the file `data/timeline.en.yml` as data.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* timeline data="timeline" background="dark" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Toast
 
 As an example, the following shortcode displays a button that, when clicked, triggers the toast message.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* button toast="toast-example-1" */>}}
     Show toast 1
@@ -462,24 +462,24 @@ As an example, the following shortcode displays a button that, when clicked, tri
     This is the second toast message. It supports `markdown.`
 {{</* /toast */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Tooltip
 
 As an example, the following shortcode displays a tooltip for a colored hyperlink.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* tooltip color="primary" title="Tooltip caption" href="#!" */>}}Tooltip{{</* /tooltip */>}} demonstration
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Video
 
 As an example, the following shortcode displays an Elephants video hosted by Cloudinary.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* video host="cloudinary" account="demo" id="elephants" autoplay=true */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
diff --git a/exampleSite/content/en/blog/components.md b/exampleSite/content/en/blog/components.md
index 873df21ff..d2dfaf6b3 100644
--- a/exampleSite/content/en/blog/components.md
+++ b/exampleSite/content/en/blog/components.md
@@ -19,17 +19,17 @@ Hinode provides several shortcodes on top of the common [Bootstrap elements]({{%
 
 As an example, the following shortcode shows an animation that plays on hover.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* animation data="gatin.json" auto=false hover=true class="col-6 mx-auto" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Data tables
 
 As an example, the following shortcode displays a responsive table that uses advanced controls.
 
-<!-- markdownlint-disable MD037 MD058 -->
+{{% comment %}}<!-- markdownlint-disable MD037 MD058 -->{{% /comment %}}
 {{< example lang="markdown" >}}
 {{</* table sortable="true" paging="true" searchable="true" pagingOptionPerPage=5 */>}}
 |  #  | Heading |
@@ -66,7 +66,7 @@ As an example, the following shortcode displays a responsive table that uses adv
 | 30. | Item 30  |
 {{</* /table */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Formula (KaTeX)
 
@@ -85,8 +85,8 @@ $$\forall x \in X, \quad \exists y \leq \epsilon$$
 
 As an example, the following shortcode displays an interactive map of the city of Amsterdam.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* map lat=52.377 long=4.90 zoom=13 popup="Amsterdam Central Station" popup-lat=52.378062 popup-long=4.900562 */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
diff --git a/exampleSite/content/en/blog/image.md b/exampleSite/content/en/blog/image.md
index 612cc79b4..ccadb6a28 100644
--- a/exampleSite/content/en/blog/image.md
+++ b/exampleSite/content/en/blog/image.md
@@ -12,31 +12,31 @@ thumbnail:
 
 As an example, the following shortcode displays an image with rounded corners and a 21x9 aspect ratio.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="https://res.cloudinary.com/demo/dog.webp"
     ratio="21x9" caption="Cloudinary image" class="rounded" plain=true */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## ImageKit.io
 
 As an example, the following shortcode displays an image with rounded corners and a 21x9 aspect ratio.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="https://ik.imagekit.io/demo/default-image.jpg"
     ratio="21x9" caption="ImageKit.io image" class="rounded" anchor="Center" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Imgix
 
 As an example, the following shortcode displays an image with rounded corners and a 21x9 aspect ratio.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="https://assets.imgix.net/examples/bluehat.jpg"
     ratio="21x9" caption="imgix image" class="rounded" anchor="Top" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
diff --git a/exampleSite/content/en/cookies.md b/exampleSite/content/en/cookies.md
index f37255b9a..b2b25b439 100644
--- a/exampleSite/content/en/cookies.md
+++ b/exampleSite/content/en/cookies.md
@@ -4,7 +4,7 @@ description: Cookie policy of gethinode.com
 date: 2024-09-19
 layout: docs
 ---
-<!-- markdownlint-disable MD036 -->
+{{% comment %}}<!-- markdownlint-disable MD036 -->{{% /comment %}}
 *Effective Date 19-Sep-2024*
 
 ## What are cookies?
diff --git a/exampleSite/content/en/privacy.md b/exampleSite/content/en/privacy.md
index 4d2a5e9dc..dacc40817 100644
--- a/exampleSite/content/en/privacy.md
+++ b/exampleSite/content/en/privacy.md
@@ -4,7 +4,7 @@ description: Privacy policy of gethinode.com
 date: 2024-09-19
 layout: docs
 ---
-<!-- markdownlint-disable MD036 -->
+{{% comment %}}<!-- markdownlint-disable MD036 -->{{% /comment %}}
 *Effective Date 19-Sep-2024*
 
 This Privacy Policy describes the policies of gethinode.com on the collection, use and disclosure of your information that we collect when you use our website (https://gethinode.com, referred to as the “Service”). By accessing or using the Service, you are consenting to the collection, use and disclosure of your information in accordance with this Privacy Policy. If you do not consent to the same, please do not access or use the Service.
@@ -24,7 +24,7 @@ We may also disclose your personal information for the following: (1) to comply
 
 ## Your rights
 
-Depending on the law that applies, you may have a right to access and rectify or erase your personal data or receive a copy of your personal data, restrict or object to the active processing of your data, ask us to share (port) your personal information to another entity,withdraw any consent you provided to us to process your data, a right to lodge a complaint with a statutory authority and such other rights as may be relevant under applicable laws. <!-- To exercise these rights, you can write to us at privacy@gethinode.com. We will respond to your request in accordance with applicable law. -->
+Depending on the law that applies, you may have a right to access and rectify or erase your personal data or receive a copy of your personal data, restrict or object to the active processing of your data, ask us to share (port) your personal information to another entity,withdraw any consent you provided to us to process your data, a right to lodge a complaint with a statutory authority and such other rights as may be relevant under applicable laws. {{% comment %}}<!-- To exercise these rights, you can write to us at privacy@gethinode.com. We will respond to your request in accordance with applicable law. -->{{% /comment %}}
 
 Do note that if you do not allow us to collect or process the required personal information or withdraw the consent to process the same for the required purposes, you may not be able to access or use the services for which your information was sought.
 
@@ -40,8 +40,8 @@ The security of your information is important to us and we will use reasonable s
 
 Our Service may contain links to other websites that are not operated by us. This Privacy Policy does not address the privacy policy and other practices of any third parties, including any third party operating any website or service that may be accessible via a link on the Service. We strongly advise you to review the privacy policy of every site you visit. We have no control over and assume no responsibility for the content, privacy policies or practices of any third party sites or services.
 
-<!-- ## Grievance / Data Protection Officer
+{{% comment %}}<!-- ## Grievance / Data Protection Officer
 
-If you have any queries or concerns about the processing of your information that is available with us, you may email us at privacy@gethinode.com. We will address your concerns in accordance with applicable law. -->
+If you have any queries or concerns about the processing of your information that is available with us, you may email us at privacy@gethinode.com. We will address your concerns in accordance with applicable law. -->{{% /comment %}}
 
 *Privacy Policy generated with {{< link "https://www.cookieyes.com" >}}CookieYes{{< /link >}}.*
diff --git a/exampleSite/content/fr/blog/bootstrap-elements.md b/exampleSite/content/fr/blog/bootstrap-elements.md
index 0da4d62f5..b9b1d367e 100644
--- a/exampleSite/content/fr/blog/bootstrap-elements.md
+++ b/exampleSite/content/fr/blog/bootstrap-elements.md
@@ -19,17 +19,17 @@ Hinode propose plusieurs shortcodes qui enveloppent des composants Bootstrap cou
 
 À titre d'exemple, le shortcode suivant affiche le texte complet d'une abréviation lorsque survolé.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* abbr "CI/CD" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Accordéon
 
 À titre d'exemple, le shortcode suivant affiche un accordéon avec trois éléments, dont le premier élément est déplié.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* accordion */>}}
   {{</* accordion-item header="Élément d'accordéon #1" show="true" */>}}
@@ -43,25 +43,25 @@ Hinode propose plusieurs shortcodes qui enveloppent des composants Bootstrap cou
   {{</* /accordion-item */>}}
 {{</* /accordion */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Alerte
 
 À titre d'exemple, le shortcode suivant affiche une alerte simple.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* alert color="danger" dismissible="true" */>}}
     Une simple alerte de danger — vérifiez-la !
 {{</* /alert */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Badge
 
 Utilisez le shortcode "badge" pour afficher un badge avec un en-tête.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example >}}
 En-tête 1 {{</* badge title="Nouveau" */>}}
 {.h1}
@@ -81,35 +81,35 @@ En-tête 5 {{</* badge title="Nouveau" */>}}
 En-tête 6 {{</* badge title="Nouveau" */>}}
 {.h6}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Fil d'Ariane
 
 À titre d'exemple, le shortcode suivant affiche un fil d'Ariane pour la page du blog.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* breadcrumb path="blog" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Bouton
 
 À titre d'exemple, le shortcode suivant affiche une infobulle pour un bouton sombre avec un badge.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* button color="secondary" tooltip="Cliquez sur la boîte de réception pour voir vos messages non lus." href="#!" badge="99+" */>}}
     Boîte de réception
 {{</* /button */>}}
 {{< /example>}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Groupe de boutons
 
 À titre d'exemple, le shortcode suivant affiche un groupe de trois boutons.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* button-group aria-label="Basic example" */>}}
   {{</* button color="primary" href="#!" */>}}Gauche{{</* /button */>}}
@@ -117,24 +117,24 @@ En-tête 6 {{</* badge title="Nouveau" */>}}
   {{</* button color="primary" href="#!" */>}}Droite{{</* /button */>}}
 {{</* /button-group */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Carte
 
 À titre d'exemple, le shortcode suivant affiche une carte empilée qui renvoie à la page [à propos]({{% ref "about" %}}). Elle inclut un en-tête personnalisé.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* card path="about" padding="3" class="col-6 mx-auto" color="body-tertiary"
   header="publication" footer="none" button=true /*/>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Groupe de cartes
 
 À titre d'exemple, le shortcode suivant affiche un groupe de cartes avec trois éléments.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* card-group padding="3" gutter="3" */>}}
     {{</* card title="Framework Bootstrap" icon="fab bootstrap" */>}}
@@ -151,13 +151,13 @@ En-tête 6 {{</* badge title="Nouveau" */>}}
     {{</* /card */>}}
 {{</* /card-group */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Carrousel
 
 À titre d'exemple, le shortcode suivant affiche un carrousel centré avec trois slides, un rapport hauteur/largeur de 16:9 et une largeur relative de 67 % sur les grands écrans.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* carousel ratio="16x9" class="col-sm-12 col-lg-8 mx-auto" */>}}
   {{</* img src="img/coffee.jpg" caption="slide 1" */>}}
@@ -165,13 +165,13 @@ En-tête 6 {{</* badge title="Nouveau" */>}}
   {{</* img src="img/dunes.jpg" caption="slide 3" */>}}
 {{</* /carousel */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Réduire
 
 À titre d'exemple, le shortcode suivant affiche un bouton qui, lorsqu'il est cliqué, déclenche l'apparition ou la disparition d'un panneau.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* button collapse="collapse-1" */>}}
     Déclencher le panneau
@@ -182,23 +182,23 @@ En-tête 6 {{</* badge title="Nouveau" */>}}
     sera révélé lorsque l'utilisateur active le déclencheur correspondant.
 {{</* /collapse */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Invite de commandes
 
 Utilisez le shortcode `command` pour générer un bloc avec un invite de commandes bash par défaut.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* command */>}}
 export MY_VAR=123
 {{</* /command */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 Spécifiez `user` et `host` pour ajouter le contexte de l'utilisateur à l'invite. De plus, utilisez `(out)` pour spécifier une ligne de sortie et utilisez `\` pour indiquer une continuation de ligne.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* command user="user" host="localhost" */>}}
 export MY_VAR=123
@@ -212,7 +212,7 @@ echo "goodbye"
 (out)goodbye
 {{</* /command */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Documentation
 
@@ -224,67 +224,67 @@ Utilisez le shortcode `docs` pour afficher le contenu d'un fichier `js`, `scss`
 
 Utilisez le shortcode `example` pour afficher un exemple de code et pour afficher un aperçu de la même entrée.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* command */>}}
 export MY_VAR=123
 {{</* /command */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Fichier
 
 Utilisez le shortcode `file` pour afficher et mettre en évidence le contenu complet d'un fichier d'entrée donné.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* file path="./config/_default/languages.toml" id="file-collapse-1" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Icon
 
 À titre d'exemple, les shortcodes suivants affichent une coche carrée, un logo de marque et une coche circulaire.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* fa square-check */>}}
 {{</* fab linkedin */>}}
 {{</* fas circle-check */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Image
 
 À titre d'exemple, le shortcode suivant affiche une image avec des coins arrondis et un ratio d'aspect de 21:9.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="img/flowers.jpg" ratio="21x9" caption="Légende de l'image" class="rounded" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 À titre d'exemple, le shortcode suivant affiche une image vectorielle classique.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="/img/logo_icon.svg" class="col-sm-6 col-lg-4" wrapper="text-center" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 À titre d'exemple, le shortcode suivant affiche une image vectorielle avec une référence de symbole.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="/img/logo_var.svg#logo" class="col-sm-6 col-lg-4" wrapper="text-center" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Lien
 
 À titre d'exemple, les shortcodes suivants rendent des liens dans différents formats.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 
 - {{</* link hinode >}}Lien nommé avec les paramètres par défaut{{< /link */>}}
@@ -303,23 +303,23 @@ Utilisez le shortcode `file` pour afficher et mettre en évidence le contenu com
 - {{</* link "components/#map" /*/>}}
 
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Mark
 
 Utilisez le shortcode `mark` pour mettre en évidence le texte. Le contenu interne est utilisé en tant qu'entrée.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 Utilisez le shortcode `mark` pour {{</* mark >}}mettre en évidence{{< /mark */>}} un texte spécifique.
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Navigation
 
 À titre d'exemple, le shortcode suivant affiche un groupe d'onglets avec des onglets alignés verticalement.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
   {{</* nav type="pills" vertical="true" */>}}
     {{</* nav-item header="Élément de navigation #1" show="true" */>}}
@@ -334,75 +334,75 @@ Utilisez le shortcode `mark` pour {{</* mark >}}mettre en évidence{{< /mark */>
     {{</* /nav-item */>}}
   {{</* /nav */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Barre de navigation
 
 À titre d'exemple, le shortcode suivant affiche un en-tête de navigation clair.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* navbar id="navbar-sample" path="blog" color="primary" size="md" search="false" menus="sample" title="Marque" mode="false" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Publication
 
 À titre d'exemple, le shortcode suivant affiche un bouton de publication par défaut.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* release version="v0.14.1" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Indicateur de chargement
 
 À titre d'exemple, le raccourci suivant affiche un indicateur de chargement centré.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* spinner color="info" class="text-center" */>}}
 Chargement...
 {{</* /spinner */>}}
 {{< /example>}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Sub
 
 À titre d'exemple, le shortcode suivant affiche du texte en indice.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example >}}
 H{{</* sub 2 */>}}O est un liquide.
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Sup
 
 À titre d'exemple, le shortcode suivant affiche du texte en exposant.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example >}}
 2{{</* sup 10 */>}} équivaut à 1024.
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Chronologie
 
 À titre d'exemple, le shortcode suivant affiche une chronologie avec le fichier `data/timeline-fr.yml` en tant que données.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* timeline data="timeline-fr" background="dark" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Notification
 
 À titre d'exemple, le shortcode suivant affiche un bouton qui, lorsqu'il est cliqué, déclenche le message de notification.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* button toast="toast-example-1" */>}}
     Affiche la notification #1
@@ -420,24 +420,24 @@ H{{</* sub 2 */>}}O est un liquide.
     Ceci est le deuxième message de notification. Il prend en charge le `markdown`.
 {{</* /toast */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Infobulle
 
 À titre d'exemple, le shortcode suivant affiche une infobulle pour un lien hypertexte coloré.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* tooltip color="primary" title="Légende de l'infobulle" href="#!" */>}}Démonstration{{</* /tooltip */>}} d'une infobulle
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Vidéo
 
 À titre d'exemple, le shortcode suivant affiche une vidéo d'éléphant hébergée par Cloudinary.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* video host="cloudinary" account="demo" id="elephants" autoplay=true */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
diff --git a/exampleSite/content/fr/blog/components.md b/exampleSite/content/fr/blog/components.md
index 0271eaa14..8861d6402 100644
--- a/exampleSite/content/fr/blog/components.md
+++ b/exampleSite/content/fr/blog/components.md
@@ -20,17 +20,17 @@ Hinode propose plusieurs shortcodes en plus des [éléments Bootstrap]({{% relre
 
 À titre d'exemple, le shortcode suivant affiche une animation qui se déclenche au survol.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* animation data="gatin.json" auto=false hover=true class="col-6 mx-auto" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Data tables
 
 À titre d'exemple, le shortcode suivant affiche un tableau réactif utilisant des contrôles avancés.
 
-<!-- markdownlint-disable MD037 MD058 -->
+{{% comment %}}<!-- markdownlint-disable MD037 MD058 -->{{% /comment %}}
 {{< example lang="markdown" >}}
 {{</* table sortable="true" paging="true" searchable="true" pagingOptionPerPage=5 */>}}
 |  #  | Heading |
@@ -67,7 +67,7 @@ Hinode propose plusieurs shortcodes en plus des [éléments Bootstrap]({{% relre
 | 30. | Item 30  |
 {{</* /table */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Formule (KaTeX)
 
@@ -86,8 +86,8 @@ $$\forall x \in X, \quad \exists y \leq \epsilon$$
 
 À titre d'exemple, le shortcode suivant affiche une carte interactive de la ville d'Amsterdam.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* map lat=52.377 long=4.90 zoom=13 popup="Gare centrale d'Amsterdam" popup-lat=52.378062 popup-long=4.900562 */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
diff --git a/exampleSite/content/fr/blog/image.md b/exampleSite/content/fr/blog/image.md
index 7636800ab..efde6ef8d 100644
--- a/exampleSite/content/fr/blog/image.md
+++ b/exampleSite/content/fr/blog/image.md
@@ -12,31 +12,31 @@ thumbnail:
 
 À titre d'exemple, le shortcode suivant affiche une image avec des coins arrondis et un ratio d'aspect de 21x9.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="https://res.cloudinary.com/demo/dog.webp"
     ratio="21x9" caption="Image Cloudinary" class="rounded" plain=true */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## ImageKit.io
 
 À titre d'exemple, le shortcode suivant affiche une image avec des coins arrondis et un ratio d'aspect de 21x9.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="https://ik.imagekit.io/demo/default-image.jpg"
     ratio="21x9" caption="Image ImageKit.io" class="rounded" anchor="Center" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Imgix
 
 À titre d'exemple, le shortcode suivant affiche une image avec des coins arrondis et un ratio d'aspect de 21x9.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* image src="https://assets.imgix.net/examples/bluehat.jpg"
     ratio="21x9" caption="Image imgix" class="rounded" anchor="Top" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
diff --git a/exampleSite/content/fr/cookies.md b/exampleSite/content/fr/cookies.md
index f5b1f6fbd..90544b4f9 100644
--- a/exampleSite/content/fr/cookies.md
+++ b/exampleSite/content/fr/cookies.md
@@ -4,7 +4,7 @@ description: Politique de cookies de gethinode.com
 date: 2024-09-19
 layout: docs
 ---
-<!-- markdownlint-disable MD036 -->
+{{% comment %}}<!-- markdownlint-disable MD036 -->{{% /comment %}}
 *Date d'entrée en vigueur : 19-Sep-2024*
 
 ## Que sont les cookies ?
diff --git a/exampleSite/content/fr/privacy.md b/exampleSite/content/fr/privacy.md
index 264a529a5..4cc583e03 100644
--- a/exampleSite/content/fr/privacy.md
+++ b/exampleSite/content/fr/privacy.md
@@ -4,7 +4,7 @@ description: Politique de confidentialité de gethinode.com
 date: 2024-09-19
 layout: docs
 ---
-<!-- markdownlint-disable MD036 -->
+{{% comment %}}<!-- markdownlint-disable MD036 -->{{% /comment %}}
 *Date d'entrée en vigueur : 19-Sep-2024*
 
 Cette Politique de Confidentialité décrit les politiques de gethinode.com concernant la collecte, l'utilisation et la divulgation de vos informations que nous collectons lorsque vous utilisez notre site web (https://gethinode.com, désigné comme le « Service »). En accédant ou en utilisant le Service, vous consentez à la collecte, à l'utilisation et à la divulgation de vos informations conformément à cette Politique de Confidentialité. Si vous ne consentez pas à cela, veuillez ne pas accéder ou utiliser le Service.
@@ -23,7 +23,7 @@ Nous pouvons également divulguer vos informations personnelles pour les raisons
 
 ## Vos droits
 
-Selon les lois applicables, vous pouvez avoir le droit d'accéder à vos données personnelles, de les rectifier ou de les effacer, de recevoir une copie de vos données personnelles, de restreindre ou de vous opposer au traitement actif de vos données, de nous demander de partager (transférer) vos informations personnelles à une autre entité, de retirer tout consentement que vous nous avez donné pour traiter vos données, un droit de porter plainte auprès d'une autorité statutaire et d'autres droits pertinents en vertu des lois applicables. <!-- Pour exercer ces droits, vous pouvez nous écrire à privacy@gethinode.com. Nous répondrons à votre demande conformément aux lois applicables. -->
+Selon les lois applicables, vous pouvez avoir le droit d'accéder à vos données personnelles, de les rectifier ou de les effacer, de recevoir une copie de vos données personnelles, de restreindre ou de vous opposer au traitement actif de vos données, de nous demander de partager (transférer) vos informations personnelles à une autre entité, de retirer tout consentement que vous nous avez donné pour traiter vos données, un droit de porter plainte auprès d'une autorité statutaire et d'autres droits pertinents en vertu des lois applicables. {{% comment %}}<!-- Pour exercer ces droits, vous pouvez nous écrire à privacy@gethinode.com. Nous répondrons à votre demande conformément aux lois applicables. -->{{% /comment %}}
 
 Notez que si vous ne nous autorisez pas à collecter ou traiter les informations personnelles requises, ou si vous retirez votre consentement pour traiter celles-ci pour les fins requises, vous pourriez ne pas être en mesure d'accéder ou d'utiliser les services pour lesquels vos informations ont été demandées.
 
@@ -39,8 +39,8 @@ La sécurité de vos informations est importante pour nous et nous utiliserons d
 
 Notre Service peut contenir des liens vers d'autres sites web qui ne sont pas exploités par nous. Cette Politique de Confidentialité ne couvre pas la politique de confidentialité et les autres pratiques de tout tiers, y compris tout tiers exploitant tout site ou service qui pourrait être accessible via un lien sur le Service. Nous vous conseillons fortement de consulter la politique de confidentialité de chaque site que vous visitez. Nous n'avons aucun contrôle sur le contenu, les politiques de confidentialité ou les pratiques des sites ou services de tiers et déclinons toute responsabilité à cet égard.
 
-<!-- ## Responsable des plaintes / Protection des données
+{{% comment %}}<!-- ## Responsable des plaintes / Protection des données
 
-Si vous avez des questions ou des préoccupations concernant le traitement de vos informations dont nous disposons, vous pouvez nous envoyer un e-mail à privacy@gethinode.com. Nous répondrons à vos préoccupations conformément aux lois applicables. -->
+Si vous avez des questions ou des préoccupations concernant le traitement de vos informations dont nous disposons, vous pouvez nous envoyer un e-mail à privacy@gethinode.com. Nous répondrons à vos préoccupations conformément aux lois applicables. -->{{% /comment %}}
 
 *Politique de Confidentialité générée avec {{< link "https://www.cookieyes.com" >}}CookieYes{{< /link >}}.*
diff --git a/exampleSite/content/nl/blog/components.md b/exampleSite/content/nl/blog/components.md
index f84b03376..4fcb7d96d 100644
--- a/exampleSite/content/nl/blog/components.md
+++ b/exampleSite/content/nl/blog/components.md
@@ -19,17 +19,17 @@ Hinode bevat meerdere shortcodes naast de generieke Bootstrap elementen. Zie de
 
 Het volgende voorbeeld gebruikt een shortcode om een animatie te tonen, die afspeelt zodra je er met de muis overheen beweegt.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* animation data="gatin.json" auto=false hover=true class="col-6 mx-auto" */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
 
 ## Gegevenstabellen
 
 Het volgende voorbeeld gebruikt een shortcode om een responsieve tabel met geavanceerde mogelijkheden te tonen.
 
-<!-- markdownlint-disable MD037 MD058 -->
+{{% comment %}}<!-- markdownlint-disable MD037 MD058 -->{{% /comment %}}
 {{< example lang="markdown" >}}
 {{</* table sortable="true" paging="true" searchable="true" pagingOptionPerPage=5 */>}}
 |  #  | Kop     |
@@ -66,7 +66,7 @@ Het volgende voorbeeld gebruikt een shortcode om een responsieve tabel met geava
 | 30. | Item 30  |
 {{</* /table */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 MD058 -->{{% /comment %}}
 
 ## Formule (KaTeX)
 
@@ -85,8 +85,8 @@ $$\forall x \in X, \quad \exists y \leq \epsilon$$
 
 Het volgende voorbeeld gebruikt een shortcode om een interactieve kaart van Amsterdam te tonen.
 
-<!-- markdownlint-disable MD037 -->
+{{% comment %}}<!-- markdownlint-disable MD037 -->{{% /comment %}}
 {{< example lang="hugo" >}}
 {{</* map lat=52.377 long=4.90 zoom=13 popup="Amsterdam Central Station" popup-lat=52.378062 popup-long=4.900562 */>}}
 {{< /example >}}
-<!-- markdownlint-enable MD037 -->
+{{% comment %}}<!-- markdownlint-enable MD037 -->{{% /comment %}}
diff --git a/package-lock.json b/package-lock.json
index 8575df272..0bd2587c1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@gethinode/hinode",
-  "version": "0.27.8",
+  "version": "0.27.9",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@gethinode/hinode",
-      "version": "0.27.8",
+      "version": "0.27.9",
       "license": "MIT",
       "dependencies": {
         "@fullhuman/postcss-purgecss": "^6.0.0",
diff --git a/package.json b/package.json
index c6d57e0ca..6fa06506b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@gethinode/hinode",
-  "version": "0.27.8",
+  "version": "0.27.9",
   "description": "Hinode is a clean documentation and blog theme for Hugo, an open-source static site generator",
   "keywords": [
     "hugo",