diff --git a/views/components/header/header.html b/views/components/header/header.html
index f76463d..ccb4e89 100644
--- a/views/components/header/header.html
+++ b/views/components/header/header.html
@@ -13,7 +13,7 @@
         <div class="ribbon-content">
           <div class="ribbon-company-info">
             <img
-              src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
+              src="components/header/images/kylong-logo.png"
               alt="Ky Long Logo"
               class="ribbon-logo"
             />
@@ -32,7 +32,7 @@
           <div class="col-lg-6 col-md-6 col-12">
             <div class="d-flex align-items-center">
               <img
-                src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
+                src="components/header/images/kylong-logo.png"
                 alt="Ky Long Logo"
                 class="logo me-3"
               />
diff --git a/views/components/header/images/kylong-logo.png b/views/components/header/images/kylong-logo.png
new file mode 100644
index 0000000..2b79c8b
Binary files /dev/null and b/views/components/header/images/kylong-logo.png differ
diff --git a/views/contactPages/contactMain.html b/views/contactPages/contactMain.html
index b4da0b0..e9c7fcb 100644
--- a/views/contactPages/contactMain.html
+++ b/views/contactPages/contactMain.html
@@ -29,112 +29,7 @@
   />
   <body>
     <!-- Header Component -->
-    <div class="top-ribbon">
-      <div class="container-fluid px-4">
-        <div class="ribbon-content">
-          <div class="ribbon-company-info">
-            <img
-              src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
-              alt="Ky Long Logo"
-              class="ribbon-logo"
-            />
-            <span class="ribbon-company-name">KỲ LONG</span>
-            <span>Thắp sáng tương lai, vững bền thành quả</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <!-- Header Section -->
-    <header class="header py-3">
-      <div class="container-fluid px-4">
-        <div class="row align-items-center">
-          <!-- Logo and Company Info -->
-          <div class="col-lg-6 col-md-6 col-12">
-            <div class="d-flex align-items-center">
-              <button class="mobile-menu-btn me-3">
-                <i class="bi bi-list"></i>
-              </button>
-              <img
-                src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
-                alt="Ky Long Logo"
-                class="logo me-3"
-              />
-              <div class="company-info">
-                <div>
-                  <a
-                    href="/"
-                    title="Công ty TNHH Đầu Tư Thương Mại Dịch Vụ Kỳ Long"
-                    class="company-name"
-                  >
-                    CÔNG TY TNHH ĐẦU TƯ THƯƠNG MẠI DỊCH VỤ KỲ LONG
-                  </a>
-                </div>
-                <div class="company-slogan">
-                  Thắp sáng tương lai, vững bền thành quả
-                </div>
-                <div class="company-year">SINCE 2010</div>
-              </div>
-            </div>
-          </div>
-
-          <!-- Contact Info - Horizontal Layout -->
-          <div class="col-lg-6 col-md-6 col-12 contact-section">
-            <div class="row g-3">
-              <!-- Address -->
-              <div class="col-md-6 col-12">
-                <div class="d-flex align-items-center">
-                  <div
-                    class="contact-icon2 d-flex align-items-center justify-content-center me-2"
-                  >
-                    <i class="bi bi-geo-alt-fill"></i>
-                  </div>
-                  <div class="contact-text">
-                    <div>Lầu 12, số 27 Đinh Bộ Lĩnh,</div>
-                    <div>P. Bình Thạnh, TP.Hồ Chí Minh</div>
-                  </div>
-                </div>
-              </div>
-
-              <!-- Email -->
-              <div class="col-md-6 col-12">
-                <div class="d-flex align-items-center">
-                  <div
-                    class="contact-icon d-flex align-items-center justify-content-center me-2"
-                  >
-                    <i class="bi bi-envelope-open-fill"></i>
-                  </div>
-
-                  <div class="contact-text">
-                    <div>Email:</div>
-                    <div class="contact-text">info@kylongtech.com</div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </header>
-
-    <!-- Navigation Section -->
-    <nav class="nav-container">
-      <div class="container-fluid px-4">
-        <div class="navbar-nav d-flex flex-row justify-content-around py-3">
-          <a href="/" class="nav-link" id="home">TRANG CHỦ</a>
-          <span class="separator"></span>
-          <a href="/aboutMain" class="nav-link" id="about">GIỚI THIỆU</a>
-          <span class="separator"></span>
-          <a href="/productMain" class="nav-link" id="products">SẢN PHẨM</a>
-          <span class="separator"></span>
-          <a href="/serviceMain" class="nav-link" id="services">DỊCH VỤ</a>
-          <span class="separator"></span>
-          <a href="/newsMain" class="nav-link" id="news">TIN TỨC</a>
-          <span class="separator"></span>
-          <a href="/contactMain" class="nav-link" id="contact">LIÊN HỆ</a>
-        </div>
-      </div>
-    </nav>
+    <div id="header"></div>
 
     <!-- Floating Menu Button -->
     <button class="floating-menu-btn" id="floatingMenuBtn">
