Shopify Scripts migreren naar Functions vóór 30 juni 2026

Het is 16 april 2026. Gisteren, op 15 april, heeft Shopify de Script Editor definitief vergrendeld. Je kunt geen nieuwe Scripts meer maken of publiceren. Die deadline raakt vooral de logica voor wijzigingen na aankoop: een wijziging van het verzendadres is de meest voorkomende aanpassing na aankoop en vertegenwoordigt 30,2% van alle bewerkte bestellingen (Revize, 2026). Elk Script dat zulke wijzigingen nog verwerkt, staat nu vast. Over 75 dagen, op 30 juni 2026, stoppen Scripts met werken.

Ben je een Shopify Plus-ontwikkelaar, of werk je bij een bureau dat een Plus-winkel beheert, en heb je deze migratie de afgelopen twaalf maanden steeds naar de ‘volgende sprint’ geschoven? Dan heb je een probleem. Geen probleem dat je kunt oppakken wanneer het uitkomt: je checkout kan op 1 juli om middernacht stukgaan. De meeste Plus-winkels hebben door de jaren heen 5 tot 20 Scripts verzameld. Elk daarvan regelt ongemerkt een kortingsregel, verbergt een verzendoptie of beperkt een betaalmethode. Vaak weet niemand meer wie het heeft geschreven.

Dit is de technische migratiehandleiding die we in januari graag hadden gehad. Je vindt hier de code zelf, naast de aanpak. Na het lezen weet je hoe je met Shopify CLI een Function opzet, logica in Rust of JavaScript schrijft voor kortingen en aanpassingen aan verzend- en betaalopties, veilig test met een geselecteerde groep klanten met een tag en de Function in productie neemt zonder je bestaande checkout te verstoren.

Laten we de Scripts uit je winkel halen en vervangen door Functions.

Kort antwoord: van Scripts naar Functions in 60 seconden#

De migratie in één alinea: Shopify Scripts (Ruby-code in de Script Editor, alleen voor Plus) worden vervangen door Shopify Functions (WebAssembly-modules geschreven in Rust of JavaScript, beschikbaar voor alle abonnementen). Je zet een Function op met shopify app generate extension, schrijft een run.graphql-query die de benodigde winkelwagengegevens ophaalt en schrijft een run.rs- of run.js-bestand dat bewerkingen teruggeeft, zoals kortingen of verborgen verzendmethoden. Daarna implementeer je de Function met shopify app deploy en activeer je die via Shopify Admin of een GraphQL-mutatie. Functions draaien als gecompileerde WASM met een verwerkingstijd van minder dan 5 ms, werken op elk abonnement en zijn voortaan de enige manier waarop Shopify aanpassingen aan de checkout ondersteunt.

Wat er op 30 juni precies verandert#

Zorg dat je de datums helder hebt voordat je code aanpast. Er zijn er twee, en beide zijn belangrijk.

Bij deze migratie is er geen tussenweg. Staat je Function uiterlijk 30 juni live, dan blijft je checkout werken. Zo niet, dan vallen alle getroffen winkelwagens ongemerkt terug op standaardprijzen, standaardverzendtarieven en alle ingeschakelde betaalmethoden. Een Script werkt of het werkt niet. Na 30 juni werkt het niet meer.

Tip: Open Settings → Checkout → Customizations Report in Shopify Admin. Daar zie je alle actieve Scripts in je winkel, wat ze doen en welk type Function als vervanging wordt aanbevolen. Begin daar.

Functions versus Scripts: wat is er veranderd?#

De verandering in opzet is groot. Bij Scripts paste je Ruby aan in een tekstveld. Met Functions schrijf je een app, beheer je versies, test je lokaal en implementeer je via een CI-pijplijn. Dat vraagt meer werk om mee te beginnen. Voor je checkoutlogica is dit naar verwachting ook de laatste migratie voor de nabije toekomst: Shopify zet op lange termijn in op Functions.

Je Scripts koppelen aan het juiste type Function#

Elk Script dat je nu hebt, hoort bij één Function API. Houd deze tabel bij de hand.

Heb je tien Scripts, dan bouw je waarschijnlijk drie tot vijf Functions. Meerdere Scripts kun je vaak samenbrengen in één Function met overzichtelijkere voorwaarden.

Voorbereiding: richt je lokale ontwikkelomgeving in#

Voordat je een Function opzet, heb je lokaal drie dingen nodig. Voer deze controles uit in je terminal.

1. Node.js 18+

node --version
# Must be >= 18.0.0

Gebruik je een oudere versie? Installeer Node.js dan via nvm of download het van nodejs.org.

