diff --git a/htdocs/assets/_floatingbar.php b/htdocs/assets/_floatingbar.php
new file mode 100644
index 0000000..34691cc
--- /dev/null
+++ b/htdocs/assets/_floatingbar.php
@@ -0,0 +1,7 @@
+<div id="floating-bar" class="fixed inset-x-0 bottom-[7vh] z-[50] flex justify-center items-center">
+    <div id="searchbar" class="searchbar bg-bg_secondary rounded-full p-[0.30rem] flex items-center cursor-pointer mx-2 hover:shadow-[0px_0px_30px] hover:shadow-accent_primary_extratransparent transition transform duration-300">
+        <button class="bg-accent_primary px-3 py-2 rounded-full"><i class="fa-solid fa-magnifying-glass text-bg_primary"></i></button>
+        <p class="ml-3 mr-4 text-accent_three">SEARCH</p>
+    </div>
+    <button id="sharebutton" class="sharebutton bg-accent_primary px-[0.80rem] py-2 rounded-full mx-2 hover:shadow-[0px_0px_30px] hover:shadow-accent_primary_transparent transition transform duration-300"><i class="fa-solid fa-share-nodes text-bg_primary"></i></button>
+</div>
\ No newline at end of file
diff --git a/htdocs/assets/_preloader.php b/htdocs/assets/_preloader.php
new file mode 100644
index 0000000..cff6e76
--- /dev/null
+++ b/htdocs/assets/_preloader.php
@@ -0,0 +1 @@
+<div id="preloader" class="absolute top-0 right-0 h-full w-screen z-[100] flex justify-center items-center bg-bg_primary overflow-hidden"><div class="spinner border-[5px] border-accent_secondary_transparent border-t-[5px] border-t-accent_primary rounded-[50%] h-[50px] w-[50px] animate-spin"></div></div>
\ No newline at end of file
diff --git a/htdocs/index.php b/htdocs/index.php
index 860f0ce..47b8d9d 100644
--- a/htdocs/index.php
+++ b/htdocs/index.php
@@ -13,14 +13,8 @@ require './core/query_functions.php';
     <?php require 'assets/_integrate.php';?>
 </head>
 <body class="font-lexend bg-bg_primary text-accent_secondary">
-    <div id="preloader" class="absolute top-0 right-0 h-full w-screen z-[100] flex justify-center items-center bg-bg_primary overflow-hidden"><div class="spinner border-[5px] border-accent_secondary_transparent border-t-[5px] border-t-accent_primary rounded-[50%] h-[50px] w-[50px] animate-spin"></div></div>
-    <div id="floating-bar" class="fixed inset-x-0 bottom-[7vh] z-[50] flex justify-center items-center">
-        <div id="searchbar" class="searchbar bg-bg_secondary rounded-full p-[0.30rem] flex items-center cursor-pointer mx-2 hover:shadow-[0px_0px_30px] hover:shadow-accent_primary_extratransparent transition transform duration-300">
-            <button class="bg-accent_primary px-3 py-2 rounded-full"><i class="fa-solid fa-magnifying-glass text-bg_primary"></i></button>
-            <p class="ml-3 mr-4 text-accent_three">SEARCH</p>
-        </div>
-        <button id="sharebutton" class="sharebutton bg-accent_primary px-[0.80rem] py-2 rounded-full mx-2 hover:shadow-[0px_0px_30px] hover:shadow-accent_primary_transparent transition transform duration-300"><i class="fa-solid fa-share-nodes text-bg_primary"></i></button>
-    </div>
+    <?php include 'assets/_preloader.php';?>
+    <?php include 'assets/_floatingbar.php';?>
     <?php require 'assets/_header.php';?>
     <div class="homebox w-full px-4 lg:px-[4.5rem]">
         <div class="herosection w-full flex flex-col-reverse justify-center lg:flex-row lg:justify-between items-center mb-3">
diff --git a/htdocs/projects.php b/htdocs/projects.php
index 75ce839..dcc0cd6 100644
--- a/htdocs/projects.php
+++ b/htdocs/projects.php
@@ -15,14 +15,8 @@ $years = create_project_years_array($conn);
     <?php require 'assets/_integrate.php';?>
 </head>
 <body class="font-lexend bg-bg_primary text-accent_secondary">
-    <div id="preloader" class="absolute top-0 right-0 h-full w-screen z-[100] flex justify-center items-center bg-bg_primary overflow-hidden"><div class="spinner border-[5px] border-accent_secondary_transparent border-t-[5px] border-t-accent_primary rounded-[50%] h-[50px] w-[50px] animate-spin"></div></div>
-    <div id="floating-bar" class="fixed inset-x-0 bottom-[7vh] z-[50] flex justify-center items-center">
-        <div id="searchbar" class="searchbar bg-bg_secondary rounded-full p-[0.30rem] flex items-center cursor-pointer mx-2 hover:shadow-[0px_0px_30px] hover:shadow-accent_primary_extratransparent transition transform duration-300">
-            <button class="bg-accent_primary px-3 py-2 rounded-full"><i class="fa-solid fa-magnifying-glass text-bg_primary"></i></button>
-            <p class="ml-3 mr-4 text-accent_three">SEARCH</p>
-        </div>
-        <button id="sharebutton" class="sharebutton bg-accent_primary px-[0.80rem] py-2 rounded-full mx-2 hover:shadow-[0px_0px_30px] hover:shadow-accent_primary_transparent transition transform duration-300"><i class="fa-solid fa-share-nodes text-bg_primary"></i></button>
-    </div>
+    <?php include 'assets/_preloader.php';?>
+    <?php include 'assets/_floatingbar.php';?>
     <?php require 'assets/_header.php';?>
     <div class="projectsbox w-full px-4 lg:px-[4.5rem]">
         <div class="herosection w-full flex flex-col-reverse justify-center lg:flex-row lg:justify-between items-center mb-3">
