Mobile SDK - iOS - Kleep Docs

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

Installation

Dieser Prozess muss nur einmal durchgeführt werden, wenn Sie das SDK zum ersten Mal in Ihrem Projekt installieren müssen. Weitere Informationen zu nachfolgenden Updates finden Sie im Abschnitt Update.

Fügen Sie folgendes Paket hinzu: https://github.com/KlipFit/kleep-spm
Ändern Sie die Abhängigkeitsregel auf: bis zur nächsten Hauptversion

Berechtigungen

Fügen Sie folgende Berechtigung in info.plist Ihres Projekts hinzu: NSCameraUsageDescription

Verwendung

Methode 1: `requestSize`

Diese Methode ermöglicht die Implementierung der CTA-Logik.

Parameter	Priorität	Beschreibung
productID	erforderlich	Ihre Produkt-ID
retailerName	erforderlich	Name des Händlers
customerID	optional	CRM-Identifikator, für Analytics verwendet
trackingID	optional	Benutzer-ID, die von einer externen Tracking-Lösung verwendet wird

Logik-Schema Dieses Schema erklärt, wie der CTA zum Öffnen von Kleep aktualisiert wird. https://www.figma.com/board/BlurZ01lR3JBQZeTUU98TE/Mobile---CTA-Logic?node-id=0-1&t=ccXWciNziIdfhgew-1 Implementierungsbeispiel

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`

Diese Methode wird aufgerufen, wenn der CTA angeklickt wird. Sie ermöglicht das Laden der verschiedenen Bildschirme. Der Entwickler, der das SDK integriert, sollte sie in ein Bottom Sheet einbetten.

Parameter	Priorität	Beschreibung
productID	erforderlich	Ihre Produkt-ID
retailerName	erforderlich	Name des Händlers
customerID	optional	CRM-Identifikator, für Analytics verwendet
trackingID	optional	ID, die von einem externen Tracking-Anbieter verwendet wird

Implementierungsbeispiel

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`

Diese Methode ermöglicht das Tracking benutzerdefinierter Ereignisse.

Parameter	Priorität	Beschreibung
eventName	erforderlich	Name des zu trackenden Ereignisses
params	optional	Mit dem Ereignis verbundene Informationen

import Klipfit

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

Wir möchten 3 Ereignisse tracken:

eventName	Auslöser
`product_viewed`	Beim Aufrufen des PDP
`product_added_to_cart`	Beim Hinzufügen eines Produkts zum Warenkorb
`checkout_completed`	Bei der Bestellbestätigung nach der Zahlung

product_viewed Parameter (CSV) Beispiel

{
		productId: str
}

product_added_to_cart Parameter (CSV) Beispiel

{
    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 Parameter (CSV) Beispiel

{
    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"
				}
	    }
	    ...
    ],
}

Willkommen

CMS

Mobil

Dashboard

Daten

Datenschutz

Mobile SDK - iOS

Installation

Berechtigungen

Verwendung

Methode 1: `requestSize`

Methode 2: `loadView`

Methode 3: `track`

​Installation

​Berechtigungen

​Verwendung

​Methode 1: requestSize

​Methode 2: loadView

​Methode 3: track

Installation

Berechtigungen

Verwendung

Methode 1: `requestSize`

Methode 2: `loadView`

Methode 3: `track`