2. Shopify CLI 3+

npm install -g @shopify/cli@latest
shopify version
# Should output 3.x or higher

3. Rust-toolchain (alleen als je Functions in Rust schrijft)

curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
rustup target add wasm32-wasip1
cargo --version

Voor JavaScript Functions heb je Rust niet nodig. Kies één taal voor je team en houd het daarbij. Beide talen gebruiken zorgt voor meer onderhoudswerk.

4. Een ontwikkelwinkel

Log in op je Partner-dashboard en maak een nieuwe ontwikkelwinkel aan, of gebruik een bestaande. Je implementeert Functions eerst in deze winkel voordat je ze in productie neemt.

Je eerste Function opzetten#

De CLI maakt het grootste deel van de basisbestanden voor je aan. Voer in een willekeurige map het volgende uit:

# Create a new Shopify app (skip if you already have one)
shopify app init my-checkout-functions
cd my-checkout-functions

# Generate a Function extension
shopify app generate extension

De CLI leidt je door een aantal keuzes. Voor een kortingsfunctie kies je:

• Type: Function
• Template: discount (of bijvoorbeeld cart_checkout_validation, delivery_customization of payment_customization)
• Language: Rust of JavaScript
• Name: bijvoorbeeld volume-discount-fn

Hiermee wordt extensions/volume-discount-fn/ aangemaakt:

extensions/volume-discount-fn/
├── shopify.extension.toml      # Function config — targets, build, version
├── src/
│   ├── cart_lines_discounts_generate_run.graphql   # Input query
│   └── cart_lines_discounts_generate_run.rs        # Function logic
├── Cargo.toml                  # Rust dependencies (Rust only)
└── README.md

De drie bestanden die je het vaakst bewerkt, zijn .toml voor de configuratie, .graphql voor de invoer en .rs / .js voor de logica.

Handleiding 1: een Line Item Script vervangen (volumekorting)#

Stel dat je oude Script 10% korting op het subtotaal van de bestelling gaf zodra de winkelwagen 5+ stuks uit een specifieke collectie bevatte. Dit is het equivalent met een Function.

Stap 1.1: de configuratie (shopify.extension.toml)#

api_version = "2026-01"

[[extensions]]
name = "volume-discount-fn"
handle = "volume-discount-fn"
type = "function"

[[extensions.targeting]]
target = "cart.lines.discounts.generate.run"
input_query = "src/cart_lines_discounts_generate_run.graphql"
export = "cart_lines_discounts_generate_run"

[extensions.build]
command = "cargo build --target=wasm32-wasip1 --release"
path = "target/wasm32-wasip1/release/volume-discount-fn.wasm"
watch = ["src/**/*.rs"]

Stap 1.2: de invoerquery (src/cart_lines_discounts_generate_run.graphql)#

query Input {
  cart {
    lines {
      id
      quantity
      cost {
        subtotalAmount {
          amount
        }
      }
      merchandise {
        ... on ProductVariant {
          product {
            inAnyCollection(ids: ["gid://shopify/Collection/123456789"])
          }
        }
      }
    }
  }
  discount {
    discountClasses
  }
}

Tip: Functions zien alleen de gegevens die je opvraagt. Houd je GraphQL-query zo klein mogelijk: elk veld dat je weglaat, maakt de uitvoering sneller en goedkoper.

Stap 1.3: de logica (src/cart_lines_discounts_generate_run.rs)#

use super::schema;
use shopify_function::prelude::*;
use shopify_function::Result;

#[shopify_function]
fn cart_lines_discounts_generate_run(
    input: schema::cart_lines_discounts_generate_run::Input,
) -> Result<schema::CartLinesDiscountsGenerateRunResult> {
    // Bail if discount class doesn't match
    let has_order_discount = input
        .discount()
        .discount_classes()
        .contains(&schema::DiscountClass::Order);

    if !has_order_discount {
        return Ok(schema::CartLinesDiscountsGenerateRunResult { operations: vec![] });
    }

    // Sum quantities of items in the target collection
    let qualifying_qty: i64 = input
        .cart()
        .lines()
        .iter()
        .filter(|line| {
            if let schema::Merchandise::ProductVariant(v) = line.merchandise() {
                *v.product().in_any_collection()
            } else {
                false
            }
        })
        .map(|line| *line.quantity())
        .sum();

    if qualifying_qty < 5 {
        return Ok(schema::CartLinesDiscountsGenerateRunResult { operations: vec![] });
    }

    // Apply 10% off the order subtotal
    Ok(schema::CartLinesDiscountsGenerateRunResult {
        operations: vec![schema::CartOperation::OrderDiscountsAdd(
            schema::OrderDiscountsAddOperation {
                selection_strategy: schema::OrderDiscountSelectionStrategy::First,
                candidates: vec![schema::OrderDiscountCandidate {
                    targets: vec![schema::OrderDiscountCandidateTarget::OrderSubtotal(
                        schema::OrderSubtotalTarget {
                            excluded_cart_line_ids: vec![],
                        },
                    )],
                    message: Some("Volume discount: 10% off".to_string()),
                    value: schema::OrderDiscountCandidateValue::Percentage(
                        schema::Percentage { value: Decimal(10.0) }
                    ),
                    conditions: None,
                    associated_discount_code: None,
                }],
            },
        )],
    })
}

