From 84192aecefa01977760006df23178d5aeb13fa3d Mon Sep 17 00:00:00 2001
From: ksen0 <katie.kuksenok@gmail.com>
Date: Tue, 13 May 2025 12:33:48 +0200
Subject: [PATCH 01/10] Initial format for detailed example attribution

---
 src/content/examples/config.ts                     |  7 +++++++
 .../03_Smoke_Particle_System/description.mdx       | 14 ++++++++------
 src/layouts/ExampleLayout.astro                    | 13 ++++++++++---
 3 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/src/content/examples/config.ts b/src/content/examples/config.ts
index 20056a4932..b580555825 100644
--- a/src/content/examples/config.ts
+++ b/src/content/examples/config.ts
@@ -17,5 +17,12 @@ export const examplesCollection = defineCollection({
       relatedReference: z.array(reference("reference")).optional(),
       featuredImage: image(),
       featuredImageAlt: z.string().optional().default(""),
+      archiveAttributionPrefix: z.string().optional().default(""),
+      archiveAttributionName: z.string().optional().default(""),
+      archiveAttributionURL: z.string().optional().default(""),
+      revisedAttributionPrefix: z.string().optional().default(""),
+      revisedAttributionPrefixURL: z.string().optional().default(""),
+      revisedAttributionName: z.string().optional().default(""),
+      revisedAttributionURL: z.string().optional().default(""),
     }),
 });
diff --git a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
index c4b0700807..cae3d1715e 100644
--- a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
@@ -4,15 +4,17 @@ featuredImageAlt: Rainbow colored smoke angled towards the right of the canvas,
 title: Smoke Particles
 oneLineDescription: Simulate smoke with a particle system.
 featured: true
+archiveAttributionPrefix: Based on
+archiveAttributionName: Dan Shiffman's example
+archiveAttributionURL: https://natureofcode.com/book/chapter-4-particle-systems/
+revisedAttributionPrefix: Revised in 2023
+revisedAttributionPrefixURL: https://github.com/processing/p5.js-example
+revisedAttributionName: Darren Kessner
+revisedAttributionURL: https://github.com/dkessner
 ---
 
 
-Smoke particle system demo, based on
-Dan Shiffman's original
-<a href="https://natureofcode.com/book/chapter-4-particle-systems/">example</a>
-for Processing.
-
-The code makes use of the
+This smoke particle system demo makes use of the
 <a href="https://p5js.org/reference/p5/p5.Vector">p5.Vector</a>
 class, including the
 <a href="https://p5js.org/reference/p5/createVector">createVector()</a>
diff --git a/src/layouts/ExampleLayout.astro b/src/layouts/ExampleLayout.astro
index cc31a5d2bf..87f955bab2 100644
--- a/src/layouts/ExampleLayout.astro
+++ b/src/layouts/ExampleLayout.astro
@@ -63,14 +63,21 @@ const { Content } = await example.render();
     <div class="rendered-markdown">
       <Content />
     </div>
-    <EditableSketch code={code} />
-    <p>{example.data.arialabel}</p>
     <div class="rendered-markdown">
       <p>
-        <a href={Astro.url.pathname}>{example.data.title}</a> by <a href="https://p5js.org/people">p5.js Contributors</a> and the <a href="https://processingfoundation.org/people">Processing Foundation</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">CC BY-NC-SA 4.0</a>.
+
+        <a href={Astro.url.pathname}>{example.data.title}</a>: 
+        {example.data.archiveAttributionPrefix} <a href={example.data.archiveAttributionURL}>{example.data.archiveAttributionName}</a>.
+        <a href={example.data.revisedAttributionPrefixURL}>{example.data.revisedAttributionPrefix}</a> by <a href={example.data.revisedAttributionURL}>{example.data.revisedAttributionName}</a>.
+        From 2023 onwards, edited and maintained by <a href="https://github.com/processing/p5.js?tab=readme-ov-file#contributors">p5.js Contributors</a> and the <a href="https://processingfoundation.org/people">Processing Foundation</a>. Licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">CC BY-NC-SA 4.0</a>.
+
       </p>
       <img src="/images/by-nc-sa.svg" />
     </div>
+
+    <EditableSketch code={code} />
+    <p>{example.data.arialabel}</p>
+
   </div>
   <div class="grid gap-y-4xl lg:gap-y-mb-3xl mt-2xl">
     {

From a1a978ad72f05a29e7d3a551efd469b88d136690 Mon Sep 17 00:00:00 2001
From: ksen0 <katie.kuksenok@gmail.com>
Date: Sat, 31 May 2025 10:05:50 +0200
Subject: [PATCH 02/10] Improved remix attribution schema

---
 src/content/examples/config.ts                | 20 ++++++---
 .../03_Smoke_Particle_System/description.mdx  | 15 ++++---
 src/layouts/ExampleLayout.astro               | 44 +++++++++++++++++--
 3 files changed, 61 insertions(+), 18 deletions(-)

diff --git a/src/content/examples/config.ts b/src/content/examples/config.ts
index b580555825..9e00cea4fd 100644
--- a/src/content/examples/config.ts
+++ b/src/content/examples/config.ts
@@ -17,12 +17,18 @@ export const examplesCollection = defineCollection({
       relatedReference: z.array(reference("reference")).optional(),
       featuredImage: image(),
       featuredImageAlt: z.string().optional().default(""),
-      archiveAttributionPrefix: z.string().optional().default(""),
-      archiveAttributionName: z.string().optional().default(""),
-      archiveAttributionURL: z.string().optional().default(""),
-      revisedAttributionPrefix: z.string().optional().default(""),
-      revisedAttributionPrefixURL: z.string().optional().default(""),
-      revisedAttributionName: z.string().optional().default(""),
-      revisedAttributionURL: z.string().optional().default(""),
+      // Optional list of remixes to add to license
+      remix: z
+        .array(
+          z.object({
+            attributionURL: z.string().optional(),
+            attributionLabel: z.string().optional(),
+            remixURL: z.string().optional(),
+            remixLabel: z.string().optional(),
+          })
+        )
+        .optional()
+        .default([]),
     }),
 });
+
diff --git a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
index cae3d1715e..80f84f80f2 100644
--- a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
@@ -4,13 +4,14 @@ featuredImageAlt: Rainbow colored smoke angled towards the right of the canvas,
 title: Smoke Particles
 oneLineDescription: Simulate smoke with a particle system.
 featured: true
-archiveAttributionPrefix: Based on
-archiveAttributionName: Dan Shiffman's example
-archiveAttributionURL: https://natureofcode.com/book/chapter-4-particle-systems/
-revisedAttributionPrefix: Revised in 2023
-revisedAttributionPrefixURL: https://github.com/processing/p5.js-example
-revisedAttributionName: Darren Kessner
-revisedAttributionURL: https://github.com/dkessner
+remix:
+ - attributionURL: https://github.com/dkessner
+   attributionLabel: Darren Kessner
+   remixURL: https://github.com/processing/p5.js-example
+   remixLabel: Revised in 2023
+ - attributionURL: https://natureofcode.com/book/chapter-4-particle-systems/
+   attributionLabel: Dan Shiffman's example
+
 ---
 
 
diff --git a/src/layouts/ExampleLayout.astro b/src/layouts/ExampleLayout.astro
index 87f955bab2..c7c414b14a 100644
--- a/src/layouts/ExampleLayout.astro
+++ b/src/layouts/ExampleLayout.astro
@@ -66,10 +66,46 @@ const { Content } = await example.render();
     <div class="rendered-markdown">
       <p>
 
-        <a href={Astro.url.pathname}>{example.data.title}</a>: 
-        {example.data.archiveAttributionPrefix} <a href={example.data.archiveAttributionURL}>{example.data.archiveAttributionName}</a>.
-        <a href={example.data.revisedAttributionPrefixURL}>{example.data.revisedAttributionPrefix}</a> by <a href={example.data.revisedAttributionURL}>{example.data.revisedAttributionName}</a>.
-        From 2023 onwards, edited and maintained by <a href="https://github.com/processing/p5.js?tab=readme-ov-file#contributors">p5.js Contributors</a> and the <a href="https://processingfoundation.org/people">Processing Foundation</a>. Licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">CC BY-NC-SA 4.0</a>.
+        <a href={Astro.url.pathname}>{example.data.title}</a>:
+        Edited and maintained by
+        <a href="https://github.com/processing/p5.js?tab=readme-ov-file#contributors">p5.js Contributors</a>
+        and the
+        <a href="https://processingfoundation.org/people">Processing Foundation</a>.
+        Licensed under{" "}
+        <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+
+
+{example.data.remix?.map((item, i) => (
+  <>
+    {i > 0 && " "}
+    {item.remixLabel && item.remixURL ? (
+      <>
+        <a href={item.remixURL}>{item.remixLabel}</a>
+        {item.attributionLabel && (
+          <>
+            {" "}by{" "}
+            {item.attributionURL ? (
+              <a href={item.attributionURL}>{item.attributionLabel}</a>
+            ) : (
+              item.attributionName
+            )}
+          </>
+        )}
+      </>
+    ) : item.attributionLabel ? (
+      <>
+        Remixed from{" "}
+        {item.attributionURL ? (
+          <a href={item.attributionURL}>{item.attributionLabel}</a>
+        ) : (
+          item.attributionName
+        )}
+      </>
+    ) : null}
+    {i < example.data.remix.length - 1 && "."}
+  </>
+))}
+
 
       </p>
       <img src="/images/by-nc-sa.svg" />

From f41a6fbe558daf8fcd0713f9339e45d1833c911f Mon Sep 17 00:00:00 2001
From: ksen0 <katie.kuksenok@gmail.com>
Date: Sat, 31 May 2025 10:05:50 +0200
Subject: [PATCH 03/10] Improved remix attribution schema

---
 .../00_Shape_Primitives/description.mdx              |  5 +++++
 .../03_Smoke_Particle_System/description.mdx         | 12 ++++++------
 src/layouts/ExampleLayout.astro                      |  9 ++++-----
 3 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx b/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
index 428f348709..446cb9607c 100644
--- a/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
+++ b/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
@@ -6,6 +6,11 @@ oneLineDescription: Draw 2D shapes.
 relatedReference:
   - en/p5/arc
   - en/p5/ellipse
+remix:
+  - attributionURL: https://github.com/dkessner
+    attributionLabel: Darren Kessner
+    remixURL: https://github.com/processing/p5.js-example
+    remixLabel: Revised in 2023
 ---
 
 This program demonstrates the use of the basic shape
diff --git a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
index 80f84f80f2..1b996d1eb5 100644
--- a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
@@ -5,12 +5,12 @@ title: Smoke Particles
 oneLineDescription: Simulate smoke with a particle system.
 featured: true
 remix:
- - attributionURL: https://github.com/dkessner
-   attributionLabel: Darren Kessner
-   remixURL: https://github.com/processing/p5.js-example
-   remixLabel: Revised in 2023
- - attributionURL: https://natureofcode.com/book/chapter-4-particle-systems/
-   attributionLabel: Dan Shiffman's example
+  - attributionURL: https://github.com/dkessner
+    attributionLabel: Darren Kessner
+    remixURL: https://github.com/processing/p5.js-example
+    remixLabel: Revised in 2023
+  - attributionURL: https://natureofcode.com/book/chapter-4-particle-systems/
+    attributionLabel: Dan Shiffman's example
 
 ---
 
diff --git a/src/layouts/ExampleLayout.astro b/src/layouts/ExampleLayout.astro
index c7c414b14a..88f79202d0 100644
--- a/src/layouts/ExampleLayout.astro
+++ b/src/layouts/ExampleLayout.astro
@@ -87,8 +87,8 @@ const { Content } = await example.render();
             {item.attributionURL ? (
               <a href={item.attributionURL}>{item.attributionLabel}</a>
             ) : (
-              item.attributionName
-            )}
+              item.attributionLabel
+            )}.
           </>
         )}
       </>
@@ -98,11 +98,10 @@ const { Content } = await example.render();
         {item.attributionURL ? (
           <a href={item.attributionURL}>{item.attributionLabel}</a>
         ) : (
-          item.attributionName
-        )}
+          item.attributionLabel
+        )}.
       </>
     ) : null}
-    {i < example.data.remix.length - 1 && "."}
   </>
 ))}
 

From f9596c74aa645b393f1b341139ee873965e1d0b6 Mon Sep 17 00:00:00 2001
From: ksen0 <katie.kuksenok@gmail.com>
Date: Mon, 2 Jun 2025 22:17:07 +0200
Subject: [PATCH 04/10] Use specified year for collective attribution where
 applicable

---
 src/content/examples/config.ts                |  6 ++
 .../00_Shape_Primitives/description.mdx       |  1 +
 .../03_Smoke_Particle_System/description.mdx  |  7 +-
 src/layouts/ExampleLayout.astro               | 76 ++++++++++---------
 4 files changed, 53 insertions(+), 37 deletions(-)