@@ -301,7 +196,7 @@
     <div id="footer"></div>
 
     <!-- Scripts -->
-    <script src="/components/header/header.js"></script>
+    <script src="/components/header/headerLoader.js"></script>
     <script src="contactPages/contactMain.js"></script>
   </body>
 </html>
diff --git a/views/homePages/homeMain.html b/views/homePages/homeMain.html
index d768e93..d12f010 100644
--- a/views/homePages/homeMain.html
+++ b/views/homePages/homeMain.html
@@ -23,112 +23,7 @@
   </head>
   <body>
     <!-- Header Component -->
-    <div class="top-ribbon">
-      <div class="container-fluid px-4">
-        <div class="ribbon-content">
-          <div class="ribbon-company-info">
-            <img
-              src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
-              alt="Ky Long Logo"
-              class="ribbon-logo"
-            />
-            <span class="ribbon-company-name">KỲ LONG</span>
-            <span>Thắp sáng tương lai, vững bền thành quả</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <!-- Header Section -->
-    <header class="header py-3">
-      <div class="container-fluid px-4">
-        <div class="row align-items-center">
-          <!-- Logo and Company Info -->
-          <div class="col-lg-6 col-md-6 col-12">
-            <div class="d-flex align-items-center">
-              <button class="mobile-menu-btn me-3">
-                <i class="bi bi-list"></i>
-              </button>
-              <img
-                src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
-                alt="Ky Long Logo"
-                class="logo me-3"
-              />
-              <div class="company-info">
-                <div>
-                  <a
-                    href="/"
-                    title="Công ty TNHH Đầu Tư Thương Mại Dịch Vụ Kỳ Long"
-                    class="company-name"
-                  >
-                    CÔNG TY TNHH ĐẦU TƯ THƯƠNG MẠI DỊCH VỤ KỲ LONG
-                  </a>
-                </div>
-                <div class="company-slogan">
-                  Thắp sáng tương lai, vững bền thành quả
-                </div>
-                <div class="company-year">SINCE 2010</div>
-              </div>
-            </div>
-          </div>
-
-          <!-- Contact Info - Horizontal Layout -->
-          <div class="col-lg-6 col-md-6 col-12 contact-section">
-            <div class="row g-3">
-              <!-- Address -->
-              <div class="col-md-6 col-12">
-                <div class="d-flex align-items-center">
-                  <div
-                    class="contact-icon2 d-flex align-items-center justify-content-center me-2"
-                  >
-                    <i class="bi bi-geo-alt-fill"></i>
-                  </div>
-                  <div class="contact-text">
-                    <div>Lầu 12, số 27 Đinh Bộ Lĩnh,</div>
-                    <div>P. Bình Thạnh, TP.Hồ Chí Minh</div>
-                  </div>
-                </div>
-              </div>
-
-              <!-- Email -->
-              <div class="col-md-6 col-12">
-                <div class="d-flex align-items-center">
-                  <div
-                    class="contact-icon d-flex align-items-center justify-content-center me-2"
-                  >
-                    <i class="bi bi-envelope-open-fill"></i>
-                  </div>
-
-                  <div class="contact-text">
-                    <div>Email:</div>
-                    <div class="contact-text">info@kylongtech.com</div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </header>
-
-    <!-- Navigation Section -->
-    <nav class="nav-container">
-      <div class="container-fluid px-4">
-        <div class="navbar-nav d-flex flex-row justify-content-around py-3">
-          <a href="/" class="nav-link" id="home">TRANG CHỦ</a>
-          <span class="separator"></span>
-          <a href="/aboutMain" class="nav-link" id="about">GIỚI THIỆU</a>
-          <span class="separator"></span>
-          <a href="/productMain" class="nav-link" id="products">SẢN PHẨM</a>
-          <span class="separator"></span>
-          <a href="/serviceMain" class="nav-link" id="services">DỊCH VỤ</a>
-          <span class="separator"></span>
-          <a href="/newsMain" class="nav-link" id="news">TIN TỨC</a>
-          <span class="separator"></span>
-          <a href="/contactMain" class="nav-link" id="contact">LIÊN HỆ</a>
-        </div>
-      </div>
-    </nav>
+    <div id="header"></div>
 
     <!-- Floating Menu Button -->
     <button class="floating-menu-btn" id="floatingMenuBtn">