Stap 1.4: testen, implementeren en activeren#

# Local development with hot reload
shopify app dev

# When ready, deploy
shopify app deploy

# In the GraphiQL panel that opens (press `g` in the dev terminal),
# create the automatic discount that uses your Function:

mutation {
  discountAutomaticAppCreate(
    automaticAppDiscount: {
      title: "Volume Discount (5+ collection items)"
      functionHandle: "volume-discount-fn"
      discountClasses: [ORDER]
      startsAt: "2026-04-16T00:00:00Z"
    }
  ) {
    automaticAppDiscount { discountId }
    userErrors { field message }
  }
}

Je Function is nu live, heeft versiebeheer en vervangt het oude Script volledig.

Handleiding 2: een Shipping Script vervangen (verzendmethode verbergen boven een drempel)#

Een veelvoorkomend Script is: ‘Verberg Express Shipping als het subtotaal van de winkelwagen hoger is dan $500, zodat grote bestellingen geen dure nachtelijke verzending krijgen.’ Dit is de versie met een Delivery Customization Function.

Stap 2.1: de basisbestanden aanmaken#

shopify app generate extension --template delivery_customization --name hide-express-fn

Stap 2.2: invoerquery (src/run.graphql)#

query Input {
  cart {
    cost {
      subtotalAmount {
        amount
      }
    }
    deliveryGroups {
      deliveryOptions {
        handle
        title
      }
    }
  }
}

Stap 2.3: logica (src/run.js — JavaScript-variant)#

// @ts-check
/**
 * @typedef {import("../generated/api").RunInput} RunInput
 * @typedef {import("../generated/api").FunctionRunResult} FunctionRunResult
 */

const NO_CHANGES = { operations: [] };
const THRESHOLD = 500.0;
const HIDE_TITLES = ["Express", "Overnight"];

/**
 * @param {RunInput} input
 * @returns {FunctionRunResult}
 */
export function run(input) {
  const subtotal = parseFloat(input.cart.cost.subtotalAmount.amount);
  if (subtotal < THRESHOLD) return NO_CHANGES;

  const operations = input.cart.deliveryGroups.flatMap((group) =>
    group.deliveryOptions
      .filter((opt) => HIDE_TITLES.some((t) => opt.title.includes(t)))
      .map((opt) => ({
        hide: { deliveryOptionHandle: opt.handle },
      }))
  );

  return { operations };
}

Stap 2.4: activeren via Shopify Admin (geen GraphQL nodig)#

Voor Delivery Customizations is er een ingebouwde interface in Shopify Admin. Na shopify app deploy:

1. Ga naar Settings → Shipping and delivery
2. Scrol naar Customizations onderaan de pagina
3. Klik op Add customization → selecteer je Function
4. Sla de wijziging op

De regel die de verzendmethode verbergt, is nu live in productie. Een mutatie is niet nodig.

Handleiding 3: een Payment Script vervangen (rembours verbergen voor B2B)#

Het oude Script: ‘Verberg betalen bij levering voor elke klant met de tag “B2B”.’ Dit is de versie met Payment Customization.

Stap 3.1: de basisbestanden aanmaken#

shopify app generate extension --template payment_customization --name hide-cod-b2b-fn

Stap 3.2: invoerquery#

query Input {
  cart {
    buyerIdentity {
      customer {
        hasTags(tags: [{ tag: "B2B" }]) {
          tag
          hasTag
        }
      }
    }
  }
  paymentMethods {
    id
    name
  }
}

Stap 3.3: logica (src/run.js)#

const NO_CHANGES = { operations: [] };

export function run(input) {
  const tagCheck = input.cart?.buyerIdentity?.customer?.hasTags?.[0];
  const isB2B = tagCheck?.hasTag === true;
  if (!isB2B) return NO_CHANGES;

  const codMethod = input.paymentMethods.find((pm) =>
    pm.name.toLowerCase().includes("cash on delivery")
  );
  if (!codMethod) return NO_CHANGES;

  return {
    operations: [{ hide: { paymentMethodId: codMethod.id } }],
  };
}

