admin option for img lazy loading close #421

lazy loading is the default setting
vincent-peugnet · Sep 26, 2024 · 4a99b30 · 4a99b30
1 parent 941f18d
commit 4a99b30
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 1 deletion.
diff --git a/app/class/Config.php b/app/class/Config.php
@@ -54,6 +54,9 @@ abstract class Config
     /** Page version during creation */
     protected static int $pageversion = Page::V1;
 
+    /** Indicate if img should have loading="lazy" attribute */
+    protected static bool $lazyloadimg = true;
+
     public const LANG_MIN = 2;
     public const LANG_MAX = 16;
 
@@ -345,6 +348,11 @@ public static function pageversion(): int
         return self::$pageversion;
     }
 
+    public static function lazyloadimg(): bool
+    {
+        return self::$lazyloadimg;
+    }
+
 
     // __________________________________________ S E T ______________________________________
 
@@ -590,4 +598,9 @@ public static function setpageversion($pageversion): void
             self::$pageversion = $pageversion;
         }
     }
+
+    public static function setlazyloadimg($lazyloadimg): bool
+    {
+        return self::$lazyloadimg = boolval($lazyloadimg);
+    }
 }
diff --git a/app/class/Servicerender.php b/app/class/Servicerender.php
@@ -462,7 +462,7 @@ protected function sourceparser(DOMNodeList $sourcables): void
             if (!empty($classes)) {
                 $sourcable->setAttribute('class', implode(' ', array_unique($classes)));
             }
-            if ($sourcable->tagName === 'img') {
+            if ($sourcable->tagName === 'img' && Config::lazyloadimg()) {
                 $sourcable->setAttribute('loading', 'lazy');
             }
         }

diff --git a/app/view/templates/admin.php b/app/view/templates/admin.php
@@ -258,6 +258,13 @@
 
                 <p>This can be overide individualy for each element using render options. See <a href="<?= $this->url('info', [], '#html-tags') ?>">📖 manual section</a> for more infos.</p>
 
+                <h4>Lazy load images</h4>
+
+                <div class="checkbox">
+                    <input type="hidden" name="lazyloadimg" value="0" form="admin">
+                    <input type="checkbox" name="lazyloadimg" id="lazyloadimg" value="1" <?= Wcms\Config::lazyloadimg() ? 'checked' : '' ?> form="admin">
+                    <label for="lazyloadimg">Add <em>loading="lazy"</em> attribute to images</label>
+                </div>
 
                 <p>
                     <i>(Thoses modifications need re-rendering)</i>