@@ -707,6 +602,6 @@
     <div id="footer"></div>
 
     <script src="homePages/homeMain.js?v=1.1"></script>
-    <script src="/components/header/header.js"></script>
+    <script src="/components/header/headerLoader.js"></script>
   </body>
 </html>
diff --git a/views/newsPages/newsArticle1/newsArticle1.html b/views/newsPages/newsArticle1/newsArticle1.html
index 2398ce9..72aaa56 100644
--- a/views/newsPages/newsArticle1/newsArticle1.html
+++ b/views/newsPages/newsArticle1/newsArticle1.html
@@ -1,21 +1,23 @@
 <!-- views\newsPage\newsArticle1\newsArticle1.html -->
-<!DOCTYPE html>
+<!doctype html>
 <html lang="vi">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Tin Tức - Công ty TNHH Đầu Tư Thương Mại Dịch Vụ Kỳ Long</title>
     <link
+      href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css"
       rel="stylesheet"
-      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
     />
     <link
-      rel="preload"
-      href="components/header/header.html"
-      as="fetch"
-      crossorigin="anonymous"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
+      rel="stylesheet"
     />
-    <link rel="stylesheet" href="components/header/header.css" />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css"
+    />
+    <link href="/components/header/header.css?v=1.1" rel="stylesheet" />
     <link rel="stylesheet" href="components/footer/footer.css" />
     <link rel="stylesheet" href="newsPages/newsArticle1/newsArticle1.css" />
   </head>
@@ -490,7 +492,7 @@
     <!-- Footer Component -->
     <div id="footer"></div>
 
-    <script src="components/header/header.js"></script>
+    <script src="components/header/headerLoader.js"></script>
     <script src="newsPages/newsArticle1/newsArticle1.js"></script>
   </body>
 </html>
diff --git a/views/newsPages/newsArticle2/newsArticle2.html b/views/newsPages/newsArticle2/newsArticle2.html
index 062d7ca..b89dea3 100644
--- a/views/newsPages/newsArticle2/newsArticle2.html
+++ b/views/newsPages/newsArticle2/newsArticle2.html
@@ -1,21 +1,23 @@
 <!-- views\newsPage\newsArticle2\newsArticle2.html -->
-<!DOCTYPE html>
+<!doctype html>
 <html lang="vi">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Tin Tức - Công ty TNHH Đầu Tư Thương Mại Dịch Vụ Kỳ Long</title>
     <link
+      href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css"
       rel="stylesheet"
-      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
     />
     <link
-      rel="preload"
-      href="components/header/header.html"
-      as="fetch"
-      crossorigin="anonymous"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
+      rel="stylesheet"
     />
-    <link rel="stylesheet" href="components/header/header.css" />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css"
+    />
+    <link href="/components/header/header.css?v=1.1" rel="stylesheet" />
     <link rel="stylesheet" href="components/footer/footer.css" />
     <link rel="stylesheet" href="newsPages/newsArticle2/newsArticle2.css" />
   </head>
@@ -292,7 +294,7 @@
     <!-- Footer Component -->
     <div id="footer"></div>
 
-    <script src="components/header/header.js"></script>
+    <script src="components/header/headerLoader.js"></script>
     <script src="newsPages/newsArticle1/newsArticle1.js"></script>
   </body>
 </html>
diff --git a/views/newsPages/newsMain/newsMain.html b/views/newsPages/newsMain/newsMain.html
index a356325..685ad1f 100644
--- a/views/newsPages/newsMain/newsMain.html
+++ b/views/newsPages/newsMain/newsMain.html
@@ -29,112 +29,7 @@
   </head>
   <body>
     <!-- Header Component -->
