No replies to this topic

[Kess]

Shopping cart

 

The cart is based on the item submission forms. We use heavily modified forms of the standard ZOO. This allows us to use various field types in the form (strings, radio, checkboxes and even attach files). All of them will go through validation like in an usual item submission form.

 

We'll review the cart configuration from the start. We'll make something similar to the cart on a demo site.

 

1. Firstly, you need to make a separate JBZoo application (new tab).
   For your convenience, you can give it an "orders "alias.
   All orders from the cart will be saved here.
    
2. Create a new submission in this application:
   - Make it published
   - Disable item edit
   - Access level - public
   - In the "Types" section select an "Order Form" for the "Order" type
   
   
   
    
3. Go to the "Config" and select the "Cart" tab. Set these parameters:
   - Enable cart - yes. It allows this application to accept new submissions from the website.
   - JBPrice Advance - you must enable this option if you are using JBPrice Advance element for your prices.
   - Only authorized - as you wish.
   - Submission form - choose the one that was created in the previous step.
   - Template order form - it is better to choose preinstalled "Order / Order Form".
   - Currency - default currency.
   - Administrator email - notifications will be sent to this email when there are new orders.
   - Element for user email - if you have an "E-mail" element in your "Order" type, you can use it to send notifications to anonymous users.
   - Email templates - email layouts, you can leave it as default.
   
   Other settings are optional. You can read their descriptions in the tooltips.
   So the application is now configured as a shopping cart.
   It's better not to use it for any other purposes or item types, or else it will become messy.
   
   
   
    
4. Enabling cart module
   Go to the module manager and create a new "JBZoo Cart" module or use an existing one. This module displays cart information and a link to the cart page.
   In the basic settings specify these parameters:
   - Application - choose the one that we created earlier (Orders).
   - Choose a currency
   - Choose a menu item where cart items will be displayed. It is useful for managing modules on the cart page.
   
   Template settings are optional and self-explanatory. Don't be afraid to try them and see what is better for you.
   Also, don't forget to publish this module and put it in some position and choose menu assignment.
   
   
   
    
5. Configure Order templates layouts (optionally)
   It is important to remember about "JBZoo Cart Items" element. While invisible for the frontend, it is displayed during item editing (with an "Order" type). It plays an important role of saving selected products to a database. Then it displays them in the admin panel.
   
   You can edit elements and template layouts here:
   "Cogwheel" -> JBZoo App -> Order
   
   
   
   Also you can edit template files located in this folder:
   media/zoo/applications/jbuniversal/templates/catalog/renderer/item/order
   
    
6. Add "JBZoo Price - Advance" to an item type of your products
   Set a default currency and don't forget to choose a mode that has "add to cart" functionality (pop-up window, for example).
   
   "Edit fields":
   
   
   "Full":
   
   
   You can read more about the price configuration here.
   
    

Now you have a shopping cart functionality.

Orders are saved in their application, emails are sent to an administrator and a buyer (if he is logged in or specified his email during check-out.

 

 

Payment systems

 

There are two payment receiving services that are natively supported by JBZoo: Robokassa and Interkassa. In this tutorial we'll describe the cart configuration for the first one.

 

Attention!

In order to test a payments system, your website must be accessible from the Internet. It should not be on a localhost.

And it should be opened to anonymous users. Otherwise, the payment robot will be unable to pass successful payment information to your website.

 

 

JBZoo configuration

 

Before enabling payment systems, make sure that your cart is set up and working properly.

 

Also, make sure that an order form has "JBZoo Cart Items" element:

 

 

Now go to the cart configuration of your orders application.

 

 

Enable payment systems and Robokassa.

 

Apply settings and press "Get the link to API". You'll need these links to configure payment system from their side.

 

You'll fill "Login", "Password 1" and "Password 2" a bit later, after setting up a Robokassa account for your shop. 

 

 

Robokassa

 

Useful links:

• Official website
• Terms of service
• Tariff rates and payments methods
• Tech support
• Registration

 

Create a new Merchant account. Log in and go to the "My shops" page. Add a new shop here. Remember the "Shop ID" field, you will set it as "Login" in your cart configuration.

 

 

After you add a new shop, click on its name and go to the "Technical Preferences":

 

 

"Password #1" and "Password #2" should be at least 8 characters long with at least one letter and one digit. Don't forget to input these passwords in your JBZoo cart configuration as well.

 

Now you should copy the links that JBZoo generated into the corresponding fields.

You must choose "POST" method for every url.

 

Now you can test your payment system.

 

 

Testing

 

Enable debug mode for Robokassa in JBZoo cart configuration. During a debug mode money is not used but the behaviour of the payment robot is completely emulated.

 

Create an order on your website and press "Checkout". If configured everything right, you'll be redirected to the payment page:

 

 

Press "Go to the payment system" and you should be redirected to the Robokassa test page. Try pressing first "Go" button. If everything is correct, you'll get a server response:

 

 

Also try other buttons.

The second one emulates behavior for a successful payment and the third one - for an unsuccessful.

 

If you'll get an error, check all configuration of your website and Robokassa.

 

Attention!

Keep in mind that debug mode works only until you activate your shop in Robokassa.

After you activate a shop, you'll be unable to change its domain there.

 

 

If a payment was successful, you'll see that an order is marked as "Paid":

 

 

If a user is registered, he'll see something similar as well:

 

 

 

 

 

That's it. Now you know how to make a shopping cart with JBZoo and how to configure a payment system.

 

There will be native support of additional payment systems in the future releases of JBZoo so it will be even easier for you to accept payments.

 

 

If you have any questions or encountered a problem, feel free to ask about it on the forum.

Edited by SmetDenis, 07 October 2013 - 21:04.