Easy Implementation

We’re not all IT geniuses. That’s why we’ve made the implementation process as simple and straightforward as possible. Result: minimal effort from your side, maximum outcome.

Implementation process of Shopwithyourfriends

Generally, total standard implementation takes only a few hours and is done completely via our website. Follow the four simple steps and real-time social shopping in your webshop is a fact!
Sign up
During the first step you will be asked to sign-up on the website and provide your account details. After you have confirmed your account, you are able to complete the signup through the payment with Paypal. Next step is setting up your product data feed.
Upload your products

One of the main parts of the process that makes the implementation relatively easy is the standard XML datafeed format we use. With this feed format we are able to process your product information (such as detailed descriptions, images, videos and reviews) for Shopwithyourfriends. After you’ve signed up we will get in contact with you and provide you with a document describing how to setup your product datafeed following the standard format. This document can also be found below. We advise you to provide as much content as possible in order to give end users the best shopping experience. After setting up the feed, we will ask you to provide a URL with the location of the feed. We will fetch the feed from your server on a daily basis to keep Shopwithyourfriends up to date with the latest changes in your website.

Design

When the data feed is uploaded, the last step is finishing the design. This means customizing your Shopwithyourfriends application to the look and feel of your webshop. The degree of customization depends on the plan you have signed up for.

Implement button

Final step is selecting and implementing the Shopwithyourfriends launch button in your shop. This is the button that gives users the ability to start a shopping session around the a product in Shopwithyourfriends. We will offer you a set of buttons you can choose from. Gold or Platinum users are able to upload their own designed button. The button is shown by implementing a small piece of JS code in your shop. Then you are good to go!

Front-end implementation

Choosing a Shopwithyourfriends button

Please choose a button design that fits best in your shop and e-mail us the matching ID.

ID Button design small (22px) ID Button design big (26px)
1 5
2 6
3 7
4 8

Custom buttons for gold and platinum subscriptions. You can choose a design and a custom label.

ID Custom design
9
10
11
12

Implementing the Shopwithyourfriends button

In order to be able to launch the Shopwithyourfriends platform for a product in the webshop, some modifications to the templates are required. At the end of the body of the HTML document a javascript file need to be included. This javascript takes care of the positioning of the correct links on the determined place with the correct parameters.

The include is:

<script type=”text/javascript”>
jpxLauncherParallel = 1;
(function() {
var jpx = document.createElement(‘script’); jpx.type = ‘text/javascript’; jpx.async = true;
jpx.src = (‘https:’ == document.location.protocol ? ‘https://’ : ‘http://’) + ‘www.shopwithyourfriends.com/implementation/jslauncher/{jpxId}’;
var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(jpx, s);
})();
</script>

<script type=”text/javascript”>jpxLauncherParallel = 1;(function() {var jpx = document.createElement(‘script’); jpx.type = ‘text/javascript’; jpx.async = true;jpx.src = (‘https:’ == document.location.protocol ? ‘https://’ : ‘http://’) + ‘www.shopwithyourfriends.com/implementation/jslauncher/135′;var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(jpx, s);})();</script>

The following parameter has to be replaced:

  • {jpxId}

This is the identifier for the Shopwithyourfriends implementation for the webshop. The specific identifier will be supplied by Chatventure during the implementation process. On the correct location of the page a div-tag needs to be positioned which functions as a container for the javascript include to place the link in.

The div tag should be constructed as follows:

The following parameter has to be replaced:

  • {prdId}

This is the product identifier of the specific product that the user wishes to share when he/she clicks on the link. This identifier will be used to fetch product information with the ondemand content connection.

Feed manual

The Shopwithyourfriends platform needs a data feed to provide your content in the application. This document will describe how to setup a data feed and how the data will be used in the Shopwithyourfriends application.

download xml feed format