Skip to content

Instantly share code, notes, and snippets.

View marioloncarek's full-sized avatar

Mario Loncarek marioloncarek

View GitHub Profile
@tpage99
tpage99 / cart_api.js
Last active August 8, 2023 07:13
Cart API Frequently Used - Vanilla JS
// Always compare to the docs first: https://shopify.dev/docs/api/ajax/reference/cart
// Get the Cart
fetch("/cart.js")
.then((response) => response.json())
.then((data) => console.log(data));
// Add to Cart
let addToCartItem = {
items: [
{%- comment -%}
###############################################################################
Display Videos From Youtube Channel in Your Shopify Store
''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
###############################################################################
# Paypal Me: https://paypal.me/elghorfimed #
# Buy Me A Coffee: #
# https://www.buymeacoffee.com/elghorfi #
###############################################################################
Elghorfi.med@gmail.com
const wishlistApi = async ({req, res, shopifyAccessToken, shopifyDomain, allowedOrigins, metafieldNamespace, metafieldKey}) => {
const shopifyAdminConfig = {
Accept: 'application/json',
'Content-Type': 'application/json',
'X-Shopify-Access-Token': shopifyAccessToken,
};
const apiVersion = '2022-07'
const preparePayload = (query, variables) => ({
query,
@pveen2
pveen2 / component.image.liquid
Created September 16, 2022 06:14
Shopify image component
{%- comment -%}
Expected behaviour:
Renders picture element
About:
Render a responsive image
Accepts:
- img: {Object} image
{%comment%}
##################################################
# How To add Coupon Code — Discount Field #
# On Shopify Cart Before Checkout #
# Without Apps #
#################################################
# Paypal Me: https://paypal.me/elghorfimed #
# Buy Me A Coffee: #
# https://www.buymeacoffee.com/elghorfi #
############################################# #
@shafiimam
shafiimam / index.liquid
Last active August 27, 2023 05:04
Shopify selling plan product add to cart
<div class="productGrid__formItem">
{%- liquid
assign current_variant = product.selected_or_first_available_variant | default: product.variants.first
assign current_selling_plan_allocation = current_variant.selected_selling_plan_allocation
if current_selling_plan_allocation == nil and current_variant.requires_selling_plan
assign current_selling_plan_allocation = current_variant.selling_plan_allocations | first
endif
assign offer = current_selling_plan_allocation | default: current_variant
@liamgriffin
liamgriffin / selling-plan.liquid
Created December 16, 2021 12:16
How to Test your Theme Before Submitting to the Shopify Theme Store | Selling Plan
{% if product.selling_plan_groups.size > 0 %}
<div>
<label for="plans">Purchase options:</label>
<select name="selling_plan" id="plans">
<option value="">One time purchase</option>
{% for variant in product.variants %}
<optgroup label="{{ variant.title }}">
{% for allocation in variant.selling_plan_allocations %}
<option value="{{ allocation.selling_plan.id }}">
{{ allocation.selling_plan.name }}
@procarrera
procarrera / Form with File Upload Shopify.liquid
Created October 19, 2021 19:52
Form with file Upload Shopify
<form method="post" action="/cart/add" id="product_form_6149192941727" accept-charset="UTF-8" class="shopify-product-form" enctype="multipart/form-data"><input type="hidden" name="form_type" value="product"><input type="hidden" name="utf8" value="✓">
<label for="upload">Upload Your Logo</label>
<input id="upload" type="file" name="properties[_upload]" class="product-form__input">
</form>
@salexzee
salexzee / predictive-search.scss
Created June 6, 2021 23:09
SCSS from my predictive search YouTube tutorial video.
.top-bar__search {
position: relative;
}
.predictive-search {
background-color: #ffffff;
border: 1px solid #ababab;
border-radius: 2px;
left: 0;
opacity: 0;
@salexzee
salexzee / predictive-search.js
Created June 6, 2021 23:05
JavaScript from my predictive search YouTube tutorial video.
import PredictiveSearch from "@shopify/theme-predictive-search";
const elements = {};
const clearParent = (parent) => {
while (parent.firstChild) {
parent.removeChild(parent.lastChild);
}
};