Abandoned carts carry millions of products and the customer needs a little push to complete them. Netmera helps you reach those customers at the right moment. Catch the abandoned cart right before it expires and encourage customer with push notifications. Use autotriggered messages to make it easy! Visit our website for more: www.netmera.com
2. 1
Abandoned
Carts
Since the early days of e-commerce, abandoned carts have been a problem.
User adds products in his basket and for some reason, he leaves it without
completing the purchase. With mobile commerce, distractions are limitless
and abandoned carts increase in number.
If your platform runs both on web & mobile app, it is more difficult to know
if the purchasing is complete or not. User might have started purchasing in
one platform and completed in the other. Real answer comes from your
backend system. You can make this system talk to Netmera and say
“There is an abandoned cart!” with our rest API. Then, setting an
auto-triggered push notification with related event will do the rest.
Use Case: Abandoned Carts
3. 2
Step1
Create a new application
Create a new application over Netmera web site.
Step2
Add Netmera SDK
Add Netmera SDK into your application. In order to use Netmera features,
you should integrate Netmera SDK (iOS or Android) within your application.
Details about integration are here:
Tutorial : http://cp.netmera.com/admin/tutorial
Use Case: Abandoned Carts
4. 3
Step3
Push Registration
Register your device to Netmera Push Service through SDK. Related
documents are here:
For Android Platform :
http://www.netmera.com/resources/android-guide/push-notification
(Step1-2-3)
For IOS Platform :
http://www.netmera.com/resources/ios-guide-2-0/netmera-push-notification/
(Step1-2-3)
Step4
Identify your customers
You can identify users with Netmera installation ID value. This value is a
unique id generated by Netmera SDK. When user logins to your mobile
application, this ID can be send together with username and password info.
Later it can be stored in your user database. You can get installation ID for
devices using:
For Android Netmera.getInstallationId() method
For iOS [Netmera getInstallationId] method
Use Case: Abandoned Carts
5. 4
Step5
Integrating a custom event
Next step is integrating a custom event to your expiration control algorithm
(or abandoned cart algorithm). Whenever you detect if a customer’s cart is
about to expire (say 2 mins before expiration or 2 min before it falls into
abandoned cart category) in your server side system, you fire a custom
event to Netmera using our REST Event API. Events can be fired using
following sample curl request:
curl -X POST
-H “X-netmera-api-key: YOUR_API_KEY”
-H “Content-Type: application/json”
-d ‘{
“eventType”: “CartIsToExpire”,
“iid”: “INSTALLATION_ID_OF_CUSTOMER”
}
}’
https://api.netmera.com/event/1.0/fireEvent
Use Case: Abandoned Carts
6. 5
Step6
Create your rich push
Design and develop an HTML-based content for your rich push notification.
Use Case: Abandoned Carts
7. 6
Step7
Create your rich push
Now, you are ready to send the notification. You can follow rich push
preparation steps in the demo part. You can insert the HTML prepared in
Step 6. After auto-triggered push is set, user will get a notification
whenever they abandon their cart or when the cart is about to expire.
Step8
Ready to send
Now you want customers to be forwarded to “My Cart” page in the mobile
application from rich push notification content. To achieve this, your native
application should be able to communicate with the rich push notification
webview.
In order to communicate with client code, you will create a dummy iframe
with a specific source url when the relevant button is touched on the rich
push notification. Then, your client code will catch the given url, and do
needed process to forward user to mobile application’s cart page.
For iOS platform, one way is to use the UIWebViewDelegate method
**webView:shouldStartLoadWithRequest:navigationType:**,
which allows the native iOS application to intercept loading requests of
webview and decide if the webview should load coming request again.
Use Case: Abandoned Carts
8. 7
Here is a sample implementation for the javascript snippet needed in the
HTML code(‘forwardToAppButton’ is the id property of the button in rich
push html which you wants to track in native application):
$(“#forwardToAppButton”).click(function {
var iframe = document.createElement(“IFRAME”);
iframe.setAttribute(“src”, “myappidentifier-mycart:
“);
document.documentElement.appendChild(iframe);
iframe.parentNode.removeChild(iframe);
iframe = null;
});
And this is the client code which will cover the fake request of the iframe,
and open “MyCart” view controller (You should put the following code into
the **webView:shouldStartLoadWithRequest:navigationType:** method in
NMRichPushViewController.m file):
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:
(NSURLRequest *)request navigationType:
(UIWebViewNavigationType)navigationType
{
//You should NOT remove this line in order to make controller work properly!!
BOOL load = [super webView:webView shouldStartLoadWithRequest:request
navigationType:navigationType];
NSString *prefix = @”myappidentifier-mycart:”;
NSString *urlString = [[request URL] absoluteString];
if([urlString hasPrefix:prefix])
{
// Cart forwarding requested. Write needed code to open controller of my cart
page.
//Sample code:
MyCartViewController *controller = [[MyCartViewController alloc] init];
[self presentViewController:controller animated:YES completion:^{
}];
return NO;
}
return load;
}
Use Case: Abandoned Carts
9. 8
By this way, you provide users to be forwarded to their carts in mobile app
when they press “Go To Cart” button in the rich push notification.
For Android platform, you can call native functions inside the rich push,
in order to do it, you should call handleRichPush() method with an
NetmeraJavascriptInterface object or list of NetmeraJavascriptInterfaces.
While creating netmeraJavascriptInterface objects you should set two
parameters:
An object and a string which is used inside javascript to call native java
functions.
Public methods of the given object can be called inside javascript. For
example you may have a class like:
public class MyJavaScriptInterface {
Context mContext;
MyJavaScriptInterface(Context c) {
mContext = c;
}
@JavascriptInterface
public void openNativeApplication() {
Intent intent = new Intent(PushActivity.this, PaymentActivity.class);
startActivity(intent);
}
}
You can create a NetmeraJavascriptInterface object from this class as
shown below:
MyJavaScriptInterface myJavaScriptInterface =
new MyJavaScriptInterface(getApplicationContext());
NetmeraJavascriptInterface javascriptInterface =
new NetmeraJavascriptInterface( myJavaScriptInterface, “AndroidFunction”);
Use Case: Abandoned Carts
10. 9
And while calling handleRichPush you should give this object as the second
parameter:
NetmeraPushService.handleRichPush(PushActivity.this, javascriptInterface);
Now you can simply call any method of your custom class inside javascript
as follows:
AndroidFunction.yourPublicMethod();
We want to open our native application when the button clicked, so we
place it an approprate place in our rich push.
$(“#forwardToAppButton”).click(function {
AndroidFunction.openNativeApplication();
});
This is an example of how the rich push notification is seen on a real device.
Now, by following these steps you can create abandoned cart campaigns
easily.
Use Case: Abandoned Carts