Documentation

Ucommerce includes full API reference documentation and lots of helpful articles to help you build your e-commerce site as effortlessly as possible.

Topics Payment Providers
v7.18

Setting up Ucommerce.Sitefinity.UI

  1. Setup a Sitefinity website through NuGet.
  2. Install Ucommerce.Sitefinity package from NuGet
  3. Install Ucommerce.Sitefinity.UI package from NuGet
  4. If upgrading from Ucommerce.Sitefinity 8.4.0 or 8.4.1: After installing Ucommerce.Sitefinity.UI run the console command: Update-Package -reinstall

Note about Ucommerce.Sitefinity.UI 1.0.3.20066

  • We noticed a case where the total of the mini cart widget doesn’t immediately update to the latest total upon adding to cart
  • Workaround: Programmatically refresh the page after adding to cart

Since we only use test data in this case, we need to do these two extra steps:

  • Go to Ucommerce>Settings>Security>Users and enter a user, and click save Save user in Ucommerce screenshot

  • Change the Payment method service to Default inside of the Settings>Orders>Payment Methods and add the AcceptURL link Change the Payment method service screenshot

  • Run the ScratchIndexer in Ucommerce>Settings>Search Run ScratchIndexer in Ucommerce screenshot

  • Disable Use Cached Controller Container Assemblies, by going into Sitefinity Settings>Advanced>Feather and remove the checkmark, and recycle the application. Feather settings in Sitefinity screenshot


Create Page Template called Ucommerce Template with Template: Left Sidebar, Header, Footer. Create template screenshot


Create pages with the Ucommerce Template called: Products, Cart, Address, Shipping, Payment, Confirm, Completed Create pages screenshot


Go to the Ucommerce Page Template and enter the editor

Put the Mini Basket widget in the header Put the Category Navigation in the left sidebar Template layout screenshot

Edit the mini basket to have Cart page point to >Cart< Edit mini basket screenshot

Edit the category navigation to have Product listing page point to >Products< Edit category navigation screenshot

Save and publish


Go to the Products Page Editor

Put the Products widget in Column 2 Put the Facets Filter in the Left Sidebar Products page layout screenshot

Edit the Products widget with Single product settings Show in existing page, that points to >Products< Edit products screenshot

Save and publish


Go to the Cart Page Editor

Put the Cart widget in Column 2 Cart page layout screenshot

Edit the Cart widget with Next Step Page to point to >Address<, and Product Details Page pointing to >Products< Edit cart screenshot

Save and publish


Go to the Address Page Editor

Put the Address Information in Column 2 Address page layout screenshot

Edit the Address Information widget with Next Step Page to point to >Shipping<, and Previous Page to point to >Cart< Edit address screenshot

Save and publish


Go to the Shipping Page Editor

Put the Shipping Picker in Column 2 Shipping page layout screenshot

Edit the Shipping Picker widget with Next Page to point to >Payment<, and Previous Page to point to >Address< Edit shipping screenshot

Save and publish


Go to the Payment Page Editor

Put the Payment Picker in Column 2 Payment page layout screenshot

Edit the Payment Picker widget with Next Page to point to >Confirm<, and Previous Page to point to >Shipping< Edit payment screenshot

Save and publish


Go to the Confirm Page Editor

Put the Basket Preview widget in Column 2 Confirm page layout screenshot

Edit the Basket Preview widget with Next Page to point to >Completed<, and Previous Page to point to >Payment< Edit confirm screenshot

Save and publish


Go to the Completed Page Editor

Put the Confirmation Message in Column 2 Completed page layout screenshot

Save and publish


You can now navigate to the website, and see the Ucommerce widgets in action! Going through the checkout flow will complete the order, and you will be able to see it in the Ucommerce back office.

Be aware that some of the default products and variants have no price, and the Marketing Campaign is giving sale on some of the products, this can all be manually changed in the back office.