-    <div class="top-ribbon">
-      <div class="container-fluid px-4">
-        <div class="ribbon-content">
-          <div class="ribbon-company-info">
-            <img
-              src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
-              alt="Ky Long Logo"
-              class="ribbon-logo"
-            />
-            <span class="ribbon-company-name">KỲ LONG</span>
-            <span>Thắp sáng tương lai, vững bền thành quả</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <!-- Header Section -->
-    <header class="header py-3">
-      <div class="container-fluid px-4">
-        <div class="row align-items-center">
-          <!-- Logo and Company Info -->
-          <div class="col-lg-6 col-md-6 col-12">
-            <div class="d-flex align-items-center">
-              <button class="mobile-menu-btn me-3">
-                <i class="bi bi-list"></i>
-              </button>
-              <img
-                src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
-                alt="Ky Long Logo"
-                class="logo me-3"
-              />
-              <div class="company-info">
-                <div>
-                  <a
-                    href="/"
-                    title="Công ty TNHH Đầu Tư Thương Mại Dịch Vụ Kỳ Long"
-                    class="company-name"
-                  >
-                    CÔNG TY TNHH ĐẦU TƯ THƯƠNG MẠI DỊCH VỤ KỲ LONG
-                  </a>
-                </div>
-                <div class="company-slogan">
-                  Thắp sáng tương lai, vững bền thành quả
-                </div>
-                <div class="company-year">SINCE 2010</div>
-              </div>
-            </div>
-          </div>
-
-          <!-- Contact Info - Horizontal Layout -->
-          <div class="col-lg-6 col-md-6 col-12 contact-section">
-            <div class="row g-3">
-              <!-- Address -->
-              <div class="col-md-6 col-12">
-                <div class="d-flex align-items-center">
-                  <div
-                    class="contact-icon2 d-flex align-items-center justify-content-center me-2"
-                  >
-                    <i class="bi bi-geo-alt-fill"></i>
-                  </div>
-                  <div class="contact-text">
-                    <div>Lầu 12, số 27 Đinh Bộ Lĩnh,</div>
-                    <div>P. Bình Thạnh, TP.Hồ Chí Minh</div>
-                  </div>
-                </div>
-              </div>
-
-              <!-- Email -->
-              <div class="col-md-6 col-12">
-                <div class="d-flex align-items-center">
-                  <div
-                    class="contact-icon d-flex align-items-center justify-content-center me-2"
-                  >
-                    <i class="bi bi-envelope-open-fill"></i>
-                  </div>
-
-                  <div class="contact-text">
-                    <div>Email:</div>
-                    <div class="contact-text">info@kylongtech.com</div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </header>
-
-    <!-- Navigation Section -->
-    <nav class="nav-container">
-      <div class="container-fluid px-4">
-        <div class="navbar-nav d-flex flex-row justify-content-around py-3">
-          <a href="/" class="nav-link" id="home">TRANG CHỦ</a>
-          <span class="separator"></span>
-          <a href="/aboutMain" class="nav-link" id="about">GIỚI THIỆU</a>
-          <span class="separator"></span>
-          <a href="/productMain" class="nav-link" id="products">SẢN PHẨM</a>
-          <span class="separator"></span>
-          <a href="/serviceMain" class="nav-link" id="services">DỊCH VỤ</a>
-          <span class="separator"></span>
-          <a href="/newsMain" class="nav-link" id="news">TIN TỨC</a>
-          <span class="separator"></span>
-          <a href="/contactMain" class="nav-link" id="contact">LIÊN HỆ</a>
-        </div>
-      </div>
-    </nav>
+    <div id="header"></div>
 
     <!-- Floating Menu Button -->
     <button class="floating-menu-btn" id="floatingMenuBtn">
@@ -383,6 +278,6 @@
     <div id="footer"></div>
 
     <script src="newsPages/newsMain/newsMain.js"></script>
-    <script src="/components/header/header.js"></script>
+    <script src="/components/header/headerLoader.js"></script>
   </body>
 </html>
diff --git a/views/productPages/productMain/productMain.html b/views/productPages/productMain/productMain.html
index 44df3b8..f9fde21 100644
--- a/views/productPages/productMain/productMain.html
+++ b/views/productPages/productMain/productMain.html
@@ -23,112 +23,7 @@
   </head>
   <body>
     <!-- Header Component -->