Stap 3.4: activeren#

Ook voor Payment Customizations is er een interface in Shopify Admin, onder Settings → Payments → Customizations. Volg dezelfde stappen als bij verzending: kies je Function en sla de wijziging op.

Nu je hier toch bent: wijzigingen na aankoop#

Omdat dit de blog van Revize is, leggen we kort uit waar de app past. Revize regelt wijzigingen die Functions niet kunnen uitvoeren. Nadat een bestelling is geplaatst, willen klanten soms een artikel toevoegen, een andere maat kiezen, het verzendadres corrigeren of alsnog een korting toepassen. Functions werken bij de checkout. Revize werkt daarna. Functions bepalen wat er in de winkelwagen is toegestaan. Met Revize kunnen klanten en je supportteam de bestelling daarna bewerken zonder eerst een terugbetaling te doen en een nieuwe bestelling aan te maken. Dat is relevant voor twee soorten winkels: winkels met zoveel bestellingen dat handmatig bewerken niet meer haalbaar is (uiteraard Plus-winkels, maar ook Advanced-winkels met veel bestellingen), en winkels waarvoor de klantervaring centraal staat. Daar kan een mail met ‘sorry, dat kunnen we niet wijzigen’ een volgende aankoop kosten.

Als je migratieplan wel Scripts door Functions vervangt, maar je het bewerken van bestellingen na aankoop nog niet hebt geregeld, loop je over ongeveer drie weken tegen het volgende lastige proces aan. In onze onlangs gepubliceerde gids voor bestelbeheer lees je hoe je het hele proces na de checkout aanpakt.

Terug naar de migratie.

Testaanpak: werken met een klanttag#

Functions hebben geen ‘conceptmodus’ die je in Shopify Admin kunt inschakelen. De gebruikelijke aanpak is om de nieuwe Function alleen uit te voeren voor klanten met een bepaalde tag. Laat het oude Script en de nieuwe Function naast elkaar draaien, controleer of ze voor klanten met die tag dezelfde uitkomst geven en schakel daarna over.

Stap 1: geef je testgebruikers een tag#

Voeg in Customers de tag FN-TESTER toe aan twee of drie interne klantaccounts.

Stap 2: laat de Function controleren op die tag#

// At the top of your run function
let is_tester = input
    .cart()
    .buyer_identity()
    .and_then(|bi| bi.customer())
    .map(|c| c.has_any_tag())
    .unwrap_or(&false);

if !*is_tester {
    return Ok(default_result);  // Fall through to existing Script
}

// New Function logic only runs for tagged users

Stap 3: voeg hasAnyTag toe aan je invoerquery#

cart {
  buyerIdentity {
    customer {
      hasAnyTag(tags: ["FN-TESTER"])
    }
  }
}

Stap 4: controleer het gedrag in de checkout#

Log in als klant met de tag, doorloop de checkout en controleer of de Function wordt uitgevoerd. Log daarna in als klant zonder de tag en controleer of het oude Script nog werkt. Leveren beide routes een paar dagen lang dezelfde uitkomst op? Verwijder dan de controle op de tag, zodat de Function voor iedereen draait.

Stap 5: maak de publicatie van het oude Script ongedaan#

Ga naar Apps → Script Editor → [Your Script] → Unpublish. Daarna is de Function de enige bron voor deze logica.

Een implementatieproces dat kan meegroeien#

Blijf niet voor altijd implementeren vanaf de laptop van een ontwikkelaar. Zodra je een of twee Scripts hebt gemigreerd, richt je een CI-pijplijn in.

Een eenvoudige werkende opzet#

# .github/workflows/deploy-functions.yml
name: Deploy Shopify Functions
on:
  push:
    branches: [main]
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with: { node-version: '20' }
      - uses: dtolnay/rust-toolchain@stable
        with: { targets: wasm32-wasip1 }
      - run: npm install -g @shopify/cli@latest
      - run: shopify app deploy --force
        env:
          SHOPIFY_CLI_PARTNERS_TOKEN: ${{ secrets.SHOPIFY_CLI_PARTNERS_TOKEN }}

Genereer de partnertoken in je Partner-dashboard onder Settings → Tokens. Vanaf dat moment worden je Functions bij elke merge naar main geïmplementeerd. Niemand hoeft meer op Slack te vragen of Mike die wijziging al heeft uitgerold.

Versiebeheer en terugdraaien#

shopify app deploy maakt een momentopname met een versienummer. Zo ga je terug naar een eerdere versie:

