diff --git a/credentials/html-render-method/README.md b/credentials/html-render-method/README.md
new file mode 100644
index 0000000..48e1351
--- /dev/null
+++ b/credentials/html-render-method/README.md
@@ -0,0 +1,12 @@
+# HTML Render Method Example VC
+
+This example contains an HTML-based template following the forthcoming
+[HTML Render Method](https://github.com/w3c/vc-render-method/pull/42)
+change to the
+[Verifiable Credential Render Methods v1.0](https://w3c.github.io/vc-render-method/)
+specification.
+
+## `image.png` Attribution
+
+The HTML file icon used in the `image.png` file was
+[created by Smashicons and found via Flaticon.com](https://www.flaticon.com/free-icons/html-file).
diff --git a/credentials/html-render-method/credential.json b/credentials/html-render-method/credential.json
new file mode 100644
index 0000000..60aea34
--- /dev/null
+++ b/credentials/html-render-method/credential.json
@@ -0,0 +1,37 @@
+{
+ "@context": [
+ "https://www.w3.org/ns/credentials/v2",
+ "https://www.w3.org/ns/credentials/examples/v2"
+ ],
+ "type": [
+ "VerifiableCredential",
+ "NameCredential"
+ ],
+ "issuer": {
+ "id": "did:example:1234",
+ "name": "The Issuer"
+ },
+ "credentialSubject": {
+ "name": "Example Name",
+ "notRendered": "should not appear"
+ },
+ "renderMethod": {
+ "type": "TemplateRenderMethod",
+ "renderSuite": "html",
+ "renderProperty": [
+ "/issuer/name",
+ "/credentialSubject/name"
+ ],
+ "template": "data:text/html,
\n \n \n\n
\n
Issued by:
\n
",
+ "outputPreference": {
+ "mode": [
+ "visual"
+ ],
+ "mediaType": "application/html",
+ "style": {
+ "width": "800px",
+ "height": "800px"
+ }
+ }
+ }
+}
diff --git a/credentials/html-render-method/image.png b/credentials/html-render-method/image.png
new file mode 100644
index 0000000..9809048
Binary files /dev/null and b/credentials/html-render-method/image.png differ
diff --git a/credentials/html-render-method/queries.json b/credentials/html-render-method/queries.json
new file mode 100644
index 0000000..5a871d7
--- /dev/null
+++ b/credentials/html-render-method/queries.json
@@ -0,0 +1,26 @@
+{
+ "default": {
+ "type": "QueryByExample",
+ "credentialQuery": {
+ "reason": "Please present your Name Credential with HTML Render Method.",
+ "example": {
+ "@context": [
+ "https://www.w3.org/2018/credentials/v1",
+ "https://www.w3.org/ns/credentials/examples/v2"
+ ],
+ "type": ["NameCredential"],
+ "renderMethod": {
+ "type": "TemplateRenderMethod",
+ "renderSuite": "html"
+ }
+ },
+ "acceptedCryptosuites": [
+ "Ed25519Signature2020",
+ "eddsa-rdfc-2022",
+ "ecdsa-rdfc-2019",
+ "bbs-2023",
+ "ecdsa-sd-2023"
+ ]
+ }
+ }
+}
diff --git a/src/_data/examples.js b/src/_data/examples.js
index c55b758..b1d7bad 100644
--- a/src/_data/examples.js
+++ b/src/_data/examples.js
@@ -24,7 +24,8 @@ for(const dir of directories) {
const readmePath = path.join(dir, 'README.md');
// TODO: gather images also
const credential = JSON.parse(fs.readFileSync(credentialPath, 'utf8'));
- const queries = JSON.parse(fs.readFileSync(queriesPath, 'utf8'));
+ const queries = fs.existsSync(queriesPath) ?
+ JSON.parse(fs.readFileSync(queriesPath, 'utf8')) : {};
const readme = fs.existsSync(readmePath) ?
fs.readFileSync(readmePath, 'utf8') : '';
const dirname = path.basename(dir);