-    <div class="top-ribbon">
-      <div class="container-fluid px-4">
-        <div class="ribbon-content">
-          <div class="ribbon-company-info">
-            <img
-              src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
-              alt="Ky Long Logo"
-              class="ribbon-logo"
-            />
-            <span class="ribbon-company-name">KỲ LONG</span>
-            <span>Thắp sáng tương lai, vững bền thành quả</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <!-- Header Section -->
-    <header class="header py-3">
-      <div class="container-fluid px-4">
-        <div class="row align-items-center">
-          <!-- Logo and Company Info -->
-          <div class="col-lg-6 col-md-6 col-12">
-            <div class="d-flex align-items-center">
-              <button class="mobile-menu-btn me-3">
-                <i class="bi bi-list"></i>
-              </button>
-              <img
-                src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
-                alt="Ky Long Logo"
-                class="logo me-3"
-              />
-              <div class="company-info">
-                <div>
-                  <a
-                    href="/"
-                    title="Công ty TNHH Đầu Tư Thương Mại Dịch Vụ Kỳ Long"
-                    class="company-name"
-                  >
-                    CÔNG TY TNHH ĐẦU TƯ THƯƠNG MẠI DỊCH VỤ KỲ LONG
-                  </a>
-                </div>
-                <div class="company-slogan">
-                  Thắp sáng tương lai, vững bền thành quả
-                </div>
-                <div class="company-year">SINCE 2010</div>
-              </div>
-            </div>
-          </div>
-
-          <!-- Contact Info - Horizontal Layout -->
-          <div class="col-lg-6 col-md-6 col-12 contact-section">
-            <div class="row g-3">
-              <!-- Address -->
-              <div class="col-md-6 col-12">
-                <div class="d-flex align-items-center">
-                  <div
-                    class="contact-icon2 d-flex align-items-center justify-content-center me-2"
-                  >
-                    <i class="bi bi-geo-alt-fill"></i>
-                  </div>
-                  <div class="contact-text">
-                    <div>Lầu 12, số 27 Đinh Bộ Lĩnh,</div>
-                    <div>P. Bình Thạnh, TP.Hồ Chí Minh</div>
-                  </div>
-                </div>
-              </div>
-
-              <!-- Email -->
-              <div class="col-md-6 col-12">
-                <div class="d-flex align-items-center">
-                  <div
-                    class="contact-icon d-flex align-items-center justify-content-center me-2"
-                  >
-                    <i class="bi bi-envelope-open-fill"></i>
-                  </div>
-
-                  <div class="contact-text">
-                    <div>Email:</div>
-                    <div class="contact-text">info@kylongtech.com</div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </header>
-
-    <!-- Navigation Section -->
-    <nav class="nav-container">
-      <div class="container-fluid px-4">
-        <div class="navbar-nav d-flex flex-row justify-content-around py-3">
-          <a href="/" class="nav-link" id="home">TRANG CHỦ</a>
-          <span class="separator"></span>
-          <a href="/aboutMain" class="nav-link" id="about">GIỚI THIỆU</a>
-          <span class="separator"></span>
-          <a href="/productMain" class="nav-link" id="products">SẢN PHẨM</a>
-          <span class="separator"></span>
-          <a href="/serviceMain" class="nav-link" id="services">DỊCH VỤ</a>
-          <span class="separator"></span>
-          <a href="/newsMain" class="nav-link" id="news">TIN TỨC</a>
-          <span class="separator"></span>
-          <a href="/contactMain" class="nav-link" id="contact">LIÊN HỆ</a>
-        </div>
-      </div>
-    </nav>
+    <div id="header"></div>
 
     <!-- Floating Menu Button -->
     <button class="floating-menu-btn" id="floatingMenuBtn">
@@ -483,6 +378,6 @@
     <div id="footer"></div>
 
     <script src="productPages/productMain/productMain.js"></script>
-    <script src="/components/header/header.js"></script>
+    <script src="/components/header/headerLoader.js"></script>
   </body>
 </html>
diff --git a/views/productPages/productSeparateCommerceLNG/productSeparateCommerceLNG.html b/views/productPages/productSeparateCommerceLNG/productSeparateCommerceLNG.html
index 9097199..9a46260 100644
--- a/views/productPages/productSeparateCommerceLNG/productSeparateCommerceLNG.html
+++ b/views/productPages/productSeparateCommerceLNG/productSeparateCommerceLNG.html
@@ -9,16 +9,18 @@
       LONG
     </title>
     <link