shopify app versions list
shopify app release --version <previous-version-id>

Bij Scripts moest je de oude code terugvinden en opnieuw plakken om een wijziging terug te draaien. Dit is een stuk eenvoudiger.

Vijf fouten die teams vaak maken#

Na een jaar waarin we Plus-verkopers bij deze migratie hebben geholpen, zien we steeds dezelfde vijf fouten.

1. Functions behandelen als een één-op-éénkopie van Scripts. Eén Function kan drie Scripts vervangen met duidelijkere voorwaarden. Bekijk eerst hoe je Scripts samen werken voordat je ze herschrijft.

2. De leestoegangsrechten vergeten. Veel Functions hebben read_customers, read_orders of write_discounts nodig. Voeg ze onder scopes toe in shopify.app.toml en autoriseer de app opnieuw. Anders geeft je invoerquery null terug.

3. Functions uitvoeren voor klanten zonder testtag voordat je de uitkomsten hebt vergeleken. Ook als de code klopt, kunnen uitzonderingen problemen veroorzaken: een lege winkelwagen, cadeaubonnen, winkeltegoed of B2B-concepten. Gefaseerd uitrollen met een tag kost je twee dagen en kan een ernstig productie-incident voorkomen.

4. Het Customizations Report overslaan. Dit rapport geeft je het beste overzicht van wat er werkelijk draait. Baseer je migratie op het rapport, niet op je geheugen.

5. Collectie-ID’s en klanttags rechtstreeks in de code zetten. Gebruik Function-configuratie via metafields als verkopers de waarden moeten kunnen aanpassen. De CLI kan configuratie op basis van metafields voor je opzetten. Bekijk hiervoor de Shopify-documentatie over Function-configuratie.

Migratiechecklist voor de komende 75 dagen#

Met deze planning per week kun je vóór 30 juni klaar zijn.

Begin je deze week, dan heb je speling. Begin je pas in juni, dan niet.

Wat je deze week moet doen#

Sluit dit tabblad niet zodra je het artikel uit hebt. Doe deze vier dingen in de komende zeven dagen.

1. Haal het Customizations Report op. Ga naar Settings → Checkout → Customizations Report en exporteer het rapport. Dit is je lijst met migratiewerk.

2. Richt je ontwikkelomgeving in. Installeer Node 18+, Shopify CLI en, indien nodig, Rust. Controleer of shopify version werkt. Benodigde tijd: 30 minuten.

3. Zet één kleine Function op en implementeer die in een ontwikkelwinkel. Kies je eenvoudigste Script, meestal een regel die een betaalmethode verbergt. Migreer het van begin tot eind. Ook als de Function nooit naar productie gaat, weet je daarna dat je ontwikkelomgeving werkt.

4. Reserveer tijd in je agenda voor de komende acht weken. Een migratie gebeurt niet in de paar vrije momenten tussen sprints. Plan terugkerende tijd in, bijvoorbeeld elke dinsdag- en donderdagmiddag, en behandel die als tijd voor een release.

Bij de teams die we hebben zien migreren, komt hetzelfde patroon terug: twee weken uitstel, drie weken daadwerkelijk werk en één week opruimen. Dat zijn zes weken. Je hebt er tien. Gebruik de resterende tijd voor codereviews en kwaliteitscontrole, niet om de start uit te stellen.

Zodra je checkoutlogica op orde is, pakken de meeste teams wijzigingen na aankoop aan: klanten die hun adres wijzigen, artikelen omruilen of na het plaatsen van een bestelling nog korting willen toevoegen. Staat dat op je planning? Dat zou verstandig zijn, of je nu een Plus-winkel met veel bestellingen beheert of een Advanced-winkel waar de klantervaring vooropstaat. Revize staat in de Shopify App Store en werkt samen met alle Functions die je hier bouwt.

Bronnen#

• Overzicht van Shopify Functions — Shopify Developer Docs
• Migreren van Shopify Scripts naar Functions
• Handleiding voor het bouwen van een kortings-Function
• API-documentatie voor Delivery Customization Functions
• API-documentatie voor Payment Customization Functions
• Documentatie voor Shopify CLI

Bijgewerkt in augustus 2026. Revize is een Shopify-app waarmee klanten na aankoop zelf hun bestellingen kunnen bewerken. Ze kunnen vóór fulfillment (orderafhandeling) het verzendadres wijzigen, een variant of product omruilen, annuleren en een terugbetaling of winkeltegoed krijgen, zonder contact op te nemen met de klantenservice. Lees meer over klanten hun eigen Shopify-bestellingen laten bewerken of bekijk Revize in de Shopify App Store.