diff --git a/packages/webawesome/docs/assets/examples/layout-patterns/checkout.html b/packages/webawesome/docs/assets/examples/layout-patterns/checkout.html
index 04ccc75bd..7e75d0a79 100644
--- a/packages/webawesome/docs/assets/examples/layout-patterns/checkout.html
+++ b/packages/webawesome/docs/assets/examples/layout-patterns/checkout.html
@@ -17,7 +17,7 @@
     <a href="#" slot="banner" style="background-color: var(--wa-color-warning-fill-normal)">Get in on our holiday
       deals!</a>
     <header slot="header" class="wa-cluster wa-desktop-only" style="justify-content: space-between">
-      <div style="background-color: black; height: 40px; width: 40px"></div>
+      <a href="/assets/examples/layout-patterns/" style="background-color: black; height: 40px; width: 40px"></a>
       <wa-input placeholder="Search the best shops in the country" size="medium" style="width: 50%;">
         <wa-icon name="magnifying-glass" variant="solid" slot="suffix"></wa-icon>
       </wa-input>
diff --git a/packages/webawesome/docs/assets/examples/layout-patterns/index.html b/packages/webawesome/docs/assets/examples/layout-patterns/index.html
index 34b177e07..87a4e8f6b 100644
--- a/packages/webawesome/docs/assets/examples/layout-patterns/index.html
+++ b/packages/webawesome/docs/assets/examples/layout-patterns/index.html
@@ -17,7 +17,7 @@
     <a href="#" slot="banner" style="background-color: var(--wa-color-warning-fill-normal)">Get in on our holiday
       deals!</a>
     <header slot="header" class="wa-cluster wa-desktop-only" style="justify-content: space-between">
-      <div style="background-color: black; height: 40px; width: 40px"></div>
+      <a href="/assets/examples/layout-patterns/" style="background-color: black; height: 40px; width: 40px"></a>
       <wa-input placeholder="Search the best shops in the country" size="medium" style="width: 50%;">
         <wa-icon name="magnifying-glass" variant="solid" slot="suffix"></wa-icon>
       </wa-input>
diff --git a/packages/webawesome/docs/assets/examples/layout-patterns/product-single.html b/packages/webawesome/docs/assets/examples/layout-patterns/product-single.html
index d59e51294..04c9dbd58 100644
--- a/packages/webawesome/docs/assets/examples/layout-patterns/product-single.html
+++ b/packages/webawesome/docs/assets/examples/layout-patterns/product-single.html
@@ -17,7 +17,7 @@
     <a href="#" slot="banner" style="background-color: var(--wa-color-warning-fill-normal)">Get in on our holiday
       deals!</a>
     <header slot="header" class="wa-cluster wa-desktop-only" style="justify-content: space-between">
-      <div style="background-color: black; height: 40px; width: 40px"></div>
+      <a href="/assets/examples/layout-patterns/" style="background-color: black; height: 40px; width: 40px"></a>
       <wa-input placeholder="Search the best shops in the country" size="medium" style="width: 50%;">
         <wa-icon name="magnifying-glass" variant="solid" slot="suffix"></wa-icon>
       </wa-input>