+      href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css"
       rel="stylesheet"
-      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
     />
     <link
-      rel="preload"
-      href="components/header/header.html"
-      as="fetch"
-      crossorigin="anonymous"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
+      rel="stylesheet"
     />
-    <link rel="stylesheet" href="components/header/header.css" />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css"
+    />
+    <link href="/components/header/header.css?v=1.1" rel="stylesheet" />
     <link rel="stylesheet" href="components/footer/footer.css" />
     <link rel="stylesheet" href="productPages/productMain/productMain.css" />
     <link
@@ -139,7 +141,7 @@
     <!-- Footer Component -->
     <div id="footer"></div>
 
-    <script src="components/header/header.js"></script>
+    <script src="components/header/headerLoader.js"></script>
     <script src="productPages/productSeparateCommerceLNG/productSeparateCommerceLNG.js"></script>
   </body>
 </html>
diff --git a/views/productPages/productSeparateCommercePNG/productSeparateCommercePNG.html b/views/productPages/productSeparateCommercePNG/productSeparateCommercePNG.html
index 264868b..49b4488 100644
--- a/views/productPages/productSeparateCommercePNG/productSeparateCommercePNG.html
+++ b/views/productPages/productSeparateCommercePNG/productSeparateCommercePNG.html
@@ -8,16 +8,18 @@
       PNG - Khí tự nhiên nén | CÔNG TY TNHH ĐẦU TƯ THƯƠNG MẠI DỊCH VỤ KỲ LONG
     </title>
     <link
+      href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css"
       rel="stylesheet"
-      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
     />
     <link
-      rel="preload"
-      href="components/header/header.html"
-      as="fetch"
-      crossorigin="anonymous"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
+      rel="stylesheet"
     />
-    <link rel="stylesheet" href="components/header/header.css" />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css"
+    />
+    <link href="/components/header/header.css?v=1.1" rel="stylesheet" />
     <link rel="stylesheet" href="components/footer/footer.css" />
     <link rel="stylesheet" href="productPages/productMain/productMain.css" />
     <link
@@ -137,7 +139,7 @@
     <!-- Footer Component -->
     <div id="footer"></div>
 
-    <script src="components/header/header.js"></script>
+    <script src="components/header/headerLoader.js"></script>
     <script src="productPages/productSeparateCommercePNG/productSeparateCommercePNG.js"></script>
   </body>
 </html>
diff --git a/views/productPages/productSeparateProductionGasMeter/productSeparateProductionGasMeter.html b/views/productPages/productSeparateProductionGasMeter/productSeparateProductionGasMeter.html
index fbde548..8dbf4a5 100644
--- a/views/productPages/productSeparateProductionGasMeter/productSeparateProductionGasMeter.html
+++ b/views/productPages/productSeparateProductionGasMeter/productSeparateProductionGasMeter.html
@@ -8,16 +8,18 @@
       Đồng Hồ Đo Khí | CÔNG TY TNHH ĐẦU TƯ THƯƠNG MẠI DỊCH VỤ KỲ LONG
     </title>
     <link
+      href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css"
       rel="stylesheet"
-      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
     />
     <link
-      rel="preload"
-      href="components/header/header.html"
-      as="fetch"
-      crossorigin="anonymous"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
+      rel="stylesheet"
     />
-    <link rel="stylesheet" href="components/header/header.css" />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css"
+    />
+    <link href="/components/header/header.css?v=1.1" rel="stylesheet" />
     <link rel="stylesheet" href="components/footer/footer.css" />
     <link rel="stylesheet" href="productPages/productMain/productMain.css" />
     <link
@@ -134,7 +136,7 @@
     <!-- Footer Component -->
     <div id="footer"></div>
 
-    <script src="components/header/header.js"></script>
+    <script src="components/header/headerLoader.js"></script>
     <script src="productPages/productSeparateProductionGasMeter/productSeparateProductionGasMeter.js"></script>
   </body>
 </html>
diff --git a/views/productPages/productSeparateProductionPRU/productSeparateProductionPRU.html b/views/productPages/productSeparateProductionPRU/productSeparateProductionPRU.html
index d209c07..b306560 100644
--- a/views/productPages/productSeparateProductionPRU/productSeparateProductionPRU.html
+++ b/views/productPages/productSeparateProductionPRU/productSeparateProductionPRU.html
@@ -9,16 +9,18 @@
       LONG
     </title>
     <link
