{"id":3368,"date":"2022-09-19T04:30:50","date_gmt":"2022-09-18T23:30:50","guid":{"rendered":"https:\/\/www.edopedia.com\/blog\/?p=3368"},"modified":"2022-09-19T04:30:52","modified_gmt":"2022-09-18T23:30:52","slug":"mermaid-comments","status":"publish","type":"post","link":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/","title":{"rendered":"Mermaid Comments | How To Write Comments in Mermaid.js"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Mermaid Comments<\/h2>\n\n\n\n<p>You can add comments in Mermaid.js after double percent signs <code>%%<\/code><\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;showPanel&quot;:true,&quot;languageLabel&quot;:&quot;language&quot;,&quot;fullScreenButton&quot;:true,&quot;copyButton&quot;:true,&quot;mode&quot;:&quot;null&quot;,&quot;mime&quot;:&quot;text\/plain&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:true,&quot;styleActiveLine&quot;:true,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;fileName&quot;:&quot;&quot;,&quot;language&quot;:&quot;Plain Text&quot;,&quot;maxHeight&quot;:&quot;400px&quot;,&quot;modeName&quot;:&quot;text&quot;}\">%% This is a comment in Mermaid.js<\/pre><\/div>\n\n\n\n<p>The comments functionality was added in Mermaid.js release 0.2.16.<\/p>\n\n\n\n<p>Initially, there were some issues with the <strong>Mermaid comments<\/strong> implementation. For example, comments were not working on class diagrams, but the issue was fixed on Dec 2, 2019.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Why Should I Use Mermaid Comments?<\/h2>\n\n\n\n<p>Depending on the purpose of your program, comments can serve as notes to yourself or reminders, or they can be written with the intention of other programmers being able to understand what your code is doing.<\/p>\n\n\n\n<p>In general, it is a good idea to write comments while you are writing or updating a program as it is easy to forget your thought process later on, and comments written later may be less useful in the long term.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Mermaid Comments You can add comments in Mermaid.js after double percent signs %% The comments functionality was added in Mermaid.js release 0.2.16. Initially, there were some issues with the Mermaid comments implementation. For example, comments were not working on class diagrams, but the issue was fixed on Dec 2, 2019. Why Should I Use Mermaid &#8230; <a title=\"Mermaid Comments | How To Write Comments in Mermaid.js\" class=\"read-more\" href=\"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/\" aria-label=\"Read more about Mermaid Comments | How To Write Comments in Mermaid.js\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":1762,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[112],"tags":[],"class_list":["post-3368","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Mermaid Comments | How To Write Comments in Mermaid.js<\/title>\n<meta name=\"description\" content=\"Mermaid Comments You can add comments in Mermaid.js after double percent signs %% %% This is a comment in Mermaid.js The comments functionality was added\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Mermaid Comments | How To Write Comments in Mermaid.js\" \/>\n<meta property=\"og:description\" content=\"Mermaid Comments You can add comments in Mermaid.js after double percent signs %% %% This is a comment in Mermaid.js The comments functionality was added\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/\" \/>\n<meta property=\"og:site_name\" content=\"Edopedia\" \/>\n<meta property=\"article:author\" content=\"trulyfurqan\" \/>\n<meta property=\"article:published_time\" content=\"2022-09-18T23:30:50+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-09-18T23:30:52+00:00\" \/>\n<meta name=\"author\" content=\"Furqan\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Furqan\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Mermaid Comments | How To Write Comments in Mermaid.js","description":"Mermaid Comments You can add comments in Mermaid.js after double percent signs %% %% This is a comment in Mermaid.js The comments functionality was added","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/","og_locale":"en_US","og_type":"article","og_title":"Mermaid Comments | How To Write Comments in Mermaid.js","og_description":"Mermaid Comments You can add comments in Mermaid.js after double percent signs %% %% This is a comment in Mermaid.js The comments functionality was added","og_url":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/","og_site_name":"Edopedia","article_author":"trulyfurqan","article_published_time":"2022-09-18T23:30:50+00:00","article_modified_time":"2022-09-18T23:30:52+00:00","author":"Furqan","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Furqan","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/#article","isPartOf":{"@id":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/"},"author":{"name":"Furqan","@id":"https:\/\/www.edopedia.com\/blog\/#\/schema\/person\/3951cb19e3aa56df09e408c98aa02339"},"headline":"Mermaid Comments | How To Write Comments in Mermaid.js","datePublished":"2022-09-18T23:30:50+00:00","dateModified":"2022-09-18T23:30:52+00:00","mainEntityOfPage":{"@id":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/"},"wordCount":140,"commentCount":0,"publisher":{"@id":"https:\/\/www.edopedia.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/#primaryimage"},"thumbnailUrl":"https:\/\/www.edopedia.com\/blog\/wp-content\/uploads\/2022\/02\/default_featured_image.jpg","articleSection":["Tutorials"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.edopedia.com\/blog\/mermaid-comments\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/","url":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/","name":"Mermaid Comments | How To Write Comments in Mermaid.js","isPartOf":{"@id":"https:\/\/www.edopedia.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/#primaryimage"},"image":{"@id":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/#primaryimage"},"thumbnailUrl":"https:\/\/www.edopedia.com\/blog\/wp-content\/uploads\/2022\/02\/default_featured_image.jpg","datePublished":"2022-09-18T23:30:50+00:00","dateModified":"2022-09-18T23:30:52+00:00","description":"Mermaid Comments You can add comments in Mermaid.js after double percent signs %% %% This is a comment in Mermaid.js The comments functionality was added","breadcrumb":{"@id":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.edopedia.com\/blog\/mermaid-comments\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/#primaryimage","url":"https:\/\/www.edopedia.com\/blog\/wp-content\/uploads\/2022\/02\/default_featured_image.jpg","contentUrl":"https:\/\/www.edopedia.com\/blog\/wp-content\/uploads\/2022\/02\/default_featured_image.jpg","width":880,"height":495,"caption":"Default Featured Image"},{"@type":"BreadcrumbList","@id":"https:\/\/www.edopedia.com\/blog\/mermaid-comments\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.edopedia.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Mermaid Comments | How To Write Comments in Mermaid.js"}]},{"@type":"WebSite","@id":"https:\/\/www.edopedia.com\/blog\/#website","url":"https:\/\/www.edopedia.com\/blog\/","name":"Edopedia","description":"Coding\/Programming Blog","publisher":{"@id":"https:\/\/www.edopedia.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.edopedia.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.edopedia.com\/blog\/#organization","name":"Edopedia","url":"https:\/\/www.edopedia.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.edopedia.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.edopedia.com\/blog\/wp-content\/uploads\/2017\/10\/edopedia_icon_text_10.jpg","contentUrl":"https:\/\/www.edopedia.com\/blog\/wp-content\/uploads\/2017\/10\/edopedia_icon_text_10.jpg","width":400,"height":100,"caption":"Edopedia"},"image":{"@id":"https:\/\/www.edopedia.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.edopedia.com\/blog\/#\/schema\/person\/3951cb19e3aa56df09e408c98aa02339","name":"Furqan","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/e5e68aef3ad8f0b83d56f4953c512c8e57bd2e6dc64daec33b5d0495d9058f51?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/e5e68aef3ad8f0b83d56f4953c512c8e57bd2e6dc64daec33b5d0495d9058f51?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/e5e68aef3ad8f0b83d56f4953c512c8e57bd2e6dc64daec33b5d0495d9058f51?s=96&d=mm&r=g","caption":"Furqan"},"description":"Well. I've been working for the past three years as a web designer and developer. I have successfully created websites for small to medium sized companies as part of my freelance career. During that time I've also completed my bachelor's in Information Technology.","sameAs":["http:\/\/www.edopedia.com\/blog\/","trulyfurqan"],"url":"https:\/\/www.edopedia.com\/blog\/author\/furqan\/"}]}},"_links":{"self":[{"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/posts\/3368","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/comments?post=3368"}],"version-history":[{"count":2,"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/posts\/3368\/revisions"}],"predecessor-version":[{"id":3370,"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/posts\/3368\/revisions\/3370"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/media\/1762"}],"wp:attachment":[{"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/media?parent=3368"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/categories?post=3368"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.edopedia.com\/blog\/wp-json\/wp\/v2\/tags?post=3368"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}