IliasHad

/*! lazysizes - v4.1.7 */
!function(a,b){var c=b(a,a.document);a.lazySizes=c,"object"==typeof module&&module.exports&&(module.exports=c)}(window,function(a,b){"use strict";if(b.getElementsByClassName){var c,d,e=b.documentElement,f=a.Date,g=a.HTMLPictureElement,h="addEventListener",i="getAttribute",j=a[h],k=a.setTimeout,l=a.requestAnimationFrame||k,m=a.requestIdleCallback,n=/^picture$/i,o=["load","error","lazyincluded","_lazyloaded"],p={},q=Array.prototype.forEach,r=function(a,b){return p[b]||(p[b]=new RegExp("(\\s|^)"+b+"(\\s|$)")),p[b].test(a[i]("class")||"")&&p[b]},s=function(a,b){r(a,b)||a.setAttribute("class",(a[i]("class")||"").trim()+" "+b)},t=function(a,b){var c;(c=r(a,b))&&a.setAttribute("class",(a[i]("class")||"").replace(c," "))},u=function(a,b,c){var d=c?h:"removeEventListener";c&&u(a,b),o.forEach(function(c){a[d](c,b)})},v=function(a,d,e,f,g){var h=b.createEvent("Event");return e||(e={}),e.instance=c,h.initEvent(d,!f,!g),h.detail=e,a.dispatchEvent(h),h},w=function(b,c){var e;!g&&(e=a.picturefill|

IliasHad

<style>
@font-face {
  font-family: 'Montserrat'; Replace Montserrat with your web  font name 
  font-style: normal;
  font-weight: 400; Replace it with your font weight and you'll find it google web font helper
  font-display: swap; Don't Change it
  src: local('Montserrat'), local('Montserrat-Regular'), Replace Montserrat with your web  font name 
       url(https://cdn.shopify.com/s/files/1/0077/8295/7119/files/montserrat-v12-latin-regular.woff2) format('woff2'), Replace Link with web font file url specific for this font weight and with woff2 file type ( admin > settings > files )
       url(https://cdn.shopify.com/s/files/1/0077/8295/7119/files/montserrat-v12-latin-regular.woff) format('woff'); Replace Link with web font file url specific for this font weight and with woff file type ( admin > settings > files )
}

IliasHad

<! - [if (gt IE 9)|!(IE)]><! →<script src="{{ 'app.js' | asset_url }}" defer="defer" async></script><! - <![endif] →
 <! - [if lte IE 9]><script src="{{ 'app.js' | asset_url }}"></script><![endif] →

IliasHad

{% include 'responsive-image'
with image: featured_image,
image_class: "css-class",
wrapper_class: "wrapper-css-class",
max_width: 700,
max_height: 800 %}

IliasHad

<div class="lazyload" data-bgset="{% include 'bgset', image: article.image %}"></div>

IliasHad

Accepts:
    - max_width: {Number} Max width of the image container
    - max_height: {Number} Max height of the image container
    - image: {Object} Image object
    - image_class: {String} class name of the <img />
    - image_attributes: {String}  additional HTML attributes of the <img />
    - wrapper_class: {String} class name of the <div> wrapper
    - wrapper_attributes: {String} additional HTML attributes of the <div> wrapper

    Usage:

IliasHad

    Accepts:
    - image: {Object} Image object

    Usage:
    In your liquid template file, copy the following line

    <div class="lazyload" data-bgset="{% include 'responsive-bg-image', image: article.image %}"></div>

IliasHad

exports.onCreateNode = async ({
  node,
  actions,
  store,
  cache,
  createNodeId,
}) => {
  const { createNode } = actions
  
let multipleImages = node.images

IliasHad

 query {
    strapiProducts(slug: { eq: ""}) {
      title
      description
   
     images {
        localFile {
        childImageSharp {
          fixed(height: 100, width: 100, quality: 100) {
            ...GatsbyImageSharpFixed

IliasHad

{  
resolve: 'gatsby-source-google-sheets',     
options: {         
spreadsheetId: 'get this from the sheet url',         worksheetTitle: 'ie the name in the worksheet tab',         credentials: require('./secret.json')   
  
} 
}