Mobile SDK - iOS - Kleep Docs

Github Repository: https://github.com/KlipFit/kleep-spm

Installatie

Dit proces hoeft slechts één keer te worden doorlopen, de eerste keer dat u de SDK in uw project installeert. Raadpleeg de sectie Update voor de instructies bij volgende updates.

Voeg het volgende pakket toe: https://github.com/KlipFit/kleep-spm
Wijzig de afhankelijkheidsregel naar: tot de volgende hoofdversie

Rechten

Voeg de volgende rechtenregel toe aan uw project in info.plist: NSCameraUsageDescription

Gebruik

Methode 1: `requestSize`

Deze methode maakt het mogelijk om de logica van de CTA te implementeren.

parameter	prioriteit	beschrijving
productID	verplicht	Uw product-ID
retailerName	verplicht	Naam van de retailer
customerID	optioneel	CRM-identificator, gebruikt voor analyse
trackingID	optioneel	Gebruikers-ID gebruikt door externe trackingoplossing

Logisch schema Dit schema legt uit hoe de CTA die Kleep opent bijgewerkt moet worden. https://www.figma.com/board/BlurZ01lR3JBQZeTUU98TE/Mobile---CTA-Logic?node-id=0-1&t=ccXWciNziIdfhgew-1 Implementatievoorbeeld

import Klipfit

struct ContentView: View {
    @State var isOpenView = false
        
    var body: some View {
        VStack {
            Spacer()
            Button("Open Kleep") {
                isOpenView = true
            }
            Spacer(minLength: 40)
            
            Button("obtenir la taille") {
                Klipfit.shared.requestSize(productID: String, retailerName: String, trackingID: String, customerID: String) { kleepResult in
                    switch kleepResult {
                    case .notSupported:
	                    // Hide CTA
                        print("NotSupported")
                    case .noRecommendationYet:
	                    // Display CTA with neutral label
                        print("NoRecommendationYet")
                    case .recommendationFound(let result):
	                    // Display CTA with size reco
                        print("RecommendationFound: ", result)
                    }
                }
            }
	            Spacer()
        }
        .sheet(isPresented: $isOpenView) {
            KlipFitFindSizeView { result, variantID in 
								// addToCart(variantID)
	          }
        }
    }
}

Methode 2: `loadView`

Deze methode wordt aangeroepen wanneer op de CTA wordt geklikt. Hiermee kunnen de verschillende schermen worden geladen. De ontwikkelaar die de SDK integreert, moet ze in een bottom sheet insluiten.

parameter	prioriteit	beschrijving
productID	verplicht	Uw product-ID
retailerName	verplicht	Naam van de retailer
customerID	optioneel	CRM-identificator, gebruikt voor analyse
trackingID	optioneel	ID gebruikt door externe trackingprovider

Implementatievoorbeeld

struct KlipFitFindSizeView: UIViewControllerRepresentable {
		
		public var onResult: KleepOnResultCompletion

    func makeUIViewController(context: Context) -> KlipftNavigationController {
        guard let viewController =
        KlipftNavigationController.loadView(
                productID: String,
                retailerName: String,
                language: KleepLanguageCode, // .fr .en .es .it .pt .nl 
                trackingID: "",
                customerID: "",
                stocks: [String : Bool]?,
                onResult: onResult
        )
        else {
            fatalError("ViewController not implemented in storyboard")
        }
        viewController.navigationBar.isHidden = true
        return viewController
    }
    func updateUIViewController(_ uiViewController: KlipftNavigationController, context: Context) {
    }
    typealias UIViewControllerType = KlipftNavigationController
}

Methode 3: `track`

Deze methode maakt het mogelijk om aangepaste gebeurtenissen bij te houden.

parameter	prioriteit	beschrijving
eventName	verplicht	Naam van de te volgen gebeurtenis
params	optioneel	Informatie gekoppeld aan de gebeurtenis

import Klipfit

Klipfit.shared.track(eventName: String, params: [String: Any]? = nil)

We willen 3 gebeurtenissen bijhouden:

eventName	Trigger
`product_viewed`	Wanneer de PDP wordt bekeken
`product_added_to_cart`	Wanneer een product aan de winkelwagen wordt toegevoegd
`checkout_completed`	Bij orderbevestiging na de betaling

product_viewed Parameters (CSV) Voorbeeld

{
		productId: str
}

product_added_to_cart Parameters (CSV) Voorbeeld

{
    productId: str,
    variantId: str,
    cart: [
	    {
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
				sku: "XYZ",
		    size: "S",
		    quantity: 2,
		    price: {
						amount: "50",
				    currencyCode: "EUR"		    
		    }
	    },
	    {
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
		    sku: "XYZ",
		    size: "S",
		    quantity: 1,
		    price: {
				    amount: "40",
				    currencyCode: "USD"
				}
	    }
	    ...
    ],
}

checkout_completed Parameters (CSV) Voorbeeld

{
    orderId: "000001",
    cart: [
	    {
		    lineItemId: "000001#1",
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
				sku: "XYZ",
		    size: "S",
		    quantity: 2,
		    price: {
						amount: "50",
				    currencyCode: "EUR"		    
		    }
	    },
	    {
			  lineItemId: "000000#2",
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
		    sku: "XYZ",
		    size: "S",
		    quantity: 1,
		    price: {
				    amount: "40",
				    currencyCode: "USD"
				}
	    }
	    ...
    ],
}

Welkom

CMS

Mobiel

Dashboard

Gegevens

Privacy

Mobile SDK - iOS

Installatie

Rechten

Gebruik

Methode 1: `requestSize`

Methode 2: `loadView`

Methode 3: `track`

​Installatie

​Rechten

​Gebruik

​Methode 1: requestSize

​Methode 2: loadView

​Methode 3: track

Installatie

Rechten

Gebruik

Methode 1: `requestSize`

Methode 2: `loadView`

Methode 3: `track`