+      href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css"
       rel="stylesheet"
-      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
     />
     <link
-      rel="preload"
-      href="components/header/header.html"
-      as="fetch"
-      crossorigin="anonymous"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
+      rel="stylesheet"
     />
-    <link rel="stylesheet" href="components/header/header.css" />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css"
+    />
+    <link href="/components/header/header.css?v=1.1" rel="stylesheet" />
     <link rel="stylesheet" href="components/footer/footer.css" />
     <link rel="stylesheet" href="productPages/productMain/productMain.css" />
     <link
@@ -137,7 +139,7 @@
     <!-- Footer Component -->
     <div id="footer"></div>
 
-    <script src="components/header/header.js"></script>
+    <script src="components/header/headerLoader.js"></script>
     <script src="productPages/productSeparateProductionPRU/productSeparateProductionPRU.js"></script>
   </body>
 </html>
diff --git a/views/productPages/productSeparateProductionPressureRegulatorValve/productSeparateProductionPressureRegulatorValve.html b/views/productPages/productSeparateProductionPressureRegulatorValve/productSeparateProductionPressureRegulatorValve.html
index 76aeb32..21d3016 100644
--- a/views/productPages/productSeparateProductionPressureRegulatorValve/productSeparateProductionPressureRegulatorValve.html
+++ b/views/productPages/productSeparateProductionPressureRegulatorValve/productSeparateProductionPressureRegulatorValve.html
@@ -6,16 +6,18 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Van Điều Áp | CÔNG TY TNHH ĐẦU TƯ THƯƠNG MẠI DỊCH VỤ KỲ LONG</title>
     <link
+      href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css"
       rel="stylesheet"
-      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
     />
     <link
-      rel="preload"
-      href="components/header/header.html"
-      as="fetch"
-      crossorigin="anonymous"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
+      rel="stylesheet"
     />
-    <link rel="stylesheet" href="components/header/header.css" />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css"
+    />
+    <link href="/components/header/header.css?v=1.1" rel="stylesheet" />
     <link rel="stylesheet" href="components/footer/footer.css" />
     <link rel="stylesheet" href="productPages/productMain/productMain.css" />
     <link
@@ -134,7 +136,7 @@
     <!-- Footer Component -->
     <div id="footer"></div>
 
-    <script src="components/header/header.js"></script>
+    <script src="components/header/headerLoader.js"></script>
     <script src="productPages/productSeparateProductionPressureRegulatorValve/productSeparateProductionPressureRegulatorValve.js"></script>
   </body>
 </html>
diff --git a/views/productPages/productSeparateProductionVaporizer/productSeparateProductionVaporizer.html b/views/productPages/productSeparateProductionVaporizer/productSeparateProductionVaporizer.html
index a1140d1..f6af1fa 100644
--- a/views/productPages/productSeparateProductionVaporizer/productSeparateProductionVaporizer.html
+++ b/views/productPages/productSeparateProductionVaporizer/productSeparateProductionVaporizer.html
@@ -6,16 +6,18 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Dàn Hóa Hơi | CÔNG TY TNHH ĐẦU TƯ THƯƠNG MẠI DỊCH VỤ KỲ LONG</title>
     <link
+      href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css"
       rel="stylesheet"
-      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
     />
     <link
-      rel="preload"
-      href="components/header/header.html"
-      as="fetch"
-      crossorigin="anonymous"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
+      rel="stylesheet"
     />
-    <link rel="stylesheet" href="components/header/header.css" />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css"
+    />
+    <link href="/components/header/header.css?v=1.1" rel="stylesheet" />
     <link rel="stylesheet" href="components/footer/footer.css" />
     <link rel="stylesheet" href="productPages/productMain/productMain.css" />
     <link
@@ -134,7 +136,7 @@
     <!-- Footer Component -->
     <div id="footer"></div>
 
-    <script src="components/header/header.js"></script>
+    <script src="components/header/headerLoader.js"></script>
     <script src="productPages/productSeparateProductionVaporizer/productSeparateProductionVaporizer.js"></script>
   </body>
 </html>
