Mermaid not woring in https://toha-guides.netlify.app/posts/writing-posts/mermaid/

I do not see it in the docs and

https://toha-guides.netlify.app/posts/configuration/sections/about-section/
and
https://toha-guides.netlify.app/posts/

do not work

Re @hossainemruz,

Suppose I want to start translating the guide into French. How should I go about it ?

Today, the content/posts directory doesn't have an en or fr directory to differentiate articles from one language to another.

Should I conclude that it would be necessary to create a complete clone of the original repository and replace the English content with French content ? This would not be practical as someone wanted to offer a German or Spanish translation for example, there would be as many repositories of the guide as there are language 🤔🤨.

Last question : If someone updates the original doc, how can I detect this and report the change to another language ?

Do you have an opinion ? Thank you by advance for your feedback.

Describe the solution you'd like

Code

Currently, one can integrate custom HTTP headers to Hugo site by adding the below code portion to netlify.toml file
[[headers]] for = "/*" [headers.values] X-Frame-Options = "DENY" X-XSS-Protection = "1; mode=block" X-Content-Type-Options = "nosniff" Content-Security-Policy = "" Referrer-Policy = "strict-origin-when-cross-origin" Strict-Transport-Security = "max-age=2592000" Permissions-Policy = ''' accelerometer=(none), ambient-light-sensor=(none), autoplay=(none), camera=(none), encrypted-media=(none), fullscreen=(none), geolocation=(none), gyroscope=(none), magnetometer=(none), microphone=(none), midi=(none), payment=(none), picture-in-picture=(none), speaker=(none), usb=(none), vibrate=(none), vr=(none)'''

Currently, I have kept the content-security-policy section blank because it can be different for particular sites based on their src of javascript files, image files, and style files.

You do not mention tags in your docs but they are pretty easy to add.

        <ul id="tags-single">
          <li>Tags:</li>
          {{ range .Params.tags }}
          <li><a href="/tags/{{ . | urlize }}">{{ . }}</a> </li>
          {{ end }}
        </ul>

and add

taxonomies:
  tag: tags

to config.yaml

I could update the docs but figured I would ask first.

Thanks for all the work btw!

Hi @hossainemruz,

Context

When you read the shortcodes page. We can see the different alert blocks available on the page. But there are no code examples associated with each block on the post.

This is not practical, the visitor is forced to go to the git repository to see the code examples.

Solution possible

For each alert block, put the associated shortcode directly on the post.

Note

Note that this development is valid for the entire rest of the page.

I'm assuming you use this repo for validating changes to the theme repo. I understand I'm opening a lot of PRs which can take a lot of time to validate and test. A tool i've found very useful for validating changes is percy.io which will automatically take screenshots of all of the pages and do a visual diff as a github check which highlights visual screenshot differences between branches. This creates views like this for each PR that you can then approve to check visual diffs across viewports and browsers

If you wanted to set something similar up for this repo, I did so doing the following

• setup a percy.io account in the free tier https://percy.io/pricing which provides 5k screenshots per month (no credit card info required)
• Install the percy.io github app from https://github.com/marketplace/percy
• configure the percy.io secret token in your repo's secrets settings
  • https://github.com/alex-bezek/blog/pull/37/files#diff-1c9579411502b578b6eca8e2f703367a9a8be40cf7dda98e9e23208e00a342fdR29
  • https://docs.github.com/en/free-pro-team@latest/actions/reference/encrypted-secrets

For my site, this does generate 48 screenshots (each of my posts and home page across firefox and chrome across 2 viewports) which would give me ~100prs worth of screenshots per month. Since your site has many more posts, it would probably be good to restrict the number of pages it actually tests to be a more reasonable amount via https://docs.percy.io/docs/sdk-configuration#snapshot.

I also setup https://dependabot.com/submodules/ to automatically create PRs updating my submodule. This combined with percy + i use vercel to auto deploy all PR branches (which you use netlify but it does the same thing). These things combined make for some really nice automation around PR validation and consuming new theme changes (like this alex-bezek/blog#47 ).

I just thought i would share to see if you were interested.