diff --git a/src/content/examples/config.ts b/src/content/examples/config.ts
index 9e00cea4fd..e0754b7357 100644
--- a/src/content/examples/config.ts
+++ b/src/content/examples/config.ts
@@ -8,15 +8,21 @@ export const examplesCollection = defineCollection({
   type: "content",
   schema: ({ image }) =>
     z.object({
+      
       // Title of the example
       title: z.string(),
       oneLineDescription: z.string(),
+
       // Aria label used for the live example code
       arialabel: z.string().optional(),
       featured: z.boolean().optional(),
       relatedReference: z.array(reference("reference")).optional(),
       featuredImage: image(),
       featuredImageAlt: z.string().optional().default(""),
+
+      // Start of collective attribution
+      collectivelyAttributedSince: z.number().optional(),
+      
       // Optional list of remixes to add to license
       remix: z
         .array(
diff --git a/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx b/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
index 446cb9607c..100759e036 100644
--- a/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
+++ b/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
@@ -6,6 +6,7 @@ oneLineDescription: Draw 2D shapes.
 relatedReference:
   - en/p5/arc
   - en/p5/ellipse
+
 remix:
   - attributionURL: https://github.com/dkessner
     attributionLabel: Darren Kessner
diff --git a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
index 1b996d1eb5..7b715eb7fb 100644
--- a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
@@ -4,14 +4,15 @@ featuredImageAlt: Rainbow colored smoke angled towards the right of the canvas,
 title: Smoke Particles
 oneLineDescription: Simulate smoke with a particle system.
 featured: true
+
+collectivelyAttributedSince: 2024
 remix:
+  - attributionURL: https://natureofcode.com/book/chapter-4-particle-systems/
+    attributionLabel: Dan Shiffman's example
   - attributionURL: https://github.com/dkessner
     attributionLabel: Darren Kessner
     remixURL: https://github.com/processing/p5.js-example
     remixLabel: Revised in 2023
-  - attributionURL: https://natureofcode.com/book/chapter-4-particle-systems/
-    attributionLabel: Dan Shiffman's example
-
 ---
 
 
diff --git a/src/layouts/ExampleLayout.astro b/src/layouts/ExampleLayout.astro
index 88f79202d0..421d3370a4 100644
--- a/src/layouts/ExampleLayout.astro
+++ b/src/layouts/ExampleLayout.astro
@@ -66,45 +66,53 @@ const { Content } = await example.render();
     <div class="rendered-markdown">
       <p>
 
-        <a href={Astro.url.pathname}>{example.data.title}</a>:
-        Edited and maintained by
-        <a href="https://github.com/processing/p5.js?tab=readme-ov-file#contributors">p5.js Contributors</a>
-        and the
-        <a href="https://processingfoundation.org/people">Processing Foundation</a>.
-        Licensed under{" "}
-        <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+        <a href={Astro.url.pathname}>{example.data.title}</a>:   
 
+        {example.data.remix?.map((item, i) => (
+          <>
+            {i > 0 && " "}
+            {item.remixLabel && item.remixURL ? (
+              <>
+                <a href={item.remixURL}>{item.remixLabel}</a>
+                {item.attributionLabel && (
+                  <>
+                    {" "}by{" "}
+                    {item.attributionURL ? (
+                      <a href={item.attributionURL}>{item.attributionLabel}</a>
+                    ) : (
+                      item.attributionLabel
+                    )}.
+                  </>
+                )}
+              </>
+            ) : item.attributionLabel ? (
+              <>
+                Remixed from{" "}
+                {item.attributionURL ? (
+                  <a href={item.attributionURL}>{item.attributionLabel}</a>
+                ) : (
+                  item.attributionLabel
+                )}.
+              </>
+            ) : null}
+          </>
+        ))}
 
-{example.data.remix?.map((item, i) => (
-  <>
-    {i > 0 && " "}
-    {item.remixLabel && item.remixURL ? (
-      <>
-        <a href={item.remixURL}>{item.remixLabel}</a>
-        {item.attributionLabel && (
+        {example.data.collectivelyAttributedSince ? (
           <>
-            {" "}by{" "}
-            {item.attributionURL ? (
-              <a href={item.attributionURL}>{item.attributionLabel}</a>
-            ) : (
-              item.attributionLabel
-            )}.
+            From {example.data.collectivelyAttributedSince} onwards, edited and maintained by
           </>
-        )}
-      </>
-    ) : item.attributionLabel ? (
-      <>
-        Remixed from{" "}
-        {item.attributionURL ? (
-          <a href={item.attributionURL}>{item.attributionLabel}</a>
         ) : (
-          item.attributionLabel
-        )}.
-      </>
-    ) : null}
-  </>
-))}
-
+          <>
+            Edited and maintained by
+          </>
+        )}
+        
+        <a href="https://github.com/processing/p5.js?tab=readme-ov-file#contributors">p5.js Contributors</a>
+        and the
+        <a href="https://processingfoundation.org/people">Processing Foundation</a>.
+        Licensed under{" "}
+        <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
 
       </p>
       <img src="/images/by-nc-sa.svg" />

From 8b3d87fc50718855b8ba86b48341c9ab39711e2c Mon Sep 17 00:00:00 2001
From: ksen0 <katie.kuksenok@gmail.com>
Date: Mon, 2 Jun 2025 22:44:06 +0200
Subject: [PATCH 05/10] Use remixLookup to reduce duplicate .mdx headers

---
 src/content/examples/config.ts                | 45 ++++++++++++++++---
 .../00_Shape_Primitives/description.mdx       |  5 +--
 .../00_Drawing_Lines/description.mdx          |  6 +++
 .../01_Animation_With_Events/description.mdx  |  3 ++
 .../03_Smoke_Particle_System/description.mdx  |  5 +--
 src/layouts/ExampleLayout.astro               |  9 +++-
 6 files changed, 57 insertions(+), 16 deletions(-)

diff --git a/src/content/examples/config.ts b/src/content/examples/config.ts
index e0754b7357..466ff3bf56 100644
--- a/src/content/examples/config.ts
+++ b/src/content/examples/config.ts
@@ -1,5 +1,6 @@
 import { z, defineCollection, reference } from "astro:content";
 
+
 /**
  * Content collection for the Examples section of the site.
  * Each file represents a single example.
@@ -22,19 +23,49 @@ export const examplesCollection = defineCollection({
 
       // Start of collective attribution
       collectivelyAttributedSince: z.number().optional(),
-      
+
       // Optional list of remixes to add to license
       remix: z
         .array(
-          z.object({
-            attributionURL: z.string().optional(),
-            attributionLabel: z.string().optional(),
-            remixURL: z.string().optional(),
-            remixLabel: z.string().optional(),
-          })
+          z.union([
+            z.string(),
+            z.object({
+              attributionURL: z.string().optional(),
+              attributionLabel: z.string().optional(),
+              remixURL: z.string().optional(),
+              remixLabel: z.string().optional(),
+            }),
+          ])
         )
         .optional()
         .default([]),
     }),
 });
 
+/**
+ * The `remix` field lets you add remix attributions in two ways:
+ * 1. Full objects with all details.
+ * 2. Short string keys that refer to predefined entries in `remixLookup`.
+ * When rendering (in ExampleLayout.astro), these keys are replaced 
+ * with their full details from `remixLookup`.
+ */
+export const remixLookup = {
+  "revision-2023-calebfoss": {
+    attributionURL: "https://github.com/calebfoss",
+    attributionLabel: "Caleb calebfoss",
+    remixURL: "https://github.com/processing/p5.js-example",
+    remixLabel: "Revised in 2023",
+  },
+  "revision-2023-dkessner": {
+    attributionURL: "https://github.com/dkessner",
+    attributionLabel: "Darren Kessner",
+    remixURL: "https://github.com/processing/p5.js-example",
+    remixLabel: "Revised in 2023",
+  },
+  "revision-2023-katlich112358": {
+    attributionURL: "https://www.klich.co/",
+    attributionLabel: "Kasey Lichtlyter",
+    remixURL: "https://github.com/processing/p5.js-example",
+    remixLabel: "Revised in 2023",
+  }
+};
\ No newline at end of file
diff --git a/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx b/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
index 100759e036..874488eee3 100644
--- a/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
+++ b/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
@@ -8,10 +8,7 @@ relatedReference:
   - en/p5/ellipse
 
 remix:
-  - attributionURL: https://github.com/dkessner
-    attributionLabel: Darren Kessner
-    remixURL: https://github.com/processing/p5.js-example
-    remixLabel: Revised in 2023
+  - revision-2023-dkessner
 ---
 
 This program demonstrates the use of the basic shape
diff --git a/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx b/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx
index f0daf5f661..f5a55e9364 100644
--- a/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx
+++ b/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx
@@ -3,6 +3,12 @@ featuredImage: "../../../images/featured/02_Animation_And_Variables-00_Drawing_L
 featuredImageAlt: A squiggly rainbow line on a black background.
 title: Drawing Lines
 oneLineDescription: Draw with the mouse.
+
+remix:
+  - attributionURL: https://github.com/dkessner
+    attributionLabel: Darren Kessner
+    remixURL: https://github.com/processing/p5.js-example
+    remixLabel: Revised in 2023
 ---
 
 Click and drag the mouse to draw a line.
diff --git a/src/content/examples/en/02_Animation_And_Variables/01_Animation_With_Events/description.mdx b/src/content/examples/en/02_Animation_And_Variables/01_Animation_With_Events/description.mdx
index 8d3c017894..8c5d2ba6ca 100644
--- a/src/content/examples/en/02_Animation_And_Variables/01_Animation_With_Events/description.mdx
+++ b/src/content/examples/en/02_Animation_And_Variables/01_Animation_With_Events/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/02_Animation_And_Variables-01_Animation
 featuredImageAlt: A small green circle on a black background.
 title: Animation with Events
 oneLineDescription: Pause and resume animation.
+
+remix:
+  - revision-2023-dkessner
 ---
 
 This example demonstrates the use of
diff --git a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
index 7b715eb7fb..b7a9800888 100644
--- a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
@@ -9,10 +9,7 @@ collectivelyAttributedSince: 2024
 remix:
   - attributionURL: https://natureofcode.com/book/chapter-4-particle-systems/
     attributionLabel: Dan Shiffman's example
-  - attributionURL: https://github.com/dkessner
-    attributionLabel: Darren Kessner
-    remixURL: https://github.com/processing/p5.js-example
-    remixLabel: Revised in 2023
+  - revision-2023-dkessner
 ---
 
 
diff --git a/src/layouts/ExampleLayout.astro b/src/layouts/ExampleLayout.astro
index 421d3370a4..0cab3aa885 100644
--- a/src/layouts/ExampleLayout.astro
+++ b/src/layouts/ExampleLayout.astro
@@ -2,6 +2,7 @@
 import type { CollectionEntry } from "astro:content";
 import Head from "@components/Head/index.astro";
 import { setJumpToState } from "../globals/state";
+import { remixLookup } from "../content/examples/config";
 import { getCurrentLocale, getUiTranslator } from "../i18n/utils";
 import {
   generateJumpToState,
@@ -41,6 +42,12 @@ const relatedReferences =
       )
     : [];
 
+// Rather than using example.data.remix, use resolvedRemix
+// Which fills in widely-used attributions to avoid duplication
+const resolvedRemix = example.data.remix.map((entry: any) =>
+  typeof entry === "string" ? remixLookup[entry] : entry
+);
+
 const { Content } = await example.render();
 ---
 
@@ -68,7 +75,7 @@ const { Content } = await example.render();
 
         <a href={Astro.url.pathname}>{example.data.title}</a>:   
 
-        {example.data.remix?.map((item, i) => (
+        {resolvedRemix?.map((item, i) => (
           <>
             {i > 0 && " "}
             {item.remixLabel && item.remixURL ? (

From 0d50ad0f25d0789ad38541481fabe04bb478940e Mon Sep 17 00:00:00 2001
From: ksen0 <katie.kuksenok@gmail.com>
Date: Mon, 2 Jun 2025 22:54:26 +0200
Subject: [PATCH 06/10] Add 2023 revision attributions

---
 src/content/examples/config.ts                 | 18 +++++++++++++-----
 .../00_Drawing_Lines/description.mdx           |  5 +----
 .../02_Mobile_Device_Movement/description.mdx  |  4 ++++
 .../03_Conditions/description.mdx              |  6 ++++++
 .../03_Imported_Media/00_Words/description.mdx |  3 +++
 .../01_Copy_Image_Data/description.mdx         |  3 +++
 .../02_Alpha_Mask/description.mdx              |  3 +++
 .../03_Image_Transparency/description.mdx      |  3 +++
 .../04_Create_Audio/description.mdx            |  3 +++
 .../03_Imported_Media/05_Video/description.mdx |  3 +++
 .../06_Video_Canvas/description.mdx            |  3 +++
 .../00_Image_Drop/description.mdx              |  3 +++
 .../01_Input_Button/description.mdx            |  3 +++
 .../02_DOM_Form_Elements/description.mdx       |  6 ++++++
 .../01_Rotate/description.mdx                  |  3 +++
 .../05_Transformation/02_Scale/description.mdx |  4 ++++
 .../02_Random/description.mdx                  |  3 +++
 .../03_Constrain/description.mdx               |  3 +++
 .../04_Clock/description.mdx                   |  3 +++
 .../00_Color_Interpolation/description.mdx     |  3 +++
 .../01_Color_Wheel/description.mdx             |  5 +++++
 .../en/07_Repetition/02_Bezier/description.mdx |  3 +++
 .../03_Kaleidoscope/description.mdx            |  3 +++
 .../05_Recursive_Tree/description.mdx          |  8 ++++++++
 .../00_Random_Poetry/description.mdx           |  5 +++++
 .../00_Sine_Cosine/description.mdx             |  3 +++
 .../01_Aim/description.mdx                     |  3 +++
 .../02_Triangle_Strip/description.mdx          |  7 +++++++
 .../en/10_Games/02_Snake/description.mdx       |  6 ++++++
 .../en/11_3D/00_Geometries/description.mdx     |  3 +++
 .../en/11_3D/02_Materials/description.mdx      |  3 +++
 .../en/11_3D/03_Orbit_Control/description.mdx  |  3 +++
 .../11_3D/06_Framebuffer_Blur/description.mdx  |  3 +++
 .../00_Create_Graphics/description.mdx         |  3 +++
 .../02_Shader_As_A_Texture/description.mdx     |  3 +++
 .../00_Snowflakes/description.mdx              |  6 ++++++
 .../01_Shake_Ball_Bounce/description.mdx       |  3 +++
 .../02_Connected_Particles/description.mdx     |  3 +++
 .../03_Flocking/description.mdx                |  3 +++
 .../01_JSON/description.mdx                    |  6 ++++++
 .../02_Table/description.mdx                   |  7 +++++++
 .../description.mdx                            |  9 +++++++++
 .../01_Soft_Body/description.mdx               |  6 ++++++
 .../02_Forces/description.mdx                  |  7 ++++++-
 .../04_Game_Of_Life/description.mdx            |  6 ++++++
 .../05_Mandelbrot/description.mdx              |  9 ++++++---
 src/layouts/ExampleLayout.astro                | 13 ++++++++++---
 47 files changed, 208 insertions(+), 16 deletions(-)

diff --git a/src/content/examples/config.ts b/src/content/examples/config.ts
index 466ff3bf56..2d26a49d4c 100644
--- a/src/content/examples/config.ts
+++ b/src/content/examples/config.ts
@@ -49,10 +49,18 @@ export const examplesCollection = defineCollection({
  * When rendering (in ExampleLayout.astro), these keys are replaced 
  * with their full details from `remixLookup`.
  */
-export const remixLookup = {
+
+type RemixEntry = {
+  attributionURL: string;
+  attributionLabel: string;
+  remixURL: string;
+  remixLabel: string;
+};
+
+export const remixLookup: { [key: string]: RemixEntry } = {
   "revision-2023-calebfoss": {
     attributionURL: "https://github.com/calebfoss",
-    attributionLabel: "Caleb calebfoss",
+    attributionLabel: "Caleb Foss",
     remixURL: "https://github.com/processing/p5.js-example",
     remixLabel: "Revised in 2023",
   },
@@ -62,10 +70,10 @@ export const remixLookup = {
     remixURL: "https://github.com/processing/p5.js-example",
     remixLabel: "Revised in 2023",
   },
-  "revision-2023-katlich112358": {
+  "revision-2023-klich": {
     attributionURL: "https://www.klich.co/",
     attributionLabel: "Kasey Lichtlyter",
     remixURL: "https://github.com/processing/p5.js-example",
     remixLabel: "Revised in 2023",
-  }
-};
\ No newline at end of file
+  },
+};
diff --git a/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx b/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx
index f5a55e9364..7f231014fe 100644
--- a/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx
+++ b/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx
@@ -5,10 +5,7 @@ title: Drawing Lines
 oneLineDescription: Draw with the mouse.
 
 remix:
-  - attributionURL: https://github.com/dkessner
-    attributionLabel: Darren Kessner
-    remixURL: https://github.com/processing/p5.js-example
-    remixLabel: Revised in 2023
+  - revision-2023-dkessner
 ---
 
 Click and drag the mouse to draw a line.
diff --git a/src/content/examples/en/02_Animation_And_Variables/02_Mobile_Device_Movement/description.mdx b/src/content/examples/en/02_Animation_And_Variables/02_Mobile_Device_Movement/description.mdx
index 8ea19ec820..c3db5d4e5d 100644
--- a/src/content/examples/en/02_Animation_And_Variables/02_Mobile_Device_Movement/description.mdx
+++ b/src/content/examples/en/02_Animation_And_Variables/02_Mobile_Device_Movement/description.mdx
@@ -4,6 +4,10 @@ featuredImageAlt: White circles on a black background, with varying degrees of t
 title: Mobile Device Movement
 oneLineDescription: Animate based on device motion.
 featured: true
+
+
+remix:
+  - revision-2023-klich
 ---
 
 The <a href="https://p5js.org/reference/p5/deviceMoved" target="_blank">deviceMoved()</a>
diff --git a/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx b/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx
index 297fb5a6bc..a12fac16dd 100644
--- a/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx
+++ b/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx
@@ -3,6 +3,12 @@ featuredImage: "../../../images/featured/02_Animation_And_Variables-03_Condition
 featuredImageAlt: A small black circle on a rainbow, lattice-shaped path, on top of a grey and white striped background.
 title: Conditions
 oneLineDescription: Use if and else statements to make decisions while your sketch runs.
+
+collectivelyAttributedSince: 2024
+remix:
+  - attributionURL: https://people.rit.edu/wmhics/
+    attributionLabel: Prof. WM Harris
+  - revision-2023-calebfoss
 ---
 
 If and else statements allow a
diff --git a/src/content/examples/en/03_Imported_Media/00_Words/description.mdx b/src/content/examples/en/03_Imported_Media/00_Words/description.mdx
index 090c1dda4a..558746e2d7 100644
--- a/src/content/examples/en/03_Imported_Media/00_Words/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/00_Words/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/03_Imported_Media-00_Words-thumbnail.pn
 featuredImageAlt: Three columns of the words “ichi,” “ni,” “san,” and “shi” on a white background. The first column is right aligned, the middle column is center aligned, and the left column is left aligned.
 title: Words
 oneLineDescription: Load fonts and draw text.
+
+remix:
+  - revision-2023-klich
 ---
 
 The <a href="https://p5js.org/reference/p5/text" target="_blank">text()</a> function is used for inserting text into the canvas.
diff --git a/src/content/examples/en/03_Imported_Media/01_Copy_Image_Data/description.mdx b/src/content/examples/en/03_Imported_Media/01_Copy_Image_Data/description.mdx
index e4c390873e..c1e107e2b0 100644
--- a/src/content/examples/en/03_Imported_Media/01_Copy_Image_Data/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/01_Copy_Image_Data/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/03_Imported_Media-01_Copy_Image_Data-th
 featuredImageAlt: Black-and-white photograph of a parrot. A curvy line is drawn across the image; within the confines of that line, color is added to the photograph.
 title: Copy Image Data
 oneLineDescription: Paint from an image file onto the canvas.
+
+remix:
+  - revision-2023-klich
 ---
 
 Using the <a href="https://p5js.org/reference/p5/copy" target="_blank">copy()</a> 
diff --git a/src/content/examples/en/03_Imported_Media/02_Alpha_Mask/description.mdx b/src/content/examples/en/03_Imported_Media/02_Alpha_Mask/description.mdx
index 7604d191fb..822417fc00 100644
--- a/src/content/examples/en/03_Imported_Media/02_Alpha_Mask/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/02_Alpha_Mask/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/03_Imported_Media-02_Alpha_Mask-thumbna
 featuredImageAlt: Two leaf sprigs side by side on a white background. The right sprig is labeled "Mask." The left sprig is labeled "Masked Image," and uses the shape of the right sprig to mask a photograph of tulips.
 title: Alpha Mask
 oneLineDescription: Use one image to cut out a section of another image.
+
+remix:
+  - revision-2023-klich
 ---
 
 Using the 
diff --git a/src/content/examples/en/03_Imported_Media/03_Image_Transparency/description.mdx b/src/content/examples/en/03_Imported_Media/03_Image_Transparency/description.mdx
index 721c4a6df6..f146a2ff2f 100644
--- a/src/content/examples/en/03_Imported_Media/03_Image_Transparency/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/03_Image_Transparency/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/03_Imported_Media-03_Image_Transparency
 featuredImageAlt: An astronaut on a planet as the background with a slightly transparent version of this image overlaid and to the left.
 title: Image Transparency
 oneLineDescription: Make an image translucent on the canvas.
+
+remix:
+  - revision-2023-klich
 ---
 
 This program overlays one image over another by modifying the
diff --git a/src/content/examples/en/03_Imported_Media/04_Create_Audio/description.mdx b/src/content/examples/en/03_Imported_Media/04_Create_Audio/description.mdx
index 838e9c70b5..755a221177 100644
--- a/src/content/examples/en/03_Imported_Media/04_Create_Audio/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/04_Create_Audio/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/03_Imported_Media-04_Create_Audio-thumb
 featuredImageAlt: A close up of an audio player timestamp, reading "0:00 / 2."
 title: Audio Player
 oneLineDescription: Create a player for an audio file.
+
+remix:
+  - revision-2023-klich
 ---
 
 <a href="https://p5js.org/reference/p5/createAudio" target="_blank">createAudio()</a>
diff --git a/src/content/examples/en/03_Imported_Media/05_Video/description.mdx b/src/content/examples/en/03_Imported_Media/05_Video/description.mdx
index ab11e9875b..990922690a 100644
--- a/src/content/examples/en/03_Imported_Media/05_Video/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/05_Video/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/03_Imported_Media-05_Video-thumbnail.pn
 featuredImageAlt: A screenshot of a video of a hand, with the pointer finger touching a desk.
 title: Video Player
 oneLineDescription: Create a player for a video file.
+
+remix:
+  - revision-2023-klich
 ---
 
 Using the <a href="https://p5js.org/reference/p5/noCanvas" target="_blank">noCanvas()</a>
diff --git a/src/content/examples/en/03_Imported_Media/06_Video_Canvas/description.mdx b/src/content/examples/en/03_Imported_Media/06_Video_Canvas/description.mdx
index abc0671e2b..79b675439f 100644
--- a/src/content/examples/en/03_Imported_Media/06_Video_Canvas/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/06_Video_Canvas/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/03_Imported_Media-06_Video_Canvas-thumb
 featuredImageAlt: Two overlaid screenshots of a video of a hand, with the pointer finger touching a desk. Text to the top right of the screenshot reads "Click the canvas to start and pause the video feed."
 title: Video on Canvas
 oneLineDescription: Display and stylize a video on the canvas.
+
+remix:
+  - revision-2023-klich
 ---
 
 Using the 
diff --git a/src/content/examples/en/04_Input_Elements/00_Image_Drop/description.mdx b/src/content/examples/en/04_Input_Elements/00_Image_Drop/description.mdx
index c6ae66cc35..5c9ddaf445 100644
--- a/src/content/examples/en/04_Input_Elements/00_Image_Drop/description.mdx
+++ b/src/content/examples/en/04_Input_Elements/00_Image_Drop/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/04_Input_Elements-00_Image_Drop-thumbna
 featuredImageAlt: A grey background with white text reading "Drag an image file onto the canvas."
 title: Image Drop
 oneLineDescription: Display an image that the page visitor dragged and dropped.
+
+remix:
+  - revision-2023-klich
 ---
 
 <a href="https://p5js.org/reference/p5.Element/drop" target="_blank">drop()</a>
diff --git a/src/content/examples/en/04_Input_Elements/01_Input_Button/description.mdx b/src/content/examples/en/04_Input_Elements/01_Input_Button/description.mdx
index 7d7ead2113..8aaaef15f0 100644
--- a/src/content/examples/en/04_Input_Elements/01_Input_Button/description.mdx
+++ b/src/content/examples/en/04_Input_Elements/01_Input_Button/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/04_Input_Elements-01_Input_Button-thumb
 featuredImageAlt: An input field with a submit button, labeled "Hello, p5!"
 title: Input and Button
 oneLineDescription: Use text input from the page visitor.
+
+remix:
+  - revision-2023-klich
 ---
 
 Using the 
diff --git a/src/content/examples/en/04_Input_Elements/02_DOM_Form_Elements/description.mdx b/src/content/examples/en/04_Input_Elements/02_DOM_Form_Elements/description.mdx
index aa49815b6c..95a36c6068 100644
--- a/src/content/examples/en/04_Input_Elements/02_DOM_Form_Elements/description.mdx
+++ b/src/content/examples/en/04_Input_Elements/02_DOM_Form_Elements/description.mdx
@@ -3,6 +3,12 @@ featuredImage: "../../../images/featured/04_Input_Elements-02_DOM_Form_Elements-
 featuredImageAlt: A survey on a yellow background, consisting of an input field, radio buttons, and a dropdown.
 title: Form Elements
 oneLineDescription: Create a form and respond to the results.
+
+collectivelyAttributedSince: 2024
+remix:
+  - attributionURL: https://people.rit.edu/wmhics/
+    attributionLabel: Prof. WM Harris
+  - revision-2023-klich
 ---
 
 The <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model" target="_blank">Document Object Model</a>,
diff --git a/src/content/examples/en/05_Transformation/01_Rotate/description.mdx b/src/content/examples/en/05_Transformation/01_Rotate/description.mdx
index 1f91b03b41..2e33a07cba 100644
--- a/src/content/examples/en/05_Transformation/01_Rotate/description.mdx
+++ b/src/content/examples/en/05_Transformation/01_Rotate/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/05_Transformation-01_Rotate-thumbnail.p
 featuredImageAlt: Line segments rotated around center of canvas.
 title: Rotate
 oneLineDescription: Rotate the coordinate system.
+
+remix:
+  - revision-2023-dkessner
 ---
 
 The
diff --git a/src/content/examples/en/05_Transformation/02_Scale/description.mdx b/src/content/examples/en/05_Transformation/02_Scale/description.mdx
index da58a33f62..60e9940e75 100644
--- a/src/content/examples/en/05_Transformation/02_Scale/description.mdx
+++ b/src/content/examples/en/05_Transformation/02_Scale/description.mdx
@@ -3,6 +3,10 @@ featuredImage: "../../../images/featured/05_Transformation-02_Scale-thumbnail.pn
 featuredImageAlt: Solid rectangles stacked on top of one another.
 title: Scale
 oneLineDescription: Modify the coordinate system scale.
+
+
+remix:
+  - revision-2023-dkessner
 ---
 
 The
diff --git a/src/content/examples/en/06_Calculating_Values/02_Random/description.mdx b/src/content/examples/en/06_Calculating_Values/02_Random/description.mdx
index 365d892ea2..fe02650737 100644
--- a/src/content/examples/en/06_Calculating_Values/02_Random/description.mdx
+++ b/src/content/examples/en/06_Calculating_Values/02_Random/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/06_Calculating_Values-02_Random-thumbna
 featuredImageAlt: A small purple circle on a black background.
 title: Random
 oneLineDescription: Get random numbers.
+
+remix:
+  - revision-2023-dkessner
 ---
 
 This example demonstrates the use of the
diff --git a/src/content/examples/en/06_Calculating_Values/03_Constrain/description.mdx b/src/content/examples/en/06_Calculating_Values/03_Constrain/description.mdx
index 0070e64ac0..ca3aa8514a 100644
--- a/src/content/examples/en/06_Calculating_Values/03_Constrain/description.mdx
+++ b/src/content/examples/en/06_Calculating_Values/03_Constrain/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/06_Calculating_Values-03_Constrain-thum
 featuredImageAlt: A small white circle in a pink rectangle.
 title: Constrain
 oneLineDescription: Keep a number within a range.
+
+remix:
+  - revision-2023-calebfoss
 ---
 
 This example draws a circle as the cursor's position but
diff --git a/src/content/examples/en/06_Calculating_Values/04_Clock/description.mdx b/src/content/examples/en/06_Calculating_Values/04_Clock/description.mdx
index ac025db0f0..eaa8dfb51c 100644
--- a/src/content/examples/en/06_Calculating_Values/04_Clock/description.mdx
+++ b/src/content/examples/en/06_Calculating_Values/04_Clock/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/06_Calculating_Values-04_Clock-thumbnai
 featuredImageAlt: A pink clock on a grey background.
 title: Clock
 oneLineDescription: Get the current time.
+
+remix:
+  - revision-2023-calebfoss
 ---
 
 The current time can be read with the
diff --git a/src/content/examples/en/07_Repetition/00_Color_Interpolation/description.mdx b/src/content/examples/en/07_Repetition/00_Color_Interpolation/description.mdx
index 3869f44e00..f884ca4bf0 100644
--- a/src/content/examples/en/07_Repetition/00_Color_Interpolation/description.mdx
+++ b/src/content/examples/en/07_Repetition/00_Color_Interpolation/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/07_Repetition-00_Color_Interpolation-th
 featuredImageAlt: Horizontal stripes fading between light green at the top and dark blue at the bottom.
 title: Color Interpolation
 oneLineDescription: Fade between two colors.
+
+remix:
+  - revision-2023-calebfoss
 ---
 
 <a href="https://developer.mozilla.org/en-US/docs/Glossary/Interpolation" target="_blank">Interpolation</a>
diff --git a/src/content/examples/en/07_Repetition/01_Color_Wheel/description.mdx b/src/content/examples/en/07_Repetition/01_Color_Wheel/description.mdx
index 3694fc9147..5200fea8d9 100644
--- a/src/content/examples/en/07_Repetition/01_Color_Wheel/description.mdx
+++ b/src/content/examples/en/07_Repetition/01_Color_Wheel/description.mdx
@@ -3,6 +3,11 @@ featuredImage: "../../../images/featured/07_Repetition-01_Color_Wheel-thumbnail.
 featuredImageAlt: Small circles, each with a different color, arranged in a circular path, displaying hues across the color spectrum.
 title: Color Wheel
 oneLineDescription: Create a visualization of the color spectrum.
+
+collectivelyAttributedSince: 2024
+remix:
+  - attributionLabel: malayvasa2001
+  - revision-2023-calebfoss
 ---
 
 This example illustrates the appearance of different
diff --git a/src/content/examples/en/07_Repetition/02_Bezier/description.mdx b/src/content/examples/en/07_Repetition/02_Bezier/description.mdx
index e35ad36fb9..f422c462e0 100644
--- a/src/content/examples/en/07_Repetition/02_Bezier/description.mdx
+++ b/src/content/examples/en/07_Repetition/02_Bezier/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/07_Repetition-02_Bezier-thumbnail.png"
 featuredImageAlt: Ten rainbow-colored lines in a bezier curve formation.
 title: Bezier
 oneLineDescription: Draw a set of curves.
+
+remix:
+  - revision-2023-klich
 ---
 
 <a href="https://p5js.org/reference/p5/bezier" target="_blank">bezier()</a> 
diff --git a/src/content/examples/en/07_Repetition/03_Kaleidoscope/description.mdx b/src/content/examples/en/07_Repetition/03_Kaleidoscope/description.mdx
index a80556e62c..673af1a32f 100644
--- a/src/content/examples/en/07_Repetition/03_Kaleidoscope/description.mdx
+++ b/src/content/examples/en/07_Repetition/03_Kaleidoscope/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/07_Repetition-03_Kaleidoscope-thumbnail
 featuredImageAlt: Dark grey canvas that reflects the lines drawn within it in symmetrical sections.
 title: Kaleidoscope
 oneLineDescription: Draw mirrored designs with the mouse.
+
+remix:
+  - revision-2023-klich
 ---
 
 A kaleidoscope is an optical instrument with two or more
diff --git a/src/content/examples/en/07_Repetition/05_Recursive_Tree/description.mdx b/src/content/examples/en/07_Repetition/05_Recursive_Tree/description.mdx
index 3dc64ca3e0..761934d8ed 100644
--- a/src/content/examples/en/07_Repetition/05_Recursive_Tree/description.mdx
+++ b/src/content/examples/en/07_Repetition/05_Recursive_Tree/description.mdx
@@ -3,6 +3,14 @@ featuredImage: "../../../images/featured/07_Repetition-05_Recursive_Tree-thumbna
 featuredImageAlt: A rainbow fractal tree on a black background.
 title: Recursive Tree
 oneLineDescription: Draw a tree using a function that calls itself.
+
+
+remix:
+  - attributionURL: https://processing.org/examples/tree.html
+    attributionLabel: Processing example by Dan Shiffman
+    remixLabel: Based on
+  - revision-2023-dkessner
+collectivelyAttributedSince: 2024
 ---
 
 This is an example of rendering a simple tree-like structure via recursion.
diff --git a/src/content/examples/en/08_Listing_Data_with_Arrays/00_Random_Poetry/description.mdx b/src/content/examples/en/08_Listing_Data_with_Arrays/00_Random_Poetry/description.mdx
index 3973b01018..db1b021fc2 100644
--- a/src/content/examples/en/08_Listing_Data_with_Arrays/00_Random_Poetry/description.mdx
+++ b/src/content/examples/en/08_Listing_Data_with_Arrays/00_Random_Poetry/description.mdx
@@ -3,6 +3,11 @@ featuredImage: "../../../images/featured/08_Listing_Data_with_Arrays-00_Random_P
 featuredImageAlt: A random series of words related to p5.js scattered on a maroon background.
 title: Random Poetry
 oneLineDescription: Generate a poem with words randomly selected from a bank.
+
+collectivelyAttributedSince: 2024
+remix:
+  - attributionLabel: malayvasa2001
+  - revision-2023-klich
 ---
 
 Using the
diff --git a/src/content/examples/en/09_Angles_And_Motion/00_Sine_Cosine/description.mdx b/src/content/examples/en/09_Angles_And_Motion/00_Sine_Cosine/description.mdx
index d711139ae7..3584b57731 100644
--- a/src/content/examples/en/09_Angles_And_Motion/00_Sine_Cosine/description.mdx
+++ b/src/content/examples/en/09_Angles_And_Motion/00_Sine_Cosine/description.mdx
@@ -4,6 +4,9 @@ featuredImageAlt: A point on the unit circle, together with the corresponding si
 title: Sine and Cosine
 oneLineDescription: Animate circular, back and forth, and wave motion.
 featured: true
+
+remix:
+  - revision-2023-dkessner
 ---
 
 This example demonstrates the
diff --git a/src/content/examples/en/09_Angles_And_Motion/01_Aim/description.mdx b/src/content/examples/en/09_Angles_And_Motion/01_Aim/description.mdx
index 3d95a8acf7..177ec3bf4a 100644
--- a/src/content/examples/en/09_Angles_And_Motion/01_Aim/description.mdx
+++ b/src/content/examples/en/09_Angles_And_Motion/01_Aim/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/09_Angles_And_Motion-01_Aim-thumbnail.p
 featuredImageAlt: Two eyes on a black background.
 title: Aim
 oneLineDescription: Rotate toward a point.
+
+remix:
+  - revision-2023-dkessner
 ---
 
 The
diff --git a/src/content/examples/en/09_Angles_And_Motion/02_Triangle_Strip/description.mdx b/src/content/examples/en/09_Angles_And_Motion/02_Triangle_Strip/description.mdx
index 346ad00be3..eabb5409b9 100644
--- a/src/content/examples/en/09_Angles_And_Motion/02_Triangle_Strip/description.mdx
+++ b/src/content/examples/en/09_Angles_And_Motion/02_Triangle_Strip/description.mdx
@@ -3,6 +3,13 @@ featuredImage: "../../../images/featured/09_Angles_And_Motion-02_Triangle_Strip-
 featuredImageAlt: Rainbow ring made up of triangles whose vertices lie on two concentric circles.
 title: Triangle Strip
 oneLineDescription: Split a ring into triangles.
+
+
+collectivelyAttributedSince: 2024
+remix:
+  - attributionURL: https://archive.p5js.org/examples/form-triangle-strip.html
+    attributionLabel: Ira Greenberg
+  - revision-2023-dkessner
 ---
 
 This example demonstrates how to create a shape
diff --git a/src/content/examples/en/10_Games/02_Snake/description.mdx b/src/content/examples/en/10_Games/02_Snake/description.mdx
index 401311e49d..ed07420b87 100644
--- a/src/content/examples/en/10_Games/02_Snake/description.mdx
+++ b/src/content/examples/en/10_Games/02_Snake/description.mdx
@@ -3,6 +3,12 @@ featuredImage: "../../../images/featured/10_Games-02_Snake-thumbnail.png"
 featuredImageAlt: A narrow green L shape and a red square representing the snake and fruit in the arcade game Snake.
 title: Snake
 oneLineDescription: Make a game based on Snake arcade games.
+
+collectivelyAttributedSince: 2024
+remix:
+  - attributionURL: https://github.com/prashantgupta24
+    attributionLabel: Prashant Gupta
+  - revision-2023-calebfoss
 ---
 
 This is a reproduction of a type of arcade game called
diff --git a/src/content/examples/en/11_3D/00_Geometries/description.mdx b/src/content/examples/en/11_3D/00_Geometries/description.mdx
index c4606f799c..db5e6771ba 100644
--- a/src/content/examples/en/11_3D/00_Geometries/description.mdx
+++ b/src/content/examples/en/11_3D/00_Geometries/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/11_3D-00_Geometries-thumbnail.png"
 featuredImageAlt: Eight 3D shapes; a plane, box, cylinder, cone, torus, sphere, ellipsoid, and a model of an astronaut. The surface of the shapes are multicolored.
 title: Geometries
 oneLineDescription: Draw 3D shapes, including a custom model.
+
+remix:
+  - revision-2023-calebfoss
 ---
 
 p5's
diff --git a/src/content/examples/en/11_3D/02_Materials/description.mdx b/src/content/examples/en/11_3D/02_Materials/description.mdx
index 955b3c4927..f75788adc3 100644
--- a/src/content/examples/en/11_3D/02_Materials/description.mdx
+++ b/src/content/examples/en/11_3D/02_Materials/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/11_3D-02_Materials-thumbnail.png"
 featuredImageAlt: Astronaut 3D model on a black background.
 title: Materials
 oneLineDescription: Change 3D objects' color, texture, and how they respond to light.
+
+remix:
+  - revision-2023-calebfoss
 ---
 
 In 3D rendering, a material determines how a surface
diff --git a/src/content/examples/en/11_3D/03_Orbit_Control/description.mdx b/src/content/examples/en/11_3D/03_Orbit_Control/description.mdx
index d50a32aad6..b610b992cd 100644
--- a/src/content/examples/en/11_3D/03_Orbit_Control/description.mdx
+++ b/src/content/examples/en/11_3D/03_Orbit_Control/description.mdx
@@ -4,6 +4,9 @@ featuredImageAlt: A sphere of dark purple cubes on a light pink background.
 title: Orbit Control
 oneLineDescription: Control the camera with the mouse.
 featured: true
+
+remix:
+  - revision-2023-calebfoss
 ---
 
 <a href="https://p5js.org/reference/p5/orbitControl" target="_blank">Orbit control</a>
diff --git a/src/content/examples/en/11_3D/06_Framebuffer_Blur/description.mdx b/src/content/examples/en/11_3D/06_Framebuffer_Blur/description.mdx
index 2ef014217f..1710c88b98 100644
--- a/src/content/examples/en/11_3D/06_Framebuffer_Blur/description.mdx
+++ b/src/content/examples/en/11_3D/06_Framebuffer_Blur/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/11_3D-06_Framebuffer_Blur-thumbnail.png
 featuredImageAlt: A row of five orange spheres. The closest and farthest spheres from the camera appear blurred.
 title: Framebuffer Blur
 oneLineDescription: Simulate a camera's depth of field.
+
+remix:
+  - revision-2023-calebfoss
 ---
 
 The
diff --git a/src/content/examples/en/12_Advanced_Canvas_Rendering/00_Create_Graphics/description.mdx b/src/content/examples/en/12_Advanced_Canvas_Rendering/00_Create_Graphics/description.mdx
index c550237b4b..9177ace321 100644
--- a/src/content/examples/en/12_Advanced_Canvas_Rendering/00_Create_Graphics/description.mdx
+++ b/src/content/examples/en/12_Advanced_Canvas_Rendering/00_Create_Graphics/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/12_Advanced_Canvas_Rendering-00_Create_
 featuredImageAlt: Black canvas with a very dark grey rectangle in the middle. A white circle is at the edge of the rectangle.
 title: Create Graphics
 oneLineDescription: Draw imagery off-screen.
+
+remix:
+  - revision-2023-klich
 ---
 
 The
diff --git a/src/content/examples/en/12_Advanced_Canvas_Rendering/02_Shader_As_A_Texture/description.mdx b/src/content/examples/en/12_Advanced_Canvas_Rendering/02_Shader_As_A_Texture/description.mdx
index d003b370b5..21f3768834 100644
--- a/src/content/examples/en/12_Advanced_Canvas_Rendering/02_Shader_As_A_Texture/description.mdx
+++ b/src/content/examples/en/12_Advanced_Canvas_Rendering/02_Shader_As_A_Texture/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/12_Advanced_Canvas_Rendering-02_Shader_
 featuredImageAlt: Two spheres broken up into a square grid with a gradient in each grid.
 title: Shader as a Texture
 oneLineDescription: Generate a texture for a 3D shape using a shader.
+
+remix:
+  - revision-2023-calebfoss
 ---
 
 Shaders can be applied to 2D/3D shapes as textures.
diff --git a/src/content/examples/en/13_Classes_And_Objects/00_Snowflakes/description.mdx b/src/content/examples/en/13_Classes_And_Objects/00_Snowflakes/description.mdx
index fb09587507..b5f163d074 100644
--- a/src/content/examples/en/13_Classes_And_Objects/00_Snowflakes/description.mdx
+++ b/src/content/examples/en/13_Classes_And_Objects/00_Snowflakes/description.mdx
@@ -3,6 +3,12 @@ featuredImage: "../../../images/featured/13_Classes_And_Objects-00_Snowflakes-th
 featuredImageAlt: Snowflakes falling on a black background.
 title: Snowflakes
 oneLineDescription: Animate snowfall.
+
+collectivelyAttributedSince: 2024
+remix:
+  - attributionURL: https://archive.p5js.org/examples/simulate-snowflakes.html
+    attributionLabel: Aatish Bhatia
+  - revision-2023-dkessner
 ---
 
 This example demonstrates the use of a particle system
diff --git a/src/content/examples/en/13_Classes_And_Objects/01_Shake_Ball_Bounce/description.mdx b/src/content/examples/en/13_Classes_And_Objects/01_Shake_Ball_Bounce/description.mdx
index 4f3a0c0e22..8bdddd057b 100644
--- a/src/content/examples/en/13_Classes_And_Objects/01_Shake_Ball_Bounce/description.mdx
+++ b/src/content/examples/en/13_Classes_And_Objects/01_Shake_Ball_Bounce/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/13_Classes_And_Objects-01_Shake_Ball_Bo
 featuredImageAlt: Twenty white circles on a black background.
 title: Shake Ball Bounce
 oneLineDescription: Animate ball movement based on mobile device motion.
+
+remix:
+  - revision-2023-klich
 ---
 
 Using a 
diff --git a/src/content/examples/en/13_Classes_And_Objects/02_Connected_Particles/description.mdx b/src/content/examples/en/13_Classes_And_Objects/02_Connected_Particles/description.mdx
index f0d7a68dac..e53f7c5561 100644
--- a/src/content/examples/en/13_Classes_And_Objects/02_Connected_Particles/description.mdx
+++ b/src/content/examples/en/13_Classes_And_Objects/02_Connected_Particles/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/13_Classes_And_Objects-02_Connected_Par
 featuredImageAlt: A pattern of multicolored circles connected by white lines, on a black background.
 title: Connected Particles
 oneLineDescription: Draw circles and connecting lines using the mouse.
+
+remix:
+  - revision-2023-calebfoss
 ---
 
 This example uses two custom
diff --git a/src/content/examples/en/13_Classes_And_Objects/03_Flocking/description.mdx b/src/content/examples/en/13_Classes_And_Objects/03_Flocking/description.mdx
index cf77347f0d..895c5c86a6 100644
--- a/src/content/examples/en/13_Classes_And_Objects/03_Flocking/description.mdx
+++ b/src/content/examples/en/13_Classes_And_Objects/03_Flocking/description.mdx
@@ -3,6 +3,9 @@ featuredImage: "../../../images/featured/13_Classes_And_Objects-03_Flocking-thum
 featuredImageAlt: A group of bird-like objects, represented by rainbow triangles, modeling flocking behavior.
 title: Flocking
 oneLineDescription: Simulate bird flocking behavior.
+
+remix:
+  - revision-2023-dkessner
 ---
 
 Demonstration of flocking behavior.
diff --git a/src/content/examples/en/14_Loading_And_Saving_Data/01_JSON/description.mdx b/src/content/examples/en/14_Loading_And_Saving_Data/01_JSON/description.mdx
index 10626c5f3e..76c7040cee 100644
--- a/src/content/examples/en/14_Loading_And_Saving_Data/01_JSON/description.mdx
+++ b/src/content/examples/en/14_Loading_And_Saving_Data/01_JSON/description.mdx
@@ -3,6 +3,12 @@ featuredImage: "../../../images/featured/14_Loading_And_Saving_Data-01_JSON-thum
 featuredImageAlt: Black outlines of circles on a white background. Text below the circles reads "Click and drag to add bubbles."
 title: JSON
 oneLineDescription: Store data in JavaScript object notation.
+
+collectivelyAttributedSince: 2024
+remix:
+  - attributionLabel: Processing example by Daniel Shiffman
+    attributionURL: https://processing.org/examples/loadsavejson.html
+  - revision-2023-calebfoss
 ---
 
 <a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/JSON" target="_blank">JavaScript Object Notation, or JSON</a>,
diff --git a/src/content/examples/en/14_Loading_And_Saving_Data/02_Table/description.mdx b/src/content/examples/en/14_Loading_And_Saving_Data/02_Table/description.mdx
index 13374ed204..c355e47d55 100644
--- a/src/content/examples/en/14_Loading_And_Saving_Data/02_Table/description.mdx
+++ b/src/content/examples/en/14_Loading_And_Saving_Data/02_Table/description.mdx
@@ -3,6 +3,13 @@ featuredImage: "../../../images/featured/14_Loading_And_Saving_Data-02_Table-thu
 featuredImageAlt: Black outlines of circles on a white background. Text below the circles reads "Click and drag to add bubbles."
 title: Table
 oneLineDescription: Store data as comma-separated values.
+
+
+collectivelyAttributedSince: 2024
+remix:
+  - attributionLabel: Processing example by Daniel Shiffman
+    attributionURL: https://processing.org/examples/loadsavetable.html
+  - revision-2023-calebfoss
 ---
 
 Comma-Separated Values, or CSV, is a format for writing
diff --git a/src/content/examples/en/15_Math_And_Physics/00_Non_Orthogonal_Reflection/description.mdx b/src/content/examples/en/15_Math_And_Physics/00_Non_Orthogonal_Reflection/description.mdx
index 842434c9c9..ea9751a90e 100644
--- a/src/content/examples/en/15_Math_And_Physics/00_Non_Orthogonal_Reflection/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/00_Non_Orthogonal_Reflection/description.mdx
@@ -3,6 +3,15 @@ featuredImage: "../../../images/featured/15_Math_And_Physics-00_Non_Orthogonal_R
 featuredImageAlt: A small green circle hovering over a yellow tilted plane at the bottom of the canvas.
 title: Non-Orthogonal Reflection
 oneLineDescription: Simulate a ball bouncing on a slanted surface.
+
+remix:
+  - attributionLabel: Processing example by Ira Greenberg
+    attributionURL: https://processing.org/examples/reflection1.html
+    remixLabel: Based on
+  - attributionLabel: David Blitz
+    remixLabel: Ported by
+  - revision-2023-dkessner
+collectivelyAttributedSince: 2024
 ---
 
 This example demonstrates a ball bouncing on a slanted
diff --git a/src/content/examples/en/15_Math_And_Physics/01_Soft_Body/description.mdx b/src/content/examples/en/15_Math_And_Physics/01_Soft_Body/description.mdx
index 00e4cf95ff..989487bd2c 100644
--- a/src/content/examples/en/15_Math_And_Physics/01_Soft_Body/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/01_Soft_Body/description.mdx
@@ -3,6 +3,12 @@ featuredImage: "../../../images/featured/15_Math_And_Physics-01_Soft_Body-thumbn
 featuredImageAlt: A yellow pentagon on a black background.
 title: Soft Body
 oneLineDescription: Simulate the physics of a soft body accelerating toward the mouse.
+
+collectivelyAttributedSince: 2024
+remix:
+  - attributionURL: https://archive.p5js.org/examples/simulate-soft-body.html
+    attributionLabel: Ira Greenberg
+  - revision-2023-dkessner
 ---
 
 Physics simulation of a soft body experiencing
diff --git a/src/content/examples/en/15_Math_And_Physics/02_Forces/description.mdx b/src/content/examples/en/15_Math_And_Physics/02_Forces/description.mdx
index 7fb736efae..801753b8fc 100644
--- a/src/content/examples/en/15_Math_And_Physics/02_Forces/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/02_Forces/description.mdx
@@ -3,12 +3,17 @@ featuredImage: "../../../images/featured/15_Math_And_Physics-02_Forces-thumbnail
 featuredImageAlt: 9 multicolored circles at varying heights on a grey background.
 title: Forces
 oneLineDescription: Simulate forces on multiple bodies as they move through liquid.
+
+remix:
+  - attributionURL: http://natureofcode.com
+    attributionLabel: Dan Shiffman's "Nature of Code"
+    remixLabel: Inspired by
+  - revision-2023-dkessner
 ---
 
 Demonstration of multiple forces acting on bodies.
 Bodies experience gravity continuously. Bodies experience fluid
 resistance when in "water".
-(<a href="http://natureofcode.com">natureofcode.com</a>)
 
 The force calculations are performed using the
 <a href="https://p5js.org/reference/p5/p5.Vector">p5.Vector</a>
diff --git a/src/content/examples/en/15_Math_And_Physics/04_Game_Of_Life/description.mdx b/src/content/examples/en/15_Math_And_Physics/04_Game_Of_Life/description.mdx
index b169fa18cf..d005e2abfb 100644
--- a/src/content/examples/en/15_Math_And_Physics/04_Game_Of_Life/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/04_Game_Of_Life/description.mdx
@@ -3,6 +3,12 @@ featuredImage: "../../../images/featured/15_Math_And_Physics-04_Game_Of_Life-thu
 featuredImageAlt: Grid of squares made of black lines on a white background. Some squares are filled in with solid black.
 title: Game of Life
 oneLineDescription: Recreate John Conway's cellular automaton.
+
+remix:
+  - attributionURL: http://natureofcode.com
+    attributionLabel: Dan Shiffman's "Nature of Code"
+    remixLabel: Inspired by
+  - revision-2023-calebfoss
 ---
 
 The Game of Life is a cellular automaton created by
diff --git a/src/content/examples/en/15_Math_And_Physics/05_Mandelbrot/description.mdx b/src/content/examples/en/15_Math_And_Physics/05_Mandelbrot/description.mdx
index 5c72c524e8..185df64d2a 100644
--- a/src/content/examples/en/15_Math_And_Physics/05_Mandelbrot/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/05_Mandelbrot/description.mdx
@@ -3,8 +3,11 @@ featuredImage: "../../../images/featured/15_Math_And_Physics-05_Mandelbrot-thumb
 featuredImageAlt: Colorful rendering of the Mandelbrot set.
 title: Mandelbrot Set
 oneLineDescription: Visualize a mathematical set that produces fractal structures.
+
+remix:
+  - attributionURL: https://processing.org/examples/mandelbrot.html
+    attributionLabel: Dan Shiffman's example for Processing
+  - revision-2023-dkessner
 ---
 
-Colorful rendering of the Mandelbrot set
-based on Daniel Shiffman's
-<a href="https://processing.org/examples/mandelbrot.html">Mandelbrot Example</a> for Processing.
\ No newline at end of file
+Colorful rendering of the Mandelbrot set.
\ No newline at end of file
diff --git a/src/layouts/ExampleLayout.astro b/src/layouts/ExampleLayout.astro
index 0cab3aa885..cc33399274 100644
--- a/src/layouts/ExampleLayout.astro
+++ b/src/layouts/ExampleLayout.astro
@@ -78,12 +78,19 @@ const { Content } = await example.render();
         {resolvedRemix?.map((item, i) => (
           <>
             {i > 0 && " "}
-            {item.remixLabel && item.remixURL ? (
+            {item.remixLabel ? (
               <>
-                <a href={item.remixURL}>{item.remixLabel}</a>
+                {item.remixURL ? (
+                  <>
+                    <a href={item.remixURL}>{item.remixLabel}</a> by
+                  </>
+                ) : (
+                  item.remixLabel
+                )}
+
                 {item.attributionLabel && (
                   <>
-                    {" "}by{" "}
+                    {" "}
                     {item.attributionURL ? (
                       <a href={item.attributionURL}>{item.attributionLabel}</a>
                     ) : (

From 7b6d957d579395c488a1b9a3153b0f07df54bf23 Mon Sep 17 00:00:00 2001
From: ksen0 <katie.kuksenok@gmail.com>
Date: Fri, 18 Jul 2025 18:37:09 +0200
Subject: [PATCH 07/10] Updated attribution style

---
 src/content/examples/config.ts                | 22 ++-----------------
 .../00_Shape_Primitives/description.mdx       |  8 ++++++-
 2 files changed, 9 insertions(+), 21 deletions(-)

diff --git a/src/content/examples/config.ts b/src/content/examples/config.ts
index 2d26a49d4c..accc66332a 100644
--- a/src/content/examples/config.ts
+++ b/src/content/examples/config.ts
@@ -57,23 +57,5 @@ type RemixEntry = {
   remixLabel: string;
 };
 
-export const remixLookup: { [key: string]: RemixEntry } = {
-  "revision-2023-calebfoss": {
-    attributionURL: "https://github.com/calebfoss",
-    attributionLabel: "Caleb Foss",
-    remixURL: "https://github.com/processing/p5.js-example",
-    remixLabel: "Revised in 2023",
-  },
-  "revision-2023-dkessner": {
-    attributionURL: "https://github.com/dkessner",
-    attributionLabel: "Darren Kessner",
-    remixURL: "https://github.com/processing/p5.js-example",
-    remixLabel: "Revised in 2023",
-  },
-  "revision-2023-klich": {
-    attributionURL: "https://www.klich.co/",
-    attributionLabel: "Kasey Lichtlyter",
-    remixURL: "https://github.com/processing/p5.js-example",
-    remixLabel: "Revised in 2023",
-  },
-};
+
+// TODO instead of this emit a warning if there's multiple URLs used for the same person
\ No newline at end of file
diff --git a/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx b/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
index 874488eee3..0da709b7d7 100644
--- a/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
+++ b/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
@@ -8,7 +8,13 @@ relatedReference:
   - en/p5/ellipse
 
 remix:
-  - revision-2023-dkessner
+  - description: Revised in 2023 by
+    attribution:
+     - name: Darren Kessner
+    codeURL: 
+    codeLabel: 
+  - description: Based on
+    code URL: codeLabel: archived version
 ---
 
 This program demonstrates the use of the basic shape

From 9b562c55a24f7195fb4896fe7a58a7da182d0db3 Mon Sep 17 00:00:00 2001
From: ksen0 <katie.kuksenok@gmail.com>
Date: Mon, 28 Jul 2025 11:19:08 +0200
Subject: [PATCH 08/10] Documented remix attribution schema

---
 docs/content_overview.md                      |  37 ++++++
 src/content/examples/config.ts                |  38 ++----
 .../00_Shape_Primitives/description.mdx       |   8 +-
 .../03_Conditions/description.mdx             |  24 +++-
 src/layouts/ExampleLayout.astro               | 114 +++++++++---------
 5 files changed, 128 insertions(+), 93 deletions(-)

diff --git a/docs/content_overview.md b/docs/content_overview.md
index 46cd9df8db..cce9758592 100644
--- a/docs/content_overview.md
+++ b/docs/content_overview.md
@@ -11,6 +11,43 @@
 - Stored in `/src/content/examples/`
 - All translations are stored and edited directly in this repo under the corresponding language folder in `/src/content/examples/`
 
+To add attribution, you can use the following block in the headers, listing in chronological order all arrtibutions. Below is the example from `examples/animation-and-variables-conditions/`:
+
+```yaml
+remix:
+  - description: Inspired by
+
+    attribution:
+      - name: Prof. WM Harris
+        URL: https://people.rit.edu/wmhics/
+
+    codeURL: https://github.com/processing/p5.js-website-legacy/blob/main/src/data/examples/en/04_Control/05_Logical_Operators_2.js
+    codeLabel: pre-2023 code
+
+  - description: Revised by
+
+    attribution:    
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
+ 
+    codeURL: https://github.com/processing/p5.js-example/tree/main/examples/02_Animation_And_Variables/03_Conditions
+    codeLabel: 2023 revision code
+
+  - collectivelyAttributedSince: 2024
+```
+
+This will result in a block that lists, in order, the initial inspiration; any revision or other remix; and the collective attribution statement that begins in 2024: "From 2024 onwards, edited and maintained by p5.js Contributors and the Processing Foundation. Licensed under CC BY-NC-SA 4.0."
+
+A remix can be many things ([here is an example analysis of sketch remixing (PDF)](https://dl.acm.org/doi/pdf/10.1145/3563657.3595969)); the `description` will be by default "Remixed by", so a more specific description is recommended.
+
+If the `collectivelyAttributedSince` information is missing, then no year will be included, but the collective attribution statement will still show: "Edited and maintained by p5.js Contributors and the Processing Foundation. Licensed under CC BY-NC-SA 4.0."
+
+Each item in the remix history must have an original codeURL and/or at least one person listed in the attribution section. When multiple people are listed, their names will be shown in that order. For people, URLs are optional but recommended.
+
+If no `codeLabel` is given but there is a `codeURL`, then the default label "code" will be used - however, for accessibility, it is strongly recommended to use short, descriptive labels.
+
+---
+
 ## Tutorials
 
 - Stored in `/src/content/tutorials/`
diff --git a/src/content/examples/config.ts b/src/content/examples/config.ts
index accc66332a..b16752d660 100644
--- a/src/content/examples/config.ts
+++ b/src/content/examples/config.ts
@@ -9,11 +9,9 @@ export const examplesCollection = defineCollection({
   type: "content",
   schema: ({ image }) =>
     z.object({
-      
       // Title of the example
       title: z.string(),
       oneLineDescription: z.string(),
-
       // Aria label used for the live example code
       arialabel: z.string().optional(),
       featured: z.boolean().optional(),
@@ -21,19 +19,24 @@ export const examplesCollection = defineCollection({
       featuredImage: image(),
       featuredImageAlt: z.string().optional().default(""),
 
-      // Start of collective attribution
-      collectivelyAttributedSince: z.number().optional(),
-
       // Optional list of remixes to add to license
       remix: z
         .array(
           z.union([
             z.string(),
             z.object({
-              attributionURL: z.string().optional(),
-              attributionLabel: z.string().optional(),
-              remixURL: z.string().optional(),
-              remixLabel: z.string().optional(),
+              description: z.string().default("Remixed by"),
+              codeURL: z.string().optional(),
+              codeLabel: z.string().optional(),
+              attribution: z
+                .array(
+                  z.object({
+                    name: z.string(),
+                    URL: z.string().optional(),
+                  })
+                )
+                .optional(),
+              collectivelyAttributedSince: z.number().optional(),
             }),
           ])
         )
@@ -42,20 +45,3 @@ export const examplesCollection = defineCollection({
     }),
 });
 
-/**
- * The `remix` field lets you add remix attributions in two ways:
- * 1. Full objects with all details.
- * 2. Short string keys that refer to predefined entries in `remixLookup`.
- * When rendering (in ExampleLayout.astro), these keys are replaced 
- * with their full details from `remixLookup`.
- */
-
-type RemixEntry = {
-  attributionURL: string;
-  attributionLabel: string;
-  remixURL: string;
-  remixLabel: string;
-};
-
-
-// TODO instead of this emit a warning if there's multiple URLs used for the same person
\ No newline at end of file
diff --git a/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx b/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
index 0da709b7d7..e630b2e7ba 100644
--- a/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
+++ b/src/content/examples/en/01_Shapes_And_Color/00_Shape_Primitives/description.mdx
@@ -11,10 +11,10 @@ remix:
   - description: Revised in 2023 by
     attribution:
      - name: Darren Kessner
-    codeURL: 
-    codeLabel: 
-  - description: Based on
-    code URL: codeLabel: archived version
+       URL: https://github.com/dkessner
+  - collective:
+      since: 2024
+
 ---
 
 This program demonstrates the use of the basic shape
diff --git a/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx b/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx
index a12fac16dd..a979ad1f75 100644
--- a/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx
+++ b/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx
@@ -4,11 +4,27 @@ featuredImageAlt: A small black circle on a rainbow, lattice-shaped path, on top
 title: Conditions
 oneLineDescription: Use if and else statements to make decisions while your sketch runs.
 
-collectivelyAttributedSince: 2024
 remix:
-  - attributionURL: https://people.rit.edu/wmhics/
-    attributionLabel: Prof. WM Harris
-  - revision-2023-calebfoss
+  - description: Inspired by
+
+    attribution:
+      - name: Prof. WM Harris
+        URL: https://people.rit.edu/wmhics/
+
+    codeURL: https://github.com/processing/p5.js-website-legacy/blob/main/src/data/examples/en/04_Control/05_Logical_Operators_2.js
+    codeLabel: pre-2023 code
+
+  - description: Revised by
+
+    attribution:    
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
+ 
+    codeURL: https://github.com/processing/p5.js-example/tree/main/examples/02_Animation_And_Variables/03_Conditions
+    codeLabel: 2023 revision code
+
+  - collectivelyAttributedSince: 2024
+
 ---
 
 If and else statements allow a
diff --git a/src/layouts/ExampleLayout.astro b/src/layouts/ExampleLayout.astro
index cc33399274..2f114d1da4 100644
--- a/src/layouts/ExampleLayout.astro
+++ b/src/layouts/ExampleLayout.astro
@@ -2,7 +2,6 @@
 import type { CollectionEntry } from "astro:content";
 import Head from "@components/Head/index.astro";
 import { setJumpToState } from "../globals/state";
-import { remixLookup } from "../content/examples/config";
 import { getCurrentLocale, getUiTranslator } from "../i18n/utils";
 import {
   generateJumpToState,
@@ -42,13 +41,17 @@ const relatedReferences =
       )
     : [];
 
-// Rather than using example.data.remix, use resolvedRemix
-// Which fills in widely-used attributions to avoid duplication
-const resolvedRemix = example.data.remix.map((entry: any) =>
-  typeof entry === "string" ? remixLookup[entry] : entry
-);
-
 const { Content } = await example.render();
+
+const collectivelyAttributedSince = example.data.remix?.reduce((acc, item) => {
+  if (typeof item === "string") return acc;
+  if (item.collectivelyAttributedSince) {
+    return item.collectivelyAttributedSince;
+  }
+  return acc;
+}, null);
+
+
 ---
 
 <Head
@@ -73,67 +76,60 @@ const { Content } = await example.render();
     <div class="rendered-markdown">
       <p>
 
-        <a href={Astro.url.pathname}>{example.data.title}</a>:   
+      <a href={Astro.url.pathname}>{example.data.title}</a>:{" "}
 
-        {resolvedRemix?.map((item, i) => (
-          <>
-            {i > 0 && " "}
-            {item.remixLabel ? (
-              <>
-                {item.remixURL ? (
-                  <>
-                    <a href={item.remixURL}>{item.remixLabel}</a> by
-                  </>
-                ) : (
-                  item.remixLabel
-                )}
+      {example.data.remix?.map((item, i) => {
+        if (typeof item === "string") return null;
 
-                {item.attributionLabel && (
+        const parts = [];
+
+        if (!item.collectivelyAttributedSince && (item.attribution || item.codeURL)) {
+          parts.push(<>{item.description}</>);
+
+          if (item.attribution?.length) {
+            parts.push(
+              <>
+                {" "}
+                {item.attribution.map((a, j) => (
                   <>
-                    {" "}
-                    {item.attributionURL ? (
-                      <a href={item.attributionURL}>{item.attributionLabel}</a>
-                    ) : (
-                      item.attributionLabel
-                    )}.
+                    {a.URL ? <a href={a.URL}>{a.name}</a> : a.name}
+                    {j < item.attribution.length - 1 ? ", " : !item.codeURL ? "." : ""}
                   </>
-                )}
-              </>
-            ) : item.attributionLabel ? (
-              <>
-                Remixed from{" "}
-                {item.attributionURL ? (
-                  <a href={item.attributionURL}>{item.attributionLabel}</a>
-                ) : (
-                  item.attributionLabel
-                )}.
+                ))}
               </>
-            ) : null}
-          </>
-        ))}
-
-        {example.data.collectivelyAttributedSince ? (
-          <>
-            From {example.data.collectivelyAttributedSince} onwards, edited and maintained by
-          </>
-        ) : (
-          <>
-            Edited and maintained by
-          </>
-        )}
-        
-        <a href="https://github.com/processing/p5.js?tab=readme-ov-file#contributors">p5.js Contributors</a>
-        and the
+            );
+          }
+
+          if (item.codeURL) {
+            parts.push(
+              <span>
+                (<a href={item.codeURL}>{item.codeLabel || "code"}</a>).
+              </span>
+            );
+          }
+        }
+
+        return <span key={i}>{i > 0 && " "}{parts}</span>;
+      })}
+
+      {collectivelyAttributedSince ? (
+        <>From {collectivelyAttributedSince} onwards, edited and maintained by{" "}</>
+      ) : (
+        <>Edited and maintained by{" "}</>
+      )}
+      <span>
+        <a href="https://github.com/processing/p5.js?tab=readme-ov-file#contributors">p5.js Contributors</a>{" "}
+        and the{" "}
         <a href="https://processingfoundation.org/people">Processing Foundation</a>.
         Licensed under{" "}
         <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+      </span>
+    </p>
+    <img src="/images/by-nc-sa.svg" />
+  </div>
 
-      </p>
-      <img src="/images/by-nc-sa.svg" />
-    </div>
-
-    <EditableSketch code={code} />
-    <p>{example.data.arialabel}</p>
+  <EditableSketch code={code} />
+  <p>{example.data.arialabel}</p>
 
   </div>
   <div class="grid gap-y-4xl lg:gap-y-mb-3xl mt-2xl">

From 08fc75873e3b807c452795e332af13ae774be806 Mon Sep 17 00:00:00 2001
From: ksen0 <katie.kuksenok@gmail.com>
Date: Mon, 28 Jul 2025 11:30:02 +0200
Subject: [PATCH 09/10] Remix attribution layout code cleanup

---
 src/layouts/ExampleLayout.astro | 26 ++++++++++++++++----------
 1 file changed, 16 insertions(+), 10 deletions(-)

diff --git a/src/layouts/ExampleLayout.astro b/src/layouts/ExampleLayout.astro
index 2f114d1da4..6565c26d96 100644
--- a/src/layouts/ExampleLayout.astro
+++ b/src/layouts/ExampleLayout.astro
@@ -43,14 +43,17 @@ const relatedReferences =
 
 const { Content } = await example.render();
 
-const collectivelyAttributedSince = example.data.remix?.reduce((acc, item) => {
-  if (typeof item === "string") return acc;
-  if (item.collectivelyAttributedSince) {
-    return item.collectivelyAttributedSince;
-  }
-  return acc;
-}, null);
-
+// Extract the collective attribution year. If multiple provided, uses last shown.
+const collectivelyAttributedSince = example.data.remix?.reduce(
+  (acc: number | null, item) => {
+    if (typeof item === "string") return acc;
+    if (item.collectivelyAttributedSince) {
+      return item.collectivelyAttributedSince;
+    }
+    return acc;
+  },
+  null
+);
 
 ---
 
@@ -83,6 +86,9 @@ const collectivelyAttributedSince = example.data.remix?.reduce((acc, item) => {
 
         const parts = [];
 
+        // Each remix entry requires either attribution, or a codeURL; these have no defaults
+        // If a remix entry contains a collective attribution starting year, it is ignored here
+
         if (!item.collectivelyAttributedSince && (item.attribution || item.codeURL)) {
           parts.push(<>{item.description}</>);
 
@@ -93,7 +99,7 @@ const collectivelyAttributedSince = example.data.remix?.reduce((acc, item) => {
                 {item.attribution.map((a, j) => (
                   <>
                     {a.URL ? <a href={a.URL}>{a.name}</a> : a.name}
-                    {j < item.attribution.length - 1 ? ", " : !item.codeURL ? "." : ""}
+                    {j < (item.attribution?.length ?? 0) - 1 ? ", " : !item.codeURL ? "." : ""}
                   </>
                 ))}
               </>
@@ -109,7 +115,7 @@ const collectivelyAttributedSince = example.data.remix?.reduce((acc, item) => {
           }
         }
 
-        return <span key={i}>{i > 0 && " "}{parts}</span>;
+        return <span>{i > 0 && " "}{parts}</span>;
       })}
 
       {collectivelyAttributedSince ? (

From 9ec8a520bf2f089681d95fc592cefc3391cf9f3d Mon Sep 17 00:00:00 2001
From: ksen0 <katie.kuksenok@gmail.com>
Date: Mon, 28 Jul 2025 14:10:47 +0200
Subject: [PATCH 10/10] Update examples metadata to use new schema

---
 docs/content_overview.md                      | 18 ++++---
 src/content/examples/config.ts                | 37 +++++++------
 .../01_Color/description.mdx                  | 17 ++++++
 .../00_Drawing_Lines/description.mdx          | 14 ++++-
 .../01_Animation_With_Events/description.mdx  |  7 ++-
 .../02_Mobile_Device_Movement/description.mdx |  7 ++-
 .../03_Conditions/description.mdx             | 12 +++--
 .../00_Words/description.mdx                  |  8 ++-
 .../01_Copy_Image_Data/description.mdx        |  8 ++-
 .../02_Alpha_Mask/description.mdx             | 10 +++-
 .../03_Image_Transparency/description.mdx     |  8 ++-
 .../04_Create_Audio/description.mdx           |  8 ++-
 .../05_Video/description.mdx                  |  8 ++-
 .../06_Video_Canvas/description.mdx           |  8 ++-
 .../00_Image_Drop/description.mdx             |  8 ++-
 .../01_Input_Button/description.mdx           |  8 ++-
 .../02_DOM_Form_Elements/description.mdx      | 14 +++--
 .../01_Rotate/description.mdx                 |  8 ++-
 .../02_Scale/description.mdx                  |  7 ++-
 .../02_Random/description.mdx                 |  8 ++-
 .../03_Constrain/description.mdx              |  6 ++-
 .../04_Clock/description.mdx                  |  7 ++-
 .../00_Color_Interpolation/description.mdx    |  7 ++-
 .../01_Color_Wheel/description.mdx            | 13 +++--
 .../07_Repetition/02_Bezier/description.mdx   |  7 ++-
 .../03_Kaleidoscope/description.mdx           |  7 ++-
 .../05_Recursive_Tree/description.mdx         | 22 ++++++--
 .../00_Random_Poetry/description.mdx          | 16 ++++--
 .../00_Sine_Cosine/description.mdx            |  7 ++-
 .../01_Aim/description.mdx                    |  6 ++-
 .../02_Triangle_Strip/description.mdx         | 21 ++++++--
 .../en/10_Games/02_Snake/description.mdx      | 16 ++++--
 .../en/11_3D/00_Geometries/description.mdx    |  8 ++-
 .../en/11_3D/02_Materials/description.mdx     |  6 ++-
 .../en/11_3D/03_Orbit_Control/description.mdx |  6 ++-
 .../11_3D/06_Framebuffer_Blur/description.mdx |  6 ++-
 .../00_Create_Graphics/description.mdx        |  6 ++-
 .../02_Shader_As_A_Texture/description.mdx    |  6 ++-
 .../00_Snowflakes/description.mdx             | 16 ++++--
 .../01_Shake_Ball_Bounce/description.mdx      |  8 ++-
 .../02_Connected_Particles/description.mdx    |  6 ++-
 .../03_Flocking/description.mdx               |  8 ++-
 .../01_JSON/description.mdx                   | 19 +++++--
 .../02_Table/description.mdx                  | 19 +++++--
 .../description.mdx                           | 22 +++++---
 .../01_Soft_Body/description.mdx              | 19 +++++--
 .../02_Forces/description.mdx                 | 16 ++++--
 .../03_Smoke_Particle_System/description.mdx  | 15 ++++--
 .../04_Game_Of_Life/description.mdx           | 17 ++++--
 .../05_Mandelbrot/description.mdx             | 15 ++++--
 src/layouts/ExampleLayout.astro               | 53 +++++++++++++------
 51 files changed, 492 insertions(+), 137 deletions(-)

diff --git a/docs/content_overview.md b/docs/content_overview.md
index cce9758592..25c66e074e 100644
--- a/docs/content_overview.md
+++ b/docs/content_overview.md
@@ -11,6 +11,8 @@
 - Stored in `/src/content/examples/`
 - All translations are stored and edited directly in this repo under the corresponding language folder in `/src/content/examples/`
 
+All original examples (created new for p5.js) since 2024 are collectively attributed to p5.js Contributors under the CC-BY-NC-SA 4.0 license. However, examples that build on prior work (under a compatible license) can be attributed in more detail, to make sure that authorship is clear in citation, and code history is available to viewers.
+
 To add attribution, you can use the following block in the headers, listing in chronological order all arrtibutions. Below is the example from `examples/animation-and-variables-conditions/`:
 
 ```yaml
@@ -21,8 +23,9 @@ remix:
       - name: Prof. WM Harris
         URL: https://people.rit.edu/wmhics/
 
-    codeURL: https://github.com/processing/p5.js-website-legacy/blob/main/src/data/examples/en/04_Control/05_Logical_Operators_2.js
-    codeLabel: pre-2023 code
+    code:
+      - URL: https://github.com/processing/p5.js-website-legacy/blob/main/src/data/examples/en/04_Control/05_Logical_Operators_2.js
+      - label: pre-2023 code
 
   - description: Revised by
 
@@ -30,8 +33,9 @@ remix:
       - name: Caleb Foss
         URL: https://github.com/calebfoss
  
-    codeURL: https://github.com/processing/p5.js-example/tree/main/examples/02_Animation_And_Variables/03_Conditions
-    codeLabel: 2023 revision code
+    code:
+      - URL: https://github.com/processing/p5.js-example/tree/main/examples/02_Animation_And_Variables/03_Conditions
+        label: 2023 revision code
 
   - collectivelyAttributedSince: 2024
 ```
@@ -40,11 +44,9 @@ This will result in a block that lists, in order, the initial inspiration; any r
 
 A remix can be many things ([here is an example analysis of sketch remixing (PDF)](https://dl.acm.org/doi/pdf/10.1145/3563657.3595969)); the `description` will be by default "Remixed by", so a more specific description is recommended.
 
-If the `collectivelyAttributedSince` information is missing, then no year will be included, but the collective attribution statement will still show: "Edited and maintained by p5.js Contributors and the Processing Foundation. Licensed under CC BY-NC-SA 4.0."
-
-Each item in the remix history must have an original codeURL and/or at least one person listed in the attribution section. When multiple people are listed, their names will be shown in that order. For people, URLs are optional but recommended.
+If the `collectivelyAttributedSince` information is missing, then no year will be included, but the collective attribution statement will still show: "Edited and maintained by p5.js Contributors and the Processing Foundation. Licensed under CC BY-NC-SA 4.0." You'll see this in examples that were part of a major revision project with specific attribution, but have collective authorship before and after.
 
-If no `codeLabel` is given but there is a `codeURL`, then the default label "code" will be used - however, for accessibility, it is strongly recommended to use short, descriptive labels.
+Each item in the remix history must have an at least one person listed in the attribution section. When multiple people are listed, their names will be shown in that order. For people, URLs are optional but recommended.
 
 ---
 
diff --git a/src/content/examples/config.ts b/src/content/examples/config.ts
index b16752d660..e66aaa3fbf 100644
--- a/src/content/examples/config.ts
+++ b/src/content/examples/config.ts
@@ -22,23 +22,26 @@ export const examplesCollection = defineCollection({
       // Optional list of remixes to add to license
       remix: z
         .array(
-          z.union([
-            z.string(),
-            z.object({
-              description: z.string().default("Remixed by"),
-              codeURL: z.string().optional(),
-              codeLabel: z.string().optional(),
-              attribution: z
-                .array(
-                  z.object({
-                    name: z.string(),
-                    URL: z.string().optional(),
-                  })
-                )
-                .optional(),
-              collectivelyAttributedSince: z.number().optional(),
-            }),
-          ])
+          z.object({
+            description: z.string().default("Remixed by"),
+            attribution: z
+              .array(
+                z.object({
+                  name: z.string(),
+                  URL: z.string().optional(),
+                })
+              )
+              .optional(),
+            code: z
+              .array(
+                z.object({
+                  label: z.string(),
+                  URL: z.string(),
+                })
+              )
+              .optional(),
+            collectivelyAttributedSince: z.number().optional(),
+          })
         )
         .optional()
         .default([]),
diff --git a/src/content/examples/en/01_Shapes_And_Color/01_Color/description.mdx b/src/content/examples/en/01_Shapes_And_Color/01_Color/description.mdx
index b39219983a..bbab576db7 100644
--- a/src/content/examples/en/01_Shapes_And_Color/01_Color/description.mdx
+++ b/src/content/examples/en/01_Shapes_And_Color/01_Color/description.mdx
@@ -3,6 +3,23 @@ featuredImage: "../../../images/featured/01_Shapes_And_Color-01_Color-thumbnail.
 featuredImageAlt: A few basic shapes drawn in different colors over a blue background.
 title: Color
 oneLineDescription: Add color to your sketch.
+
+
+remix:
+  - description: Created by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+ 
+    code:
+      - label: 2023 code
+        URL: https://github.com/processing/p5.js-example/tree/main/examples/02_Animation_And_Variables/03_Conditions
+
+  - collectivelyAttributedSince: 2024
+
 ---
 
 This expands on the Shape Primitives example by adding
diff --git a/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx b/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx
index 7f231014fe..eb20bd4134 100644
--- a/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx
+++ b/src/content/examples/en/02_Animation_And_Variables/00_Drawing_Lines/description.mdx
@@ -5,7 +5,19 @@ title: Drawing Lines
 oneLineDescription: Draw with the mouse.
 
 remix:
-  - revision-2023-dkessner
+
+  - description: Revised by
+
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+ 
+    code:
+      - label: pre-2023 code
+        URL: https://github.com/processing/p5.js-website-legacy/blob/main/src/data/examples/en/17_Drawing/00_Continuous_Lines.js
+      - label: 2023 revision code
+        URL: https://github.com/processing/p5.js-example/tree/main/examples/02_Animation_And_Variables/00_Drawing_Lines
+
 ---
 
 Click and drag the mouse to draw a line.
diff --git a/src/content/examples/en/02_Animation_And_Variables/01_Animation_With_Events/description.mdx b/src/content/examples/en/02_Animation_And_Variables/01_Animation_With_Events/description.mdx
index 8c5d2ba6ca..e5bf9bb05f 100644
--- a/src/content/examples/en/02_Animation_And_Variables/01_Animation_With_Events/description.mdx
+++ b/src/content/examples/en/02_Animation_And_Variables/01_Animation_With_Events/description.mdx
@@ -5,7 +5,12 @@ title: Animation with Events
 oneLineDescription: Pause and resume animation.
 
 remix:
-  - revision-2023-dkessner
+  - description: Revised by
+
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+
 ---
 
 This example demonstrates the use of
diff --git a/src/content/examples/en/02_Animation_And_Variables/02_Mobile_Device_Movement/description.mdx b/src/content/examples/en/02_Animation_And_Variables/02_Mobile_Device_Movement/description.mdx
index c3db5d4e5d..6f81306597 100644
--- a/src/content/examples/en/02_Animation_And_Variables/02_Mobile_Device_Movement/description.mdx
+++ b/src/content/examples/en/02_Animation_And_Variables/02_Mobile_Device_Movement/description.mdx
@@ -7,7 +7,12 @@ featured: true
 
 
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
 ---
 
 The <a href="https://p5js.org/reference/p5/deviceMoved" target="_blank">deviceMoved()</a>
diff --git a/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx b/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx
index a979ad1f75..a243d27a78 100644
--- a/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx
+++ b/src/content/examples/en/02_Animation_And_Variables/03_Conditions/description.mdx
@@ -11,17 +11,19 @@ remix:
       - name: Prof. WM Harris
         URL: https://people.rit.edu/wmhics/
 
-    codeURL: https://github.com/processing/p5.js-website-legacy/blob/main/src/data/examples/en/04_Control/05_Logical_Operators_2.js
-    codeLabel: pre-2023 code
+    code:
+      - URL: https://github.com/processing/p5.js-website-legacy/blob/main/src/data/examples/en/04_Control/05_Logical_Operators_2.js
+        label: pre-2023 code
 
   - description: Revised by
 
-    attribution:    
+    attribution:
       - name: Caleb Foss
         URL: https://github.com/calebfoss
  
-    codeURL: https://github.com/processing/p5.js-example/tree/main/examples/02_Animation_And_Variables/03_Conditions
-    codeLabel: 2023 revision code
+    code:
+      - URL: https://github.com/processing/p5.js-example/tree/main/examples/02_Animation_And_Variables/03_Conditions
+        label: 2023 revision code
 
   - collectivelyAttributedSince: 2024
 
diff --git a/src/content/examples/en/03_Imported_Media/00_Words/description.mdx b/src/content/examples/en/03_Imported_Media/00_Words/description.mdx
index 558746e2d7..0c7ba9d6b5 100644
--- a/src/content/examples/en/03_Imported_Media/00_Words/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/00_Words/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: Three columns of the words “ichi,” “ni,” “san,” an
 title: Words
 oneLineDescription: Load fonts and draw text.
 
+
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
 ---
 
 The <a href="https://p5js.org/reference/p5/text" target="_blank">text()</a> function is used for inserting text into the canvas.
diff --git a/src/content/examples/en/03_Imported_Media/01_Copy_Image_Data/description.mdx b/src/content/examples/en/03_Imported_Media/01_Copy_Image_Data/description.mdx
index c1e107e2b0..1b0e12d9a3 100644
--- a/src/content/examples/en/03_Imported_Media/01_Copy_Image_Data/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/01_Copy_Image_Data/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: Black-and-white photograph of a parrot. A curvy line is drawn
 title: Copy Image Data
 oneLineDescription: Paint from an image file onto the canvas.
 
+
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
 ---
 
 Using the <a href="https://p5js.org/reference/p5/copy" target="_blank">copy()</a> 
diff --git a/src/content/examples/en/03_Imported_Media/02_Alpha_Mask/description.mdx b/src/content/examples/en/03_Imported_Media/02_Alpha_Mask/description.mdx
index 822417fc00..54d80d4112 100644
--- a/src/content/examples/en/03_Imported_Media/02_Alpha_Mask/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/02_Alpha_Mask/description.mdx
@@ -4,8 +4,16 @@ featuredImageAlt: Two leaf sprigs side by side on a white background. The right
 title: Alpha Mask
 oneLineDescription: Use one image to cut out a section of another image.
 
+
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Malay Vasa
+        URL: https://github.com/Malayvasa
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
 ---
 
 Using the 
diff --git a/src/content/examples/en/03_Imported_Media/03_Image_Transparency/description.mdx b/src/content/examples/en/03_Imported_Media/03_Image_Transparency/description.mdx
index f146a2ff2f..2ecf025509 100644
--- a/src/content/examples/en/03_Imported_Media/03_Image_Transparency/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/03_Image_Transparency/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: An astronaut on a planet as the background with a slightly tra
 title: Image Transparency
 oneLineDescription: Make an image translucent on the canvas.
 
+
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
 ---
 
 This program overlays one image over another by modifying the
diff --git a/src/content/examples/en/03_Imported_Media/04_Create_Audio/description.mdx b/src/content/examples/en/03_Imported_Media/04_Create_Audio/description.mdx
index 755a221177..ff1d15fb60 100644
--- a/src/content/examples/en/03_Imported_Media/04_Create_Audio/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/04_Create_Audio/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: A close up of an audio player timestamp, reading "0:00 / 2."
 title: Audio Player
 oneLineDescription: Create a player for an audio file.
 
+
 remix:
-  - revision-2023-klich
+  - description: Created by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
+
 ---
 
 <a href="https://p5js.org/reference/p5/createAudio" target="_blank">createAudio()</a>
diff --git a/src/content/examples/en/03_Imported_Media/05_Video/description.mdx b/src/content/examples/en/03_Imported_Media/05_Video/description.mdx
index 990922690a..bc7797bf9a 100644
--- a/src/content/examples/en/03_Imported_Media/05_Video/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/05_Video/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: A screenshot of a video of a hand, with the pointer finger tou
 title: Video Player
 oneLineDescription: Create a player for a video file.
 
+
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
 ---
 
 Using the <a href="https://p5js.org/reference/p5/noCanvas" target="_blank">noCanvas()</a>
diff --git a/src/content/examples/en/03_Imported_Media/06_Video_Canvas/description.mdx b/src/content/examples/en/03_Imported_Media/06_Video_Canvas/description.mdx
index 79b675439f..a15f2e07e4 100644
--- a/src/content/examples/en/03_Imported_Media/06_Video_Canvas/description.mdx
+++ b/src/content/examples/en/03_Imported_Media/06_Video_Canvas/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: Two overlaid screenshots of a video of a hand, with the pointe
 title: Video on Canvas
 oneLineDescription: Display and stylize a video on the canvas.
 
+
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
 ---
 
 Using the 
diff --git a/src/content/examples/en/04_Input_Elements/00_Image_Drop/description.mdx b/src/content/examples/en/04_Input_Elements/00_Image_Drop/description.mdx
index 5c9ddaf445..223bd1bf40 100644
--- a/src/content/examples/en/04_Input_Elements/00_Image_Drop/description.mdx
+++ b/src/content/examples/en/04_Input_Elements/00_Image_Drop/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: A grey background with white text reading "Drag an image file
 title: Image Drop
 oneLineDescription: Display an image that the page visitor dragged and dropped.
 
+
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
 ---
 
 <a href="https://p5js.org/reference/p5.Element/drop" target="_blank">drop()</a>
diff --git a/src/content/examples/en/04_Input_Elements/01_Input_Button/description.mdx b/src/content/examples/en/04_Input_Elements/01_Input_Button/description.mdx
index 8aaaef15f0..32a510ce8c 100644
--- a/src/content/examples/en/04_Input_Elements/01_Input_Button/description.mdx
+++ b/src/content/examples/en/04_Input_Elements/01_Input_Button/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: An input field with a submit button, labeled "Hello, p5!"
 title: Input and Button
 oneLineDescription: Use text input from the page visitor.
 
+
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
 ---
 
 Using the 
diff --git a/src/content/examples/en/04_Input_Elements/02_DOM_Form_Elements/description.mdx b/src/content/examples/en/04_Input_Elements/02_DOM_Form_Elements/description.mdx
index 95a36c6068..e9c381f414 100644
--- a/src/content/examples/en/04_Input_Elements/02_DOM_Form_Elements/description.mdx
+++ b/src/content/examples/en/04_Input_Elements/02_DOM_Form_Elements/description.mdx
@@ -6,9 +6,17 @@ oneLineDescription: Create a form and respond to the results.
 
 collectivelyAttributedSince: 2024
 remix:
-  - attributionURL: https://people.rit.edu/wmhics/
-    attributionLabel: Prof. WM Harris
-  - revision-2023-klich
+
+  - attribution:
+      - URL: https://people.rit.edu/wmhics/
+        name: Prof. WM Harris
+
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
 ---
 
 The <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model" target="_blank">Document Object Model</a>,
diff --git a/src/content/examples/en/05_Transformation/01_Rotate/description.mdx b/src/content/examples/en/05_Transformation/01_Rotate/description.mdx
index 2e33a07cba..2bfa813e62 100644
--- a/src/content/examples/en/05_Transformation/01_Rotate/description.mdx
+++ b/src/content/examples/en/05_Transformation/01_Rotate/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: Line segments rotated around center of canvas.
 title: Rotate
 oneLineDescription: Rotate the coordinate system.
 
+
 remix:
-  - revision-2023-dkessner
+  - description: Revised by
+
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+
 ---
 
 The
diff --git a/src/content/examples/en/05_Transformation/02_Scale/description.mdx b/src/content/examples/en/05_Transformation/02_Scale/description.mdx
index 60e9940e75..9984d53af8 100644
--- a/src/content/examples/en/05_Transformation/02_Scale/description.mdx
+++ b/src/content/examples/en/05_Transformation/02_Scale/description.mdx
@@ -6,7 +6,12 @@ oneLineDescription: Modify the coordinate system scale.
 
 
 remix:
-  - revision-2023-dkessner
+  - description: Revised by
+
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+
 ---
 
 The
diff --git a/src/content/examples/en/06_Calculating_Values/02_Random/description.mdx b/src/content/examples/en/06_Calculating_Values/02_Random/description.mdx
index fe02650737..f1cb67c594 100644
--- a/src/content/examples/en/06_Calculating_Values/02_Random/description.mdx
+++ b/src/content/examples/en/06_Calculating_Values/02_Random/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: A small purple circle on a black background.
 title: Random
 oneLineDescription: Get random numbers.
 
+
 remix:
-  - revision-2023-dkessner
+  - description: Revised by
+
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+
 ---
 
 This example demonstrates the use of the
diff --git a/src/content/examples/en/06_Calculating_Values/03_Constrain/description.mdx b/src/content/examples/en/06_Calculating_Values/03_Constrain/description.mdx
index ca3aa8514a..3ef6c4c60f 100644
--- a/src/content/examples/en/06_Calculating_Values/03_Constrain/description.mdx
+++ b/src/content/examples/en/06_Calculating_Values/03_Constrain/description.mdx
@@ -5,7 +5,11 @@ title: Constrain
 oneLineDescription: Keep a number within a range.
 
 remix:
-  - revision-2023-calebfoss
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
 ---
 
 This example draws a circle as the cursor's position but
diff --git a/src/content/examples/en/06_Calculating_Values/04_Clock/description.mdx b/src/content/examples/en/06_Calculating_Values/04_Clock/description.mdx
index eaa8dfb51c..e45ed6438f 100644
--- a/src/content/examples/en/06_Calculating_Values/04_Clock/description.mdx
+++ b/src/content/examples/en/06_Calculating_Values/04_Clock/description.mdx
@@ -5,7 +5,12 @@ title: Clock
 oneLineDescription: Get the current time.
 
 remix:
-  - revision-2023-calebfoss
+  - description: Created by
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
 ---
 
 The current time can be read with the
diff --git a/src/content/examples/en/07_Repetition/00_Color_Interpolation/description.mdx b/src/content/examples/en/07_Repetition/00_Color_Interpolation/description.mdx
index f884ca4bf0..eff69c6ce2 100644
--- a/src/content/examples/en/07_Repetition/00_Color_Interpolation/description.mdx
+++ b/src/content/examples/en/07_Repetition/00_Color_Interpolation/description.mdx
@@ -5,7 +5,12 @@ title: Color Interpolation
 oneLineDescription: Fade between two colors.
 
 remix:
-  - revision-2023-calebfoss
+  - description: Created by
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
 ---
 
 <a href="https://developer.mozilla.org/en-US/docs/Glossary/Interpolation" target="_blank">Interpolation</a>
diff --git a/src/content/examples/en/07_Repetition/01_Color_Wheel/description.mdx b/src/content/examples/en/07_Repetition/01_Color_Wheel/description.mdx
index 5200fea8d9..d76b4811fc 100644
--- a/src/content/examples/en/07_Repetition/01_Color_Wheel/description.mdx
+++ b/src/content/examples/en/07_Repetition/01_Color_Wheel/description.mdx
@@ -4,10 +4,17 @@ featuredImageAlt: Small circles, each with a different color, arranged in a circ
 title: Color Wheel
 oneLineDescription: Create a visualization of the color spectrum.
 
-collectivelyAttributedSince: 2024
+
 remix:
-  - attributionLabel: malayvasa2001
-  - revision-2023-calebfoss
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
+      - name: Malay Vasa
+        URL: https://github.com/Malayvasa
+
+  - collectivelyAttributedSince: 2024
 ---
 
 This example illustrates the appearance of different
diff --git a/src/content/examples/en/07_Repetition/02_Bezier/description.mdx b/src/content/examples/en/07_Repetition/02_Bezier/description.mdx
index f422c462e0..27e07e95c9 100644
--- a/src/content/examples/en/07_Repetition/02_Bezier/description.mdx
+++ b/src/content/examples/en/07_Repetition/02_Bezier/description.mdx
@@ -5,7 +5,12 @@ title: Bezier
 oneLineDescription: Draw a set of curves.
 
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+ 
 ---
 
 <a href="https://p5js.org/reference/p5/bezier" target="_blank">bezier()</a> 
diff --git a/src/content/examples/en/07_Repetition/03_Kaleidoscope/description.mdx b/src/content/examples/en/07_Repetition/03_Kaleidoscope/description.mdx
index 673af1a32f..39ae462329 100644
--- a/src/content/examples/en/07_Repetition/03_Kaleidoscope/description.mdx
+++ b/src/content/examples/en/07_Repetition/03_Kaleidoscope/description.mdx
@@ -5,7 +5,12 @@ title: Kaleidoscope
 oneLineDescription: Draw mirrored designs with the mouse.
 
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+ 
 ---
 
 A kaleidoscope is an optical instrument with two or more
diff --git a/src/content/examples/en/07_Repetition/05_Recursive_Tree/description.mdx b/src/content/examples/en/07_Repetition/05_Recursive_Tree/description.mdx
index 761934d8ed..6ef6b6dfb5 100644
--- a/src/content/examples/en/07_Repetition/05_Recursive_Tree/description.mdx
+++ b/src/content/examples/en/07_Repetition/05_Recursive_Tree/description.mdx
@@ -5,12 +5,24 @@ title: Recursive Tree
 oneLineDescription: Draw a tree using a function that calls itself.
 
 
+
 remix:
-  - attributionURL: https://processing.org/examples/tree.html
-    attributionLabel: Processing example by Dan Shiffman
-    remixLabel: Based on
-  - revision-2023-dkessner
-collectivelyAttributedSince: 2024
+  - description: Inspired by
+
+    attribution:
+      - name: Dan Shiffman
+
+    code:
+      - URL: https://processing.org/examples/tree.html
+        label: pre-2023 example
+
+  - description: Revised by
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+ 
+  - collectivelyAttributedSince: 2024
+
 ---
 
 This is an example of rendering a simple tree-like structure via recursion.
diff --git a/src/content/examples/en/08_Listing_Data_with_Arrays/00_Random_Poetry/description.mdx b/src/content/examples/en/08_Listing_Data_with_Arrays/00_Random_Poetry/description.mdx
index db1b021fc2..84b2813ae5 100644
--- a/src/content/examples/en/08_Listing_Data_with_Arrays/00_Random_Poetry/description.mdx
+++ b/src/content/examples/en/08_Listing_Data_with_Arrays/00_Random_Poetry/description.mdx
@@ -4,10 +4,20 @@ featuredImageAlt: A random series of words related to p5.js scattered on a maroo
 title: Random Poetry
 oneLineDescription: Generate a poem with words randomly selected from a bank.
 
-collectivelyAttributedSince: 2024
 remix:
-  - attributionLabel: malayvasa2001
-  - revision-2023-klich
+  - description: Created by
+
+    attribution:
+      - name: Malay Vasa
+        URL: https://github.com/Malayvasa
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+
+    code:
+      - label: 2023 code
+        URL: https://github.com/processing/p5.js-example/tree/main/examples/08_Listing_Data_with_Arrays/00_Random_Poetry
+
+  - collectivelyAttributedSince: 2024
 ---
 
 Using the
diff --git a/src/content/examples/en/09_Angles_And_Motion/00_Sine_Cosine/description.mdx b/src/content/examples/en/09_Angles_And_Motion/00_Sine_Cosine/description.mdx
index 3584b57731..693343513d 100644
--- a/src/content/examples/en/09_Angles_And_Motion/00_Sine_Cosine/description.mdx
+++ b/src/content/examples/en/09_Angles_And_Motion/00_Sine_Cosine/description.mdx
@@ -6,7 +6,12 @@ oneLineDescription: Animate circular, back and forth, and wave motion.
 featured: true
 
 remix:
-  - revision-2023-dkessner
+  - description: Revised by
+
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+ 
 ---
 
 This example demonstrates the
diff --git a/src/content/examples/en/09_Angles_And_Motion/01_Aim/description.mdx b/src/content/examples/en/09_Angles_And_Motion/01_Aim/description.mdx
index 177ec3bf4a..6784123d83 100644
--- a/src/content/examples/en/09_Angles_And_Motion/01_Aim/description.mdx
+++ b/src/content/examples/en/09_Angles_And_Motion/01_Aim/description.mdx
@@ -5,7 +5,11 @@ title: Aim
 oneLineDescription: Rotate toward a point.
 
 remix:
-  - revision-2023-dkessner
+  - description: Revised by
+
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
 ---
 
 The
diff --git a/src/content/examples/en/09_Angles_And_Motion/02_Triangle_Strip/description.mdx b/src/content/examples/en/09_Angles_And_Motion/02_Triangle_Strip/description.mdx
index eabb5409b9..688fcf829c 100644
--- a/src/content/examples/en/09_Angles_And_Motion/02_Triangle_Strip/description.mdx
+++ b/src/content/examples/en/09_Angles_And_Motion/02_Triangle_Strip/description.mdx
@@ -5,11 +5,24 @@ title: Triangle Strip
 oneLineDescription: Split a ring into triangles.
 
 
-collectivelyAttributedSince: 2024
 remix:
-  - attributionURL: https://archive.p5js.org/examples/form-triangle-strip.html
-    attributionLabel: Ira Greenberg
-  - revision-2023-dkessner
+
+  - description: Created by
+    attribution:
+      - name: Ira Greenberg
+    code:
+      - label: pre-2023 example
+        URL: https://archive.p5js.org/examples/form-triangle-strip.html
+
+  - description: Revised by
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+    code:
+      - label: 2023 revision code
+        URL: https://github.com/processing/p5.js-example/tree/main/examples/09_Angles_And_Motion/02_Triangle_Strip
+
+  - collectivelyAttributedSince: 2024
 ---
 
 This example demonstrates how to create a shape
diff --git a/src/content/examples/en/10_Games/02_Snake/description.mdx b/src/content/examples/en/10_Games/02_Snake/description.mdx
index ed07420b87..a55c33b56f 100644
--- a/src/content/examples/en/10_Games/02_Snake/description.mdx
+++ b/src/content/examples/en/10_Games/02_Snake/description.mdx
@@ -4,11 +4,19 @@ featuredImageAlt: A narrow green L shape and a red square representing the snake
 title: Snake
 oneLineDescription: Make a game based on Snake arcade games.
 
-collectivelyAttributedSince: 2024
 remix:
-  - attributionURL: https://github.com/prashantgupta24
-    attributionLabel: Prashant Gupta
-  - revision-2023-calebfoss
+  - description: Created by
+    attribution:
+      - name: Prashant Gupta
+        URL: https://github.com/prashantgupta24
+
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
+
+  - collectivelyAttributedSince: 2024
 ---
 
 This is a reproduction of a type of arcade game called
diff --git a/src/content/examples/en/11_3D/00_Geometries/description.mdx b/src/content/examples/en/11_3D/00_Geometries/description.mdx
index db5e6771ba..332794ddf6 100644
--- a/src/content/examples/en/11_3D/00_Geometries/description.mdx
+++ b/src/content/examples/en/11_3D/00_Geometries/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: Eight 3D shapes; a plane, box, cylinder, cone, torus, sphere,
 title: Geometries
 oneLineDescription: Draw 3D shapes, including a custom model.
 
+
 remix:
-  - revision-2023-calebfoss
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
+ 
 ---
 
 p5's
diff --git a/src/content/examples/en/11_3D/02_Materials/description.mdx b/src/content/examples/en/11_3D/02_Materials/description.mdx
index f75788adc3..cd766f7e48 100644
--- a/src/content/examples/en/11_3D/02_Materials/description.mdx
+++ b/src/content/examples/en/11_3D/02_Materials/description.mdx
@@ -5,7 +5,11 @@ title: Materials
 oneLineDescription: Change 3D objects' color, texture, and how they respond to light.
 
 remix:
-  - revision-2023-calebfoss
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
 ---
 
 In 3D rendering, a material determines how a surface
diff --git a/src/content/examples/en/11_3D/03_Orbit_Control/description.mdx b/src/content/examples/en/11_3D/03_Orbit_Control/description.mdx
index b610b992cd..04dc675a4d 100644
--- a/src/content/examples/en/11_3D/03_Orbit_Control/description.mdx
+++ b/src/content/examples/en/11_3D/03_Orbit_Control/description.mdx
@@ -6,7 +6,11 @@ oneLineDescription: Control the camera with the mouse.
 featured: true
 
 remix:
-  - revision-2023-calebfoss
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
 ---
 
 <a href="https://p5js.org/reference/p5/orbitControl" target="_blank">Orbit control</a>
diff --git a/src/content/examples/en/11_3D/06_Framebuffer_Blur/description.mdx b/src/content/examples/en/11_3D/06_Framebuffer_Blur/description.mdx
index 1710c88b98..d31c0710b9 100644
--- a/src/content/examples/en/11_3D/06_Framebuffer_Blur/description.mdx
+++ b/src/content/examples/en/11_3D/06_Framebuffer_Blur/description.mdx
@@ -5,7 +5,11 @@ title: Framebuffer Blur
 oneLineDescription: Simulate a camera's depth of field.
 
 remix:
-  - revision-2023-calebfoss
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
 ---
 
 The
diff --git a/src/content/examples/en/12_Advanced_Canvas_Rendering/00_Create_Graphics/description.mdx b/src/content/examples/en/12_Advanced_Canvas_Rendering/00_Create_Graphics/description.mdx
index 9177ace321..c90204406d 100644
--- a/src/content/examples/en/12_Advanced_Canvas_Rendering/00_Create_Graphics/description.mdx
+++ b/src/content/examples/en/12_Advanced_Canvas_Rendering/00_Create_Graphics/description.mdx
@@ -5,7 +5,11 @@ title: Create Graphics
 oneLineDescription: Draw imagery off-screen.
 
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
 ---
 
 The
diff --git a/src/content/examples/en/12_Advanced_Canvas_Rendering/02_Shader_As_A_Texture/description.mdx b/src/content/examples/en/12_Advanced_Canvas_Rendering/02_Shader_As_A_Texture/description.mdx
index 21f3768834..2b9909403a 100644
--- a/src/content/examples/en/12_Advanced_Canvas_Rendering/02_Shader_As_A_Texture/description.mdx
+++ b/src/content/examples/en/12_Advanced_Canvas_Rendering/02_Shader_As_A_Texture/description.mdx
@@ -5,7 +5,11 @@ title: Shader as a Texture
 oneLineDescription: Generate a texture for a 3D shape using a shader.
 
 remix:
-  - revision-2023-calebfoss
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
 ---
 
 Shaders can be applied to 2D/3D shapes as textures.
diff --git a/src/content/examples/en/13_Classes_And_Objects/00_Snowflakes/description.mdx b/src/content/examples/en/13_Classes_And_Objects/00_Snowflakes/description.mdx
index b5f163d074..f02cc35e95 100644
--- a/src/content/examples/en/13_Classes_And_Objects/00_Snowflakes/description.mdx
+++ b/src/content/examples/en/13_Classes_And_Objects/00_Snowflakes/description.mdx
@@ -4,11 +4,19 @@ featuredImageAlt: Snowflakes falling on a black background.
 title: Snowflakes
 oneLineDescription: Animate snowfall.
 
-collectivelyAttributedSince: 2024
 remix:
-  - attributionURL: https://archive.p5js.org/examples/simulate-snowflakes.html
-    attributionLabel: Aatish Bhatia
-  - revision-2023-dkessner
+  - description: Created by
+    attribution:
+      - name: Aatish Bhatia
+        URL: https://archive.p5js.org/examples/simulate-snowflakes.html
+
+  - description: Revised by
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+
+  - collectivelyAttributedSince: 2024
+
 ---
 
 This example demonstrates the use of a particle system
diff --git a/src/content/examples/en/13_Classes_And_Objects/01_Shake_Ball_Bounce/description.mdx b/src/content/examples/en/13_Classes_And_Objects/01_Shake_Ball_Bounce/description.mdx
index 8bdddd057b..0ad37ae121 100644
--- a/src/content/examples/en/13_Classes_And_Objects/01_Shake_Ball_Bounce/description.mdx
+++ b/src/content/examples/en/13_Classes_And_Objects/01_Shake_Ball_Bounce/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: Twenty white circles on a black background.
 title: Shake Ball Bounce
 oneLineDescription: Animate ball movement based on mobile device motion.
 
+
 remix:
-  - revision-2023-klich
+  - description: Revised by
+
+    attribution:
+      - name: Kasey Lichtlyter
+        URL: https://www.klich.co/
+ 
 ---
 
 Using a 
diff --git a/src/content/examples/en/13_Classes_And_Objects/02_Connected_Particles/description.mdx b/src/content/examples/en/13_Classes_And_Objects/02_Connected_Particles/description.mdx
index e53f7c5561..c78abc9826 100644
--- a/src/content/examples/en/13_Classes_And_Objects/02_Connected_Particles/description.mdx
+++ b/src/content/examples/en/13_Classes_And_Objects/02_Connected_Particles/description.mdx
@@ -5,7 +5,11 @@ title: Connected Particles
 oneLineDescription: Draw circles and connecting lines using the mouse.
 
 remix:
-  - revision-2023-calebfoss
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
 ---
 
 This example uses two custom
diff --git a/src/content/examples/en/13_Classes_And_Objects/03_Flocking/description.mdx b/src/content/examples/en/13_Classes_And_Objects/03_Flocking/description.mdx
index 895c5c86a6..5483863ba9 100644
--- a/src/content/examples/en/13_Classes_And_Objects/03_Flocking/description.mdx
+++ b/src/content/examples/en/13_Classes_And_Objects/03_Flocking/description.mdx
@@ -4,8 +4,14 @@ featuredImageAlt: A group of bird-like objects, represented by rainbow triangles
 title: Flocking
 oneLineDescription: Simulate bird flocking behavior.
 
+
 remix:
-  - revision-2023-dkessner
+  - description: Revised by
+
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+ 
 ---
 
 Demonstration of flocking behavior.
diff --git a/src/content/examples/en/14_Loading_And_Saving_Data/01_JSON/description.mdx b/src/content/examples/en/14_Loading_And_Saving_Data/01_JSON/description.mdx
index 76c7040cee..9b55836bdb 100644
--- a/src/content/examples/en/14_Loading_And_Saving_Data/01_JSON/description.mdx
+++ b/src/content/examples/en/14_Loading_And_Saving_Data/01_JSON/description.mdx
@@ -4,11 +4,22 @@ featuredImageAlt: Black outlines of circles on a white background. Text below th
 title: JSON
 oneLineDescription: Store data in JavaScript object notation.
 
-collectivelyAttributedSince: 2024
+
 remix:
-  - attributionLabel: Processing example by Daniel Shiffman
-    attributionURL: https://processing.org/examples/loadsavejson.html
-  - revision-2023-calebfoss
+  - description: Created by
+    attribution:
+      - name: Daniel Shiffman
+    code:
+      - label: pre-2023 Processing example
+        URL: https://processing.org/examples/loadsavejson.html
+
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
+
+  - collectivelyAttributedSince: 2024
 ---
 
 <a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/JSON" target="_blank">JavaScript Object Notation, or JSON</a>,
diff --git a/src/content/examples/en/14_Loading_And_Saving_Data/02_Table/description.mdx b/src/content/examples/en/14_Loading_And_Saving_Data/02_Table/description.mdx
index c355e47d55..fbc42a5b0c 100644
--- a/src/content/examples/en/14_Loading_And_Saving_Data/02_Table/description.mdx
+++ b/src/content/examples/en/14_Loading_And_Saving_Data/02_Table/description.mdx
@@ -4,12 +4,21 @@ featuredImageAlt: Black outlines of circles on a white background. Text below th
 title: Table
 oneLineDescription: Store data as comma-separated values.
 
-
-collectivelyAttributedSince: 2024
 remix:
-  - attributionLabel: Processing example by Daniel Shiffman
-    attributionURL: https://processing.org/examples/loadsavetable.html
-  - revision-2023-calebfoss
+  - description: Created by
+    attribution:
+      - name: Daniel Shiffman
+    code:
+      - label: pre-2023 Processing example
+        URL: https://processing.org/examples/loadsavetable.html
+
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
+
+  - collectivelyAttributedSince: 2024
 ---
 
 Comma-Separated Values, or CSV, is a format for writing
diff --git a/src/content/examples/en/15_Math_And_Physics/00_Non_Orthogonal_Reflection/description.mdx b/src/content/examples/en/15_Math_And_Physics/00_Non_Orthogonal_Reflection/description.mdx
index ea9751a90e..0320f06aee 100644
--- a/src/content/examples/en/15_Math_And_Physics/00_Non_Orthogonal_Reflection/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/00_Non_Orthogonal_Reflection/description.mdx
@@ -4,14 +4,22 @@ featuredImageAlt: A small green circle hovering over a yellow tilted plane at th
 title: Non-Orthogonal Reflection
 oneLineDescription: Simulate a ball bouncing on a slanted surface.
 
+
 remix:
-  - attributionLabel: Processing example by Ira Greenberg
-    attributionURL: https://processing.org/examples/reflection1.html
-    remixLabel: Based on
-  - attributionLabel: David Blitz
-    remixLabel: Ported by
-  - revision-2023-dkessner
-collectivelyAttributedSince: 2024
+  - description: Based on
+    attribution:
+      - name: Processing example by Ira Greenberg
+        URL: https://processing.org/examples/reflection1.html
+  - description: Ported by
+    attribution:
+      - name: David Blitz
+
+  - description: Revised by
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+
+  - collectivelyAttributedSince: 2024
 ---
 
 This example demonstrates a ball bouncing on a slanted
diff --git a/src/content/examples/en/15_Math_And_Physics/01_Soft_Body/description.mdx b/src/content/examples/en/15_Math_And_Physics/01_Soft_Body/description.mdx
index 989487bd2c..74cf30d7e9 100644
--- a/src/content/examples/en/15_Math_And_Physics/01_Soft_Body/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/01_Soft_Body/description.mdx
@@ -4,11 +4,22 @@ featuredImageAlt: A yellow pentagon on a black background.
 title: Soft Body
 oneLineDescription: Simulate the physics of a soft body accelerating toward the mouse.
 
-collectivelyAttributedSince: 2024
+
+
 remix:
-  - attributionURL: https://archive.p5js.org/examples/simulate-soft-body.html
-    attributionLabel: Ira Greenberg
-  - revision-2023-dkessner
+  - description: Created by
+    attribution:
+      - name: Ira Greenberg
+    code:
+      - label: pre-2023 example
+        URL: https://archive.p5js.org/examples/simulate-soft-body.html
+
+  - description: Revised by
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+
+  - collectivelyAttributedSince: 2024
 ---
 
 Physics simulation of a soft body experiencing
diff --git a/src/content/examples/en/15_Math_And_Physics/02_Forces/description.mdx b/src/content/examples/en/15_Math_And_Physics/02_Forces/description.mdx
index 801753b8fc..571174c564 100644
--- a/src/content/examples/en/15_Math_And_Physics/02_Forces/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/02_Forces/description.mdx
@@ -5,10 +5,18 @@ title: Forces
 oneLineDescription: Simulate forces on multiple bodies as they move through liquid.
 
 remix:
-  - attributionURL: http://natureofcode.com
-    attributionLabel: Dan Shiffman's "Nature of Code"
-    remixLabel: Inspired by
-  - revision-2023-dkessner
+  - description: Inspired by
+    attribution:
+      - name: Dan Shiffman's "Nature of Code"
+        URL: http://natureofcode.com
+
+  - description: Revised by
+
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+
+  - collectivelyAttributedSince: 2024
 ---
 
 Demonstration of multiple forces acting on bodies.
diff --git a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
index b7a9800888..f7f6a15277 100644
--- a/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/03_Smoke_Particle_System/description.mdx
@@ -5,11 +5,18 @@ title: Smoke Particles
 oneLineDescription: Simulate smoke with a particle system.
 featured: true
 
-collectivelyAttributedSince: 2024
 remix:
-  - attributionURL: https://natureofcode.com/book/chapter-4-particle-systems/
-    attributionLabel: Dan Shiffman's example
-  - revision-2023-dkessner
+  - description: Based on
+    attribution:
+      - name: Dan Shiffman's example
+        URL: https://natureofcode.com/book/chapter-4-particle-systems/
+
+  - description: Revised by
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+
+  - collectivelyAttributedSince: 2024
 ---
 
 
diff --git a/src/content/examples/en/15_Math_And_Physics/04_Game_Of_Life/description.mdx b/src/content/examples/en/15_Math_And_Physics/04_Game_Of_Life/description.mdx
index d005e2abfb..bdcb57938d 100644
--- a/src/content/examples/en/15_Math_And_Physics/04_Game_Of_Life/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/04_Game_Of_Life/description.mdx
@@ -4,11 +4,20 @@ featuredImageAlt: Grid of squares made of black lines on a white background. Som
 title: Game of Life
 oneLineDescription: Recreate John Conway's cellular automaton.
 
+
 remix:
-  - attributionURL: http://natureofcode.com
-    attributionLabel: Dan Shiffman's "Nature of Code"
-    remixLabel: Inspired by
-  - revision-2023-calebfoss
+  - description: Inspired by
+    attribution:
+      - name: Dan Shiffman's "Nature of Code"
+        URL: http://natureofcode.com
+
+  - description: Revised by
+
+    attribution:
+      - name: Caleb Foss
+        URL: https://github.com/calebfoss
+
+  - collectivelyAttributedSince: 2024
 ---
 
 The Game of Life is a cellular automaton created by
diff --git a/src/content/examples/en/15_Math_And_Physics/05_Mandelbrot/description.mdx b/src/content/examples/en/15_Math_And_Physics/05_Mandelbrot/description.mdx
index 185df64d2a..d1c3d9aaaa 100644
--- a/src/content/examples/en/15_Math_And_Physics/05_Mandelbrot/description.mdx
+++ b/src/content/examples/en/15_Math_And_Physics/05_Mandelbrot/description.mdx
@@ -4,10 +4,19 @@ featuredImageAlt: Colorful rendering of the Mandelbrot set.
 title: Mandelbrot Set
 oneLineDescription: Visualize a mathematical set that produces fractal structures.
 
+
 remix:
-  - attributionURL: https://processing.org/examples/mandelbrot.html
-    attributionLabel: Dan Shiffman's example for Processing
-  - revision-2023-dkessner
+  - description: Based on
+    attribution:
+      - name: Dan Shiffman's example for Processing
+        URL: https://processing.org/examples/mandelbrot.html
+
+  - description: Revised by
+    attribution:
+      - name: Darren Kessner
+        URL: https://github.com/dkessner
+
+  - collectivelyAttributedSince: 2024
 ---
 
 Colorful rendering of the Mandelbrot set.
\ No newline at end of file
diff --git a/src/layouts/ExampleLayout.astro b/src/layouts/ExampleLayout.astro
index 6565c26d96..8150a39f9d 100644
--- a/src/layouts/ExampleLayout.astro
+++ b/src/layouts/ExampleLayout.astro
@@ -46,7 +46,6 @@ const { Content } = await example.render();
 // Extract the collective attribution year. If multiple provided, uses last shown.
 const collectivelyAttributedSince = example.data.remix?.reduce(
   (acc: number | null, item) => {
-    if (typeof item === "string") return acc;
     if (item.collectivelyAttributedSince) {
       return item.collectivelyAttributedSince;
     }
@@ -55,6 +54,11 @@ const collectivelyAttributedSince = example.data.remix?.reduce(
   null
 );
 
+// Boolean value on whether the remix history contains links to code
+const remixHistoryHasCodeLinks = example.data.remix?.some(
+  (item) => Array.isArray(item.code) && item.code.length > 0
+);
+
 ---
 
 <Head
@@ -77,19 +81,19 @@ const collectivelyAttributedSince = example.data.remix?.reduce(
       <Content />
     </div>
     <div class="rendered-markdown">
+      <img src="/images/by-nc-sa.svg" />
+
       <p>
 
       <a href={Astro.url.pathname}>{example.data.title}</a>:{" "}
 
       {example.data.remix?.map((item, i) => {
-        if (typeof item === "string") return null;
-
         const parts = [];
 
-        // Each remix entry requires either attribution, or a codeURL; these have no defaults
+        // Each remix entry requires at least one attribution
         // If a remix entry contains a collective attribution starting year, it is ignored here
 
-        if (!item.collectivelyAttributedSince && (item.attribution || item.codeURL)) {
+        if (!item.collectivelyAttributedSince && item.attribution) {
           parts.push(<>{item.description}</>);
 
           if (item.attribution?.length) {
@@ -99,20 +103,16 @@ const collectivelyAttributedSince = example.data.remix?.reduce(
                 {item.attribution.map((a, j) => (
                   <>
                     {a.URL ? <a href={a.URL}>{a.name}</a> : a.name}
-                    {j < (item.attribution?.length ?? 0) - 1 ? ", " : !item.codeURL ? "." : ""}
+                    {
+                      item.attribution?.length
+                      ? j < item.attribution.length - 1 ? ", " : "."
+                      : ""
+                    }
                   </>
                 ))}
               </>
             );
           }
-
-          if (item.codeURL) {
-            parts.push(
-              <span>
-                (<a href={item.codeURL}>{item.codeLabel || "code"}</a>).
-              </span>
-            );
-          }
         }
 
         return <span>{i > 0 && " "}{parts}</span>;
@@ -131,7 +131,30 @@ const collectivelyAttributedSince = example.data.remix?.reduce(
         <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
       </span>
     </p>
-    <img src="/images/by-nc-sa.svg" />
+
+    <p>
+      {remixHistoryHasCodeLinks ? (
+        <>
+          View example history:{" "}
+          {example.data.remix
+            .map(item => item?.code)
+            .flat()
+            .filter(codeItem => codeItem && codeItem.URL)
+            .map((codeItem, i, codeItemsList) => (
+              <>
+                <a href={codeItem?.URL}>{codeItem?.label}</a>{
+                  i < (codeItemsList?.length ?? 0) - 1 ? ", " : "... "
+                }
+              </>
+            ))}
+          or <a href="https://github.com/processing/p5.js-website">contribute to the current website</a>!
+        </>
+      ) : (
+        <></>
+      )}
+    </p>
+
+
   </div>
 
   <EditableSketch code={code} />