diff --git a/views/servicePages/serviceMain.html b/views/servicePages/serviceMain.html
index 4ed5c98..16f29b1 100644
--- a/views/servicePages/serviceMain.html
+++ b/views/servicePages/serviceMain.html
@@ -24,112 +24,7 @@
 
   <body>
     <!-- Header Component -->
-    <div class="top-ribbon">
-      <div class="container-fluid px-4">
-        <div class="ribbon-content">
-          <div class="ribbon-company-info">
-            <img
-              src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
-              alt="Ky Long Logo"
-              class="ribbon-logo"
-            />
-            <span class="ribbon-company-name">KỲ LONG</span>
-            <span>Thắp sáng tương lai, vững bền thành quả</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <!-- Header Section -->
-    <header class="header py-3">
-      <div class="container-fluid px-4">
-        <div class="row align-items-center">
-          <!-- Logo and Company Info -->
-          <div class="col-lg-6 col-md-6 col-12">
-            <div class="d-flex align-items-center">
-              <button class="mobile-menu-btn me-3">
-                <i class="bi bi-list"></i>
-              </button>
-              <img
-                src="https://ik.imagekit.io/1e8470bv5/companyLogo.webp?updatedAt=1754143468028"
-                alt="Ky Long Logo"
-                class="logo me-3"
-              />
-              <div class="company-info">
-                <div>
-                  <a
-                    href="/"
-                    title="Công ty TNHH Đầu Tư Thương Mại Dịch Vụ Kỳ Long"
-                    class="company-name"
-                  >
-                    CÔNG TY TNHH ĐẦU TƯ THƯƠNG MẠI DỊCH VỤ KỲ LONG
-                  </a>
-                </div>
-                <div class="company-slogan">
-                  Thắp sáng tương lai, vững bền thành quả
-                </div>
-                <div class="company-year">SINCE 2010</div>
-              </div>
-            </div>
-          </div>
-
-          <!-- Contact Info - Horizontal Layout -->
-          <div class="col-lg-6 col-md-6 col-12 contact-section">
-            <div class="row g-3">
-              <!-- Address -->
-              <div class="col-md-6 col-12">
-                <div class="d-flex align-items-center">
-                  <div
-                    class="contact-icon2 d-flex align-items-center justify-content-center me-2"
-                  >
-                    <i class="bi bi-geo-alt-fill"></i>
-                  </div>
-                  <div class="contact-text">
-                    <div>Lầu 12, số 27 Đinh Bộ Lĩnh,</div>
-                    <div>P. Bình Thạnh, TP.Hồ Chí Minh</div>
-                  </div>
-                </div>
-              </div>
-
-              <!-- Email -->
-              <div class="col-md-6 col-12">
-                <div class="d-flex align-items-center">
-                  <div
-                    class="contact-icon d-flex align-items-center justify-content-center me-2"
-                  >
-                    <i class="bi bi-envelope-open-fill"></i>
-                  </div>
-
-                  <div class="contact-text">
-                    <div>Email:</div>
-                    <div class="contact-text">info@kylongtech.com</div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </header>
-
-    <!-- Navigation Section -->
-    <nav class="nav-container">
-      <div class="container-fluid px-4">
-        <div class="navbar-nav d-flex flex-row justify-content-around py-3">
-          <a href="/" class="nav-link" id="home">TRANG CHỦ</a>
-          <span class="separator"></span>
-          <a href="/aboutMain" class="nav-link" id="about">GIỚI THIỆU</a>
-          <span class="separator"></span>
-          <a href="/productMain" class="nav-link" id="products">SẢN PHẨM</a>
-          <span class="separator"></span>
-          <a href="/serviceMain" class="nav-link" id="services">DỊCH VỤ</a>
-          <span class="separator"></span>
-          <a href="/newsMain" class="nav-link" id="news">TIN TỨC</a>
-          <span class="separator"></span>
-          <a href="/contactMain" class="nav-link" id="contact">LIÊN HỆ</a>
-        </div>
-      </div>
-    </nav>
+    <div id="header"></div>
 
     <!-- Floating Menu Button -->
     <button class="floating-menu-btn" id="floatingMenuBtn">
@@ -425,6 +320,6 @@
     <div id="footer"></div>
 
     <script src="servicePages/serviceMain.js?v=1.0"></script>
-    <script src="/components/header/header.js"></script>
+    <script src="/components/header/headerLoader.js"></script>
   </body>
 </html>
