diff --git a/mkdocs_glightbox/plugin.py b/mkdocs_glightbox/plugin.py
index e8f5633..f1dda40 100644
--- a/mkdocs_glightbox/plugin.py
+++ b/mkdocs_glightbox/plugin.py
@@ -53,6 +53,14 @@ def on_post_page(self, output, page, config, **kwargs):
             return output
 
         tree = LexborHTMLParser(output)
+
+        # 1. Wrap img element
+        skip_classes = ["emojione", "twemoji", "gemoji", "off-glb"] + self.config[
+            "skip_classes"
+        ]
+        self.wrap_img_with_anchor_selectolax(tree, plugin_config=self.config, meta=page.meta, skip_classes=skip_classes)
+
+        # 2. Import GLightbox css and js sources
         head_node = tree.css_first("head")
         body_node = tree.css_first("body")
 
@@ -69,6 +77,7 @@ def on_post_page(self, output, page, config, **kwargs):
         head_node.insert_child(glightbox_css_node)
         head_node.insert_child(glightbox_js_node)
 
+        # 3. Add custom css style for GLightbox
         css_text = (
             """
             html.glightbox-open { overflow: initial; height: 100%; }
@@ -94,6 +103,7 @@ def on_post_page(self, output, page, config, **kwargs):
         patch_css_node.insert_child(css_text + "\n        ")
         head_node.insert_child(patch_css_node)
 
+        # 4. Initialize GLightbox
         plugin_config = dict(self.config)
         lb = {
             k: plugin_config[k]
@@ -107,10 +117,15 @@ def on_post_page(self, output, page, config, **kwargs):
             js_code += """document.querySelectorAll('.glightbox').forEach(function(element) {
     try {
         var img = element.querySelector('img');
-        if (img && img.src) {
-            element.setAttribute('href', img.src);
+        if (img) {
+            const imageSrc = img.dataset.src || img.src;
+            if (imageSrc) {
+                element.setAttribute('href', imageSrc);
+            } else {
+                console.log('No img element with src or data-src attribute found');
+            }
         } else {
-            console.log('No img element with src attribute found');
+            console.log('No img element found');
         }
     } catch (error) {
         console.log('Error:', error);
@@ -130,24 +145,7 @@ def on_post_page(self, output, page, config, **kwargs):
 
         return tree.html
 
-    def on_page_content(self, html, page, config, **kwargs):
-        """Wrap img tag with anchor tag with glightbox class and attributes from config"""
-        # skip page with meta glightbox is false
-        if "glightbox" in page.meta and page.meta.get("glightbox", True) is False:
-            return html
-
-        skip_classes = ["emojione", "twemoji", "gemoji", "off-glb"] + self.config[
-            "skip_classes"
-        ]
-        return self.wrap_img_with_anchor_selectolax(
-            html, plugin_config=self.config, meta=page.meta, skip_classes=skip_classes
-        )
-
-    def wrap_img_with_anchor_selectolax(
-        self, html: str, plugin_config, meta, skip_classes
-    ):
-        tree = LexborHTMLParser(html)
-
+    def wrap_img_with_anchor_selectolax(self, tree, plugin_config, meta, skip_classes):
         for img in tree.css("img"):
             if self._should_skip_img(img, skip_classes, plugin_config, meta):
                 continue
@@ -162,8 +160,6 @@ def wrap_img_with_anchor_selectolax(
             a_node.insert_child(img_clone)
             img.replace_with(a_node)
 
-        return tree.html
-
     def _should_skip_img(self, img, skip_classes, plugin_config, meta):
         """Skip by class, page meta, or plugin config"""
         if img.parent and img.parent.tag == "a":
@@ -188,7 +184,7 @@ def _build_anchor_attrs(self, img, plugin_config, meta):
         }
 
         if not self.using_material_privacy:
-            attrs["href"] = img.attributes.get("src", "")
+            attrs["href"] = img.attributes.get("data-src") or img.attributes.get("src", "")
 
         auto_caption = self.config.get("auto_caption") or meta.get(
             "glightbox.auto_caption", False
@@ -228,15 +224,14 @@ def _get_caption_position_value(self, img, auto_caption):
         )
 
     def _get_gallery_value(self, img, auto_caption):
+        src = img.attributes.get("data-src") or img.attributes.get("src", "")
+        
         if self.config["auto_themed"]:
-            if "#only-light" in img.attributes.get(
-                "src", ""
-            ) or "#gh-light-mode-only" in img.attributes.get("src", ""):
+            if "#only-light" in src or "#gh-light-mode-only" in src:
                 return "light"
-            elif "#only-dark" in img.attributes.get(
-                "src", ""
-            ) or "#gh-dark-mode-only" in img.attributes.get("src", ""):
+            elif "#only-dark" in src or "#gh-dark-mode-only" in src:
                 return "dark"
+        
         return img.attributes.get("data-gallery", "")
 
     def on_post_build(self, config, **kwargs):