Table of contents Table of contents... 1 About Sliding PayPal Shopping Cart 2... 2 Features in Detail... 3 The Basics: Use Sliding PayPal Shopping Cart 2 on your Page... 21 Advanced: Different Options and Prices for your Products... 34 Advanced: Using the Discount Options in Sliding PayPal Shopping Cart 2... 43 Advanced: Using the Shopping Cart with Dynamic Data... 47 Video: Use Sliding PayPal Shopping Cart 2 on your Page... 54 Video: Different Options and Prices for your Products... 54 Video: Using the Discount Options in Sliding PayPal Shopping Cart 2... 54 Video: Using the Shopping Cart with Dynamic Data... 54 Copyright 2015.com All Rights Reserved To get more go to.com Page 1 of 54
About Sliding PayPal Shopping Cart 2 Give your users the ultimate shopping experience with the Sliding PayPal Shopping Cart 2! With this Dreamweaver extension your users will be able to add products, change quantity, get rich discounts, automatically calculate tax and shipping costs, and get a smooth PayPal checkout process, with just a few mouse clicks. The extension also supports HTML5 Data Bindings and Database Connector so you can easily create your shopping car from a dynamic source. Copyright 2015.com All Rights Reserved To get more go to.com Page 2 of 54
Features in Detail Amazing PayPal shopping cart for your commercial website - With a single mouse click your users can add/remove products to the cart, manage quantity and get redirected quickly to PayPal for the checkout process. Copyright 2015.com All Rights Reserved To get more go to.com Page 3 of 54
Different designs for the shopping cart - Fully customizable through the CSS, the the shopping cart box can be styled to fit your website design. With the proper color, the cart is easy to notice and will draw your users attention instantly. Copyright 2015.com All Rights Reserved To get more go to.com Page 4 of 54
Works with any site type - You can integrate the shopping cart on a static as well as dynamic website fairly simple. Custom shopping cart appearance - Choose the left or right edge of the page to pin the shopping to and position its overlay from the edge of the browser with a fixed distance. Copyright 2015.com All Rights Reserved To get more go to.com Page 5 of 54
Copyright 2015.com All Rights Reserved To get more go to.com Page 6 of 54 Sliding PayPal Shopping Cart 2
Easy to manage shopping cart - The user can add, change quantity or delete items from the shopping cart and all the totals and discounts are automatically calculated. Any product can be easily added with AddToCart control behavior. Copyright 2015.com All Rights Reserved To get more go to.com Page 7 of 54
Dynamic shopping cart - If you have a dynamic web site with products in a database, the shopping cart works even easier in a dynamic repeat region, thanks to the HTML5 Data Bindings and Database Connector integration. Copyright 2015.com All Rights Reserved To get more go to.com Page 8 of 54
Copyright 2015.com All Rights Reserved To get more go to.com Page 9 of 54 Sliding PayPal Shopping Cart 2
Flexible prices and discounts - Add adjustable prices and discounts for multiple items purchase. Copyright 2015.com All Rights Reserved To get more go to.com Page 10 of 54
Various options per product and prices per option - Add up to three options for a product with infinite values and different price for each value. Copyright 2015.com All Rights Reserved To get more go to.com Page 11 of 54
Taxes and shipping calculation - You can add fixed tax and shipping prices for each product, which will overwrite the default PayPal ones. Copyright 2015.com All Rights Reserved To get more go to.com Page 12 of 54
Preserve shopping cart data in the user browser - Through the user browser cookies the shopping cart data can be preserved for the selected period of time. No need of complicated database solutions. Copyright 2015.com All Rights Reserved To get more go to.com Page 13 of 54
Custom shopping cart layout - Add custom texts to your checkout and process buttons, as well as to the subtotal, discount and shipping lines. Copyright 2015.com All Rights Reserved To get more go to.com Page 14 of 54
Pinned shopping cart - With its minimalistic design and sliding behavior, it never disturbs reading order and products listings as it s pinned to the page edge. Copyright 2015.com All Rights Reserved To get more go to.com Page 15 of 54
Mobile integration - The shopping cart works great on ios and Android based devices. Copyright 2015.com All Rights Reserved To get more go to.com Page 16 of 54
Full support for the Behavior Connector - For example you can choose to show or to hide the shopping cart from the available events. Copyright 2015.com All Rights Reserved To get more go to.com Page 17 of 54
Great Dreamweaver integration - Interactive dialog in Dreamweaver with all the options you ll need. Copyright 2015.com All Rights Reserved To get more go to.com Page 18 of 54
Fully cross-browser compatible - Runs perfectly on any up-to-date desktop browser as well as mobile devices. Copyright 2015.com All Rights Reserved To get more go to.com Page 19 of 54
Before you begin Make sure to setup your site in Dreamweaver first before creating a page. If you don t know how to do that please read this. Installing the extension Read the tutorial at http://www.dmxzone.com/go/4671/how-to-install-extensions-from-dmxzone/ Login, download the product, and look up your serial at http://www.dmxzone.com/user/products Get the latest Extension Manager at http://www.dmxzone.com/go/22670/dmxzone-extension-manager-for-dreamweaver Open Extension Manager and go to your Purchased products tab and click install. If you have a subscription, the extension is to be found and installed in the Explore tab. Get the latest extension manager from Adobe at http://www.adobe.com/exchange/em_download/ Open the.zxp file if you re using Dreamweaver CC or the.mxp file for Dreamweaver CS+ with Adobe Extension manager and install the extension. If you experience any problems contact our Live Support! Copyright 2015.com All Rights Reserved To get more go to.com Page 20 of 54
The Basics: Use Sliding PayPal Shopping Cart 2 on your Page In this tutorial we will show you how to insert Sliding PayPal Shopping Cart 2 on your page and set it up. *You can also check out the video. Copyright 2015.com All Rights Reserved To get more go to.com Page 21 of 54
How to do it 1. We inserted several pictures that we d like to sell on our site. Each of the pictures has its own buy now button, which actually is a simple HTML button. First, let s setup the general options of the Sliding PayPal Shopping Cart 2. Open the insert panel (1) and select Sliding PayPal Shopping Cart 2 (2). Copyright 2015.com All Rights Reserved To get more go to.com Page 22 of 54
2. Select where the shopping cart should appear on the left or on the right edge of your screen. We select the right edge (1). Enter the distance from the selected edge. The default value here is 50 pixels, but you can also use percentage values here. We leave it to its default (2). Copyright 2015.com All Rights Reserved To get more go to.com Page 23 of 54
3. Select a currency for the payments, for our tutorial it s EUR (1). Then, enter your PayPal ID or the email address, associated with your PayPal account (2) and choose one of the predefined designs (3). Copyright 2015.com All Rights Reserved To get more go to.com Page 24 of 54
4. You can use successful URL, in order to redirect the users, when the payment is completed. Also, you can use a cancel URL, to redirect the users, if they cancel the payment. Copyright 2015.com All Rights Reserved To get more go to.com Page 25 of 54
5. In the advanced tab (1), you can select an HTML element that the shopping cart should be rendered as a child of. The default parent is the page body and we leave this unchanged (2). You can change the PayPal URL, if you are using sandbox or another version of the PayPal website (3). Copyright 2015.com All Rights Reserved To get more go to.com Page 26 of 54
6. Select the base path of your website to set the cookie to. We leave this option to its default (1). Set the number of days, that the user s browsers should keep the shopping cart data. We enter 10 days (2). Copyright 2015.com All Rights Reserved To get more go to.com Page 27 of 54
7. Then, if needed, you can change the default shopping cart texts. We leave these to their default values. Click the OK button, when you are done. Copyright 2015.com All Rights Reserved To get more go to.com Page 28 of 54
8. We ve successfully set up the Sliding PayPal Shopping Cart 2 options. Now we are going to add the Add to cart functionality to our Buy buttons. We select the buy buttons, for our first picture (1) and from the behaviors panel (2), choose add new behavior (3). Copyright 2015.com All Rights Reserved To get more go to.com Page 29 of 54
9. Then, in the menu (1), select control Sliding PayPal Shopping cart (2). Copyright 2015.com All Rights Reserved To get more go to.com Page 30 of 54
10. Select the add product to cart action (1) and add a name for your item (2). Then enter a price (3) and a tax if you want but we leave the tax field empty. Enter a unique item number to track your sales in PayPal (4). Copyright 2015.com All Rights Reserved To get more go to.com Page 31 of 54
11. Set the number of the items to be added to the cart when the buy button is clicked (1). You can add a flat shipping charge, to be added to the payment. If specified, this flat amount is charged, regardless of the quantity of the purchased items. We enter 10 euro (2). When you re done, click OK. Copyright 2015.com All Rights Reserved To get more go to.com Page 32 of 54
12. We do the same for the rest of the products on our page. Now, let s preview the results. Copyright 2015.com All Rights Reserved To get more go to.com Page 33 of 54
Advanced: Different Options and Prices for your Products In this tutorial we will show you how to add different options with different prices for your products, using Sliding PayPal Shopping Cart 2. *You can also check out the video. Copyright 2015.com All Rights Reserved To get more go to.com Page 34 of 54
How to do it 1. We have a page, where we sell a nice picture. We d like to provide our users with different frame options for this picture. Each of the frame options will have a different price. In order to do that, open the insert menu (1), go to form (2) and choose select (3). Copyright 2015.com All Rights Reserved To get more go to.com Page 35 of 54
2. Now, let s set up our menu. Click on it (1) and change the default name to frame type (2). Copyright 2015.com All Rights Reserved To get more go to.com Page 36 of 54
3. We add 3 values from the plus button (1) - no frame, normal frame and luxury frame (2). The label and value for each of the items should be the same. When you re done, click OK. Copyright 2015.com All Rights Reserved To get more go to.com Page 37 of 54
4. Click on the buy button (1) and from the behaviors panel (2) open the shopping cart options, for this item (3). Copyright 2015.com All Rights Reserved To get more go to.com Page 38 of 54
5. We ve already entered the product price, number, etc. So, let s add our frame types now. Check the option 1 checkbox (1). Add a label for this option that will appear in the shopping cart (2). Open the value menu and choose the select list - FrameTypes that we added on our page (3). Copyright 2015.com All Rights Reserved To get more go to.com Page 39 of 54
6. From the option price tab (1), click add new button (2) and enter the values from the select menu. The first one is no frame (3). The price for this option will be 0 - as no frame will be added (4). Copyright 2015.com All Rights Reserved To get more go to.com Page 40 of 54
7. At the end, your option prices should look like this. Click OK when you re done. Copyright 2015.com All Rights Reserved To get more go to.com Page 41 of 54
8. Now, let s preview the result. Copyright 2015.com All Rights Reserved To get more go to.com Page 42 of 54
Advanced: Using the Discount Options in Sliding PayPal Shopping Cart 2 In this tutorial we will show you how to use the discount options integrated in Sliding PayPal Shopping Cart 2. *You can also check out the video. Copyright 2015.com All Rights Reserved To get more go to.com Page 43 of 54
How to do it 1. We already setup a page, where we sell several products. Now, we d like to add discount to one of them. Select the product buy button (1). Open the behaviors panel (2) and double click the control shopping cart behavior (3). Copyright 2015.com All Rights Reserved To get more go to.com Page 44 of 54
2. The Sliding PayPal shopping cart 2 options for the selected product appear. We will use the amount discount option (1). Add $2 discount for the first purchased item (2) and $1 discount for the additional items (3), added in the shopping cart. We limit the max items with a discount to 5 (4). Click OK when you re done. Copyright 2015.com All Rights Reserved To get more go to.com Page 45 of 54
3. Now, let s preview the results. Copyright 2015.com All Rights Reserved To get more go to.com Page 46 of 54
Advanced: Using the Shopping Cart with Dynamic Data In this tutorial we will show you how to use Sliding PayPal Shopping Cart 2 with dynamic data. In order to do that you ll also need HTML5 Data Bindings and Database Connector extensions. *You can also check out the video. Copyright 2015.com All Rights Reserved To get more go to.com Page 47 of 54
How to do it 1. We created a data source, using Database Connector and HTML5 Data Bindings. It returns the info for our products, such as name, price, shipping taxes, etc. from a database. We also created a repeat region that lists our products on the page. We placed a simple add to cart button, inside the repeat region. Now, select add to cart button (1) and from the behaviors panel (2) click add new behavior button (3). Copyright 2015.com All Rights Reserved To get more go to.com Page 48 of 54
2. From the menu (1), select Control Sliding PayPal Shopping Cart (2) and its dialog will appear. Copyright 2015.com All Rights Reserved To get more go to.com Page 49 of 54
3. Let s populate the products info, using the dynamic data picker icons. We start from the item name. Copyright 2015.com All Rights Reserved To get more go to.com Page 50 of 54
4. Select the database column, which returns your product names and click OK. Copyright 2015.com All Rights Reserved To get more go to.com Page 51 of 54
5. We do the same, for the rest of the info fields, which should use dynamic data. Copyright 2015.com All Rights Reserved To get more go to.com Page 52 of 54
6. Let s preview the results. Copyright 2015.com All Rights Reserved To get more go to.com Page 53 of 54
Video: Use Sliding PayPal Shopping Cart 2 on your Page With this movie we will show you how to insert Sliding PayPal Shopping Cart 2 on your page and set it up. Video: Different Options and Prices for your Products With this movie we will show you how to add different options with different prices for your products, using Sliding PayPal Shopping Cart 2. Video: Using the Discount Options in Sliding PayPal Shopping Cart 2 With this movie we will show you how to use the discount options integrated in Sliding PayPal Shopping Cart 2. Video: Using the Shopping Cart with Dynamic Data With this movie we will show you how to use Sliding PayPal Shopping Cart 2 with dynamic data. In order to do that you ll also need HTML5 Data Bindings and Database Connector extensions. Copyright 2015.com All Rights Reserved To get more go to.com Page 54 of 54