Skip to content

Instantly share code, notes, and snippets.

Avatar

Ilias Haddad IliasHad

View GitHub Profile
View gist:43a3ab86eb6755bae03a89c3042d7397
<div >
<button onclick="openTabs('Description')">Description</button>
<button onclick="openTabs('Reviews')">Reviews</button>
<button onclick="openTabs('Shipping')">Shipping Policy</button>
</div>
<div style="margin:10px 0;" id="Description" class="tab">
<h2>Description</h2>
{{ product.description }}
</div>
View page.about-us.liquid
<div class="page-width">
<div class="grid">
<div class="grid__item medium-up--five-sixths medium-up--push-one-twelfth">
<div class="section-header text-center">
<h1>{{ page.title }}</h1>
</div>
<div class="rte">
{% capture view %}{%- render 'querystring', param: "refer" -%}{% endcapture %}
View querystring.liquid
{%- capture contentForQuerystring -%}{{ content_for_header }}{%- endcapture -%}
{%- assign pageUrl = contentForQuerystring | split:'"pageurl":"' | last | split:'"' | first | split:'.myshopify.com' | last |
replace:'\/','/' |
replace:'%20',' ' |
replace:'\u0026','&'
-%}
{%- assign itemShow = '' -%}
{%- for i in (1..1) -%}
{%- unless pageUrl contains "?" -%}{% break %}{%- endunless -%}
{%- assign pageQuerystring = pageUrl | split:'?' | last -%}
View page.private-deals.liquid
{% capture code %}{%- render 'querystring', param: "code" -%}{% endcapture %}
{% if code == "iliashaddad"%}
<div class="page-width">
<div class="grid">
<div class="grid__item medium-up--five-sixths medium-up--push-one-twelfth">
<div class="section-header text-center">
View index.js
import React, { useState, useEffect } from "react"
import { Link } from "gatsby"
import Layout from "../components/layout"
import SEO from "../components/seo"
import Img from "gatsby-image"
const IndexPage = ({ data }) => {
const [posts, setPosts] = useState([])
useEffect(() => {
setPosts(data.allGoogleSheetSheet1Row.nodes)
}, [])
View gatsby-node.js
const { createRemoteFileNode } = require("gatsby-source-filesystem")
exports.onCreateNode = async ({
node,
actions,
store,
cache,
createNodeId,
}) => {
const { createNode } = actions
if (node.internal.type === "googleSheetSheet1Row") {
View gatsby-config.js
{
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')
}
}
@IliasHad
IliasHad / product.js
Created Apr 21, 2020
How to Gatsby Image in Strapi Multiple Image
View product.js
query {
strapiProducts(slug: { eq: ""}) {
title
description
images {
localFile {
childImageSharp {
fixed(height: 100, width: 100, quality: 100) {
...GatsbyImageSharpFixed
@IliasHad
IliasHad / gatsby-node.js
Last active Oct 5, 2020
How to Gatsby Image in Strapi Multiple Image
View gatsby-node.js
exports.onCreateNode = async ({
node,
actions,
store,
cache,
createNodeId,
}) => {
const { createNode } = actions
let multipleImages = node.images
View bg-image.liquid
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>