Use "class=lozad" also for almost all images including webp

layouts/_default/article.html

       <a class="btn btn-transparent" href="{{ .Permalink }}">{{ i18n "readMore" }}</a>
     </div>
   </div>
-</article>
+</article>

layouts/_default/single.html

           <li class="list-inline-item"><a href="{{ `author/` | relLangURL }}{{ .Params.Author | urlize }}/">{{ .Params.Author }}</a></li>
           <li class="list-inline-item">{{ dateFormat "Monday, Jan 2, 2006" .Date }}</li>
         </ul>
-        <img class="img-fluid mb-50" src="{{ .Params.Image | absURL }}" alt="blog-image">
+        <img class="img-fluid mb-50 lozad" data-src="{{ .Params.Image | absURL }}" alt="blog-image">
       </div>
       <div class="col-lg-8 offset-lg-2">
         <div class="post-single-content">

layouts/author/single.html

 				<div class="content text-center">
 					<figure>
 						{{ if .Params.Image }}
-						<img class="rounded-circle img-fluid" src="{{.Params.Image | relURL }}">
+						<img class="rounded-circle img-fluid lozad" data-src="{{.Params.Image | relURL }}">
 						{{else if .Params.Email}}
-						<img class="rounded-circle img-fluid"
-							src="https://www.gravatar.com/avatar/{{ md5 .Params.email }}?s=128&pg&d=identicon">
+						<img class="rounded-circle img-fluid lozad"
+							data-src="https://www.gravatar.com/avatar/{{ md5 .Params.email }}?s=128&pg&d=identicon">
 						{{ end }}
 						<figcaption>
 							<h5 class="font-weight-bold">
 		</div>
 	</div>
 </section>
-{{ end }}
+{{ end }}

layouts/partials/banner.html

 {{"<!-- Welcome Slider-->" | safeHTML}}
 <section class="hero-area" style='background-image: url("{{ .bg_image_webp | absURL }}")'>
 	<!-- this image is for trigger this section fallback background image -->
-	<img style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" src="{{ .bg_image_webp | absURL }}" />
+	<img class="lozad" style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" data-src="{{ .bg_image_webp | absURL }}" />
 
 	<div class="block">
 		{{ if .icon }}
 </section>
 {{"<!-- /Welcome Slider-->" | safeHTML}}
 {{end}}
-{{end}}
+{{end}}

layouts/partials/cta.html

 {{"<!-- Start Call To Action -->" | safeHTML}}
 <section id="cta" class="call-to-action section-sm bg-1 overly" style='background-image: url("{{ .bg_image_webp | absURL }}")'>
 	<!-- this image is for trigger this section fallback background image -->
-	<img style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" src="{{ .bg_image_webp | absURL }}" />
+	<img class="lozad" style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" data-src="{{ .bg_image_webp | absURL }}" />
 	<div class="container">
 		<div class="row">
 			<div class="col-lg-12 text-center">

layouts/partials/feature.html

 	<div class="container-fluid">
 		<div class="row">
 			<div class="col-lg-6 padding-0" style="background-image: url('{{ .image_webp | absURL }}'); background-size: cover; background-position: top center; background-repeat: no-repeat; min-height: 400px;">
-			<!-- this image is for trigger this section fallback background image -->
-			<img style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .image | absURL }})'" src="{{ .image_webp | absURL }}" />
+				<!-- this image is for trigger this section fallback background image -->
+				<img style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .image | absURL }})'" data-src="{{ .image_webp | absURL }}" />
 			</div>
 			<div class="col-lg-6">
 				<div class="content-block">
 </section>
 {{"<!-- /feature -->" | safeHTML}}
 {{ end }}
-{{ end }}
+{{ end }}

layouts/partials/funfacts.html

 {{"<!-- Start Counter Section -->" | safeHTML}}
 <section id="counter" class="parallax-section bg-1 section overly" style='background-image: url("{{ .bg_image_webp | absURL }}")'>
 	<!-- this image is for trigger this section fallback background image -->
-	<img style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" src="{{ .bg_image_webp | absURL }}" />
+	<img class="lozad" style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" data-src="{{ .bg_image_webp | absURL }}" />
 	<div class="container">
 		<div class="row justify-content-center">
 			{{ range .counter_item }}
 </section>
 {{"<!-- /Counter Section -->" | safeHTML}}
 {{ end }}
-{{ end }}
+{{ end }}

layouts/partials/navigation.html

 		<nav class="navbar navbar-expand-lg navbar-dark">
 			<a class="navbar-brand p-0" href="{{ .Site.BaseURL | relLangURL }}">
 				{{ if .Site.Params.logo }}
-				<img class="img-fluid" src="{{ .Site.Params.logo | absURL }}" alt="{{ .Site.Title }}">
+				<img class="lozad" class="img-fluid" data-src="{{ .Site.Params.logo | absURL }}" alt="{{ .Site.Title }}">
 				{{ else }}
 				{{ .Site.Title }}
 				{{ end }}
 					</li>
 					{{ end }}
 					{{ end }}
-					
+
 
 					{{ range .Site.Menus.static }}
 					<li class="nav-item"><a class="nav-link" target="_blank" href="{{ .URL }}">{{ i18n .Name }}</a>
 					</li>
 					{{ end }}
-					
+
 				</ul>
 				<!-- Language List -->
 				{{- if .Site.IsMultiLingual }}

layouts/partials/portfolio.html

 			<div class="col-lg-4 shuffle-item"
 				data-groups="[{{range $index, $element:= .categories }}{{if ne $index 0}},{{end}}&quot;{{. | urlize}}&quot;{{ end }}]">
 				<div class="portfolio-block mb-4">
-					<img class="img-fluid" src="{{ .image_webp | absURL }}" onerror="this.onerror=null;this.src='{{ .image | absURL }}'" alt="{{ .name }}">
+					<img class="img-fluid lozad" data-src="{{ .image_webp | absURL }}" onerror="this.onerror=null;this.src='{{ .image | absURL }}'" alt="{{ .name }}">
 					<div class="caption">
 						<a class="search-icon image-popup" data-effect="mfp-with-zoom" href="{{ .image | relURL }}"
 							data-lightbox="image-1">
 </section>
 {{"<!-- /Portfolio -->" | safeHTML}}
 {{ end }}
-{{ end }}
+{{ end }}

layouts/partials/skill.html

 				<h2>{{ .subtitle | markdownify }}</h2>
 				<p> {{ .content | markdownify }}</p>
 				{{ with .image }}
-				<img class="img-fluid" src="{{ . | absURL }}" alt="image">
+				<img class="img-fluid lozad" data-src="{{ . | absURL }}" alt="image">
 				{{ end }}
 			</div>
 			<div class="col-lg-6">
 </section>
 {{"<!-- /skill -->" | safeHTML }}
 {{ end }}
-{{ end }}
+{{ end }}

layouts/partials/testimonial.html

 <section id="testimonial" class="testimonial overly section bg-2"
 	style='background-image: url("{{ .bg_image_webp | absURL }}")'>
 	<!-- this image is for trigger this section fallback background image -->
-	<img style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" src="{{ .bg_image_webp | absURL }}" />
+	<img class="lozad" style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" data-src="{{ .bg_image_webp | absURL }}" />
 	<div class="container">
 		<div class="row">
 			<div class="col-xl-12">
 </section>
 {{"<!-- /testimonial -->" | safeHTML}}
 {{ end }}
-{{ end }}
+{{ end }}