Přeskočit na hlavní obsah
Všechny sbírkyCandy Rack
Veřejné rozhraní API Candy Rack a možnosti pro vývojáře
Veřejné rozhraní API Candy Rack a možnosti pro vývojáře

Candy Rack nabízí veřejné rozhraní Window API, které může zlepšit práci s aplikací.

Lucia Dvořáková avatar
Autor: Lucia Dvořáková
Aktualizováno před více než 2 měsíci

Všechny úpravy kódu lze přidat do tagu head v souboru theme.liquid nebo můžete kontaktovat naši podporu a my vám rádi pomůžeme s jakýmkoli problémem nebo požadavkem na přizpůsobení.

Tým pro úspěšné řešení zákaznických požadavků má možnost přidat tyto úpravy do určeného souboru config.js v našem systému správy, takže přístup do obchodu není nutný.

Vlastní selektory tlačítka Přidat do košíku

Candy Rack ve výchozím nastavení podporuje řadu selektorů, které se úspěšně spustí po kliknutí na tlačítko Přidat do košíku, přesto se může stát, že téma používá selektory, které naše aplikace nerozpozná. V takovém případě existuje možnost zadat vlastní selektory, které se přidají do pole podporovaných selektorů.

// window.CANDYRACK_CUSTOM_BUTTON_SELECTORS: string[]window.CANDYRACK_CUSTOM_BUTTON_SELECTORS = ['.atc-class-1','#atc-id']

Zabránění zobrazení Candy Rack na základě podmínky

V případě, že obchod používá některá vlastní pole, která je třeba vyplnit před kliknutím na tlačítko Přidat do košíku, a naše validace je nezachytí, existuje způsob, jak ručně zabránit zobrazení popup okna na základě návratové hodnoty následující metody.

// window.CANDYRACK_CAN_ATC: (button: HTMLElement) => booleanwindow.CANDYRACK_CAN_ATC = (_button) => {  const input = document.querySelector('.custom-text-input')  if(input.value.trim().length === 0) {    return false  } return true}

Varianta nebyla nalezena

Pro úspěšné spuštění otevření vyskakovacího okna potřebujeme správnou variantu rodiče pro určení nabídky, může se stát, že naše výchozí selektory selžou nebo se nezmění při výběru jiné varianty. Funkce nepřepisuje výchozí selektory a v případě, že vrátí nedefinovaný, řeší se výchozí případ. V případě, že variantu lze získat pouze prostřednictvím asynchronního požadavku, lze čekat na odpověď.

// window.CANDYRACK_VARIANT_SELECTOR_FUNCTION: (button: HTMLElement) => Promise<číslo>;window.CANDYRACK_VARIANT_SELECTOR_FUNCTION = (button) => {  const selectedVariant = button.closest('.variant-select')?.value  if(value) {    return Number(value)  }}

Formátování peněz

Candy Rack podporuje nejoblíbenější aplikace pro více měn již z výroby, navíc formátuje peníze na základě dostupných API nebo nastavení tématu. Přesto v případě, že formátování není ideální, existuje způsob, jak jej přepsat.

// window.CANDYRACK_CUSTOM_FORMAT_MONEY: (amount?: number, currency: string) => string;window.CANDYRACK_CUSTOM_FORMAT_MONEY = (amount, currency) => {  return `${currency} ${amount}`}

Odstranění validace formuláře

Ve výchozím nastavení Candy Rack řeší validaci formuláře spuštěním form.checkValidity(). Někdy to může způsobovat problémy, proto lze ověřování zcela vypnout.

// window.CANDYRACK_DISABLE_FORM_VALIDATION : booleanwindow.CANDYRACK_DISABLE_FORM_VALIDATION = true

Vlastní události

Candy Rack nabízí řadu vlastních událostí, které lze použít k provádění vedlejších efektů - například otevření zásuvkového košíku.

// Spuštěno při kliknutí na tlačítko Přidat do košíkudocument.addEventListener('addToCartButtonClicked', (e) => {  // Some code})// Spuštěno při přidání nabídkydocument.addEventListener('candyrack-offer-added', (e) => {  // Some code})// Spuštěno při odebrání nabídkydocument.addEventListener('candyrack-offer-removed', (e) => {  // Some code})// Spuštěno při zavření vyskakovacího oknadocument.addEventListener('candyrack-closed', (e) => {  // Some code})

Pokud vás zajímají také vizuální úpravy vyskakovacího okna, můžete se více dozvědět v článku Jak přizpůsobit vyskakovací okno pomocí CSS.

Máte nějaké dotazy? Klikněte na ikonu chatu v pravém dolním rohu této stránky nebo nám napište na adresu [email protected].

Dostali jste odpověď na svou otázku?