diff --git a/layouts/partials/content.html b/layouts/partials/content.html
index 2346f3a030a..323c1732280 100644
--- a/layouts/partials/content.html
+++ b/layouts/partials/content.html
@@ -19,31 +19,7 @@
       {{ .Content | replaceRE "(<h[2-9] id=\"([^\"]+)\".+)(</h[2-9]+>)" `${1} <a class="headline-hash" href="#${2}"><span class="icon hashlink"><i class="fas fa-hashtag"></i></span></a>${3}` | safeHTML }}
 
       {{ if $isScaler }}
-      <br />
-      <br />
-
-      <h2 id="available-scalers">
-        Currently available scalers for KEDA
-      </h2>      
-      <div class="buttons" style="display: flex; justify-content: flex-end">
-        <form class="control has-icons-left has-extra-sm-right-margin" id="search" role="search">
-          <input class="input is-rounded" type="search" placeholder="Search for scalers" id="search-input">
-          <span class="icon is-small is-left">
-            <i class="fas fa-search"></i>
-          </span>
-        </form>        
-        <button id="btn-focus-on-mount" class="button filterBtn is-focused" value="built-in-scalers">Built-in</button>
-        <button class="button filterBtn" value="external-scalers">External</button>
-      </div>
-      <div class="results"></div>
-      <div id="built-in-scalers" style="margin-top: 20px" class="columns is-multiline is-search-result">
-        {{ partial "scaler-template" . }}
-      </div>
-      <div id="external-scalers" style="display: none;">
-        <p>External scaler information is pulled from Artifact Hub. External scaler maintainers can learn more on <a href="https://artifacthub.io/docs/topics/repositories/#keda-scalers-repositories">Artifact Hub docs</a></p>
-        <div class="artifacthub-widget-group" data-url="https://artifacthub.io/packages/search?kind=8&sort=relevance&page=1" data-theme="light" data-header="false" data-stars="true" data-color="#405273" data-responsive="true"  data-loading="true"></div>
-        <script async src="https://artifacthub.io/artifacthub-widget.js"></script>
-      </div>
+      {{ partial "scaler-layout" . }}
       {{ end }}
     </div>
   </div>
diff --git a/layouts/partials/scaler-layout.html b/layouts/partials/scaler-layout.html
new file mode 100644
index 00000000000..319b76b87bb
--- /dev/null
+++ b/layouts/partials/scaler-layout.html
@@ -0,0 +1,58 @@
+<br />
+<br />
+
+<h2 id="available-scalers">Currently available scalers for KEDA</h2>
+<div class="buttons" style="display: flex; justify-content: flex-end">
+  <form
+    class="control has-icons-left has-extra-sm-right-margin"
+    id="search"
+    role="search"
+  >
+    <input
+      class="input is-rounded"
+      type="search"
+      placeholder="Search for scalers"
+      id="search-input"
+    />
+    <span class="icon is-small is-left">
+      <i class="fas fa-search"></i>
+    </span>
+  </form>
+  <button
+    id="btn-focus-on-mount"
+    class="button filterBtn is-focused"
+    value="built-in-scalers"
+  >
+    Built-in
+  </button>
+  <button class="button filterBtn" value="external-scalers">External</button>
+</div>
+<div class="results"></div>
+<div
+  id="built-in-scalers"
+  style="margin-top: 20px"
+  class="columns is-multiline is-search-result"
+>
+  {{ partial "scaler-template" . }}
+</div>
+<div id="external-scalers" style="display: none">
+  <p>
+    External scaler information is pulled from Artifact Hub. External scaler
+    maintainers can learn more on
+    <a
+      href="https://artifacthub.io/docs/topics/repositories/#keda-scalers-repositories"
+      >Artifact Hub docs</a
+    >
+  </p>
+  <div
+    class="artifacthub-widget-group"
+    data-url="https://artifacthub.io/packages/search?kind=8&sort=relevance&page=1"
+    data-theme="light"
+    data-header="false"
+    data-stars="true"
+    data-color="#405273"
+    data-responsive="true"
+    data-loading="true"
+  ></div>
+  <script async src="https://artifacthub.io/artifacthub-widget.js"></script>
+</div>