diff --git a/src/Elastic.Markdown/Slices/Layout/_Breadcrumbs.cshtml b/src/Elastic.Markdown/Slices/Layout/_Breadcrumbs.cshtml
index 733fae2d1..43999e8d6 100644
--- a/src/Elastic.Markdown/Slices/Layout/_Breadcrumbs.cshtml
+++ b/src/Elastic.Markdown/Slices/Layout/_Breadcrumbs.cshtml
@@ -1,7 +1,17 @@
+@using Elastic.Markdown.Helpers
 @inherits RazorSlice<LayoutViewModel>
 <ol id="breadcrumbs" class="block w-full" itemscope="" itemtype="https://schema.org/BreadcrumbList">
 	<li class="inline text-ink text-sm hover:text-ink leading-[1.2em] tracking-[-0.02em]" itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem">
-		<a itemprop="item" href="@Model.UrlPathPrefix/">
+		<a 
+			itemprop="item"
+			href="@Model.UrlPathPrefix/"
+			hx-get="@Model.UrlPathPrefix/"
+			hx-select-oob="@Htmx.GetHxSelectOob()"
+			hx-swap="none"
+			hx-push-url="true"
+			hx-indicator="#htmx-indicator"
+			preload="mouseover"
+	>
 			<span itemprop="name" class="hover:text-ink">Elastic</span>
 		</a>
 		<meta itemprop="position" content="1">
@@ -10,7 +20,16 @@
 	{
 		<li class="inline text-gray-500 text-sm leading-[1.2em] tracking-[-0.02em]" itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem">
 			<span class="px-1">/</span>
-			<a itemprop="item" href="@item.Url">
+			<a
+				itemprop="item" 
+				href="@item.Url"
+				hx-get="@item.Url"
+				hx-select-oob="@Htmx.GetHxSelectOob()"
+				hx-swap="none"
+				hx-push-url="true"
+				hx-indicator="#htmx-indicator"
+				preload="mouseover"
+			>
 				<span itemprop="name" class="hover:text-ink">@item.NavigationTitle</span>
 			</a>
 			<meta itemprop="position" content="2">