WebStore Overview

The WebStore used to be released with the official release of mojoPortal but with the release of mojoPortal 2.6, it was made available as a separate download. This was done because the feature is lacking a lot of features people now expect from an ecommerce system. We have plans to either rewrite the current WebStore or develop a new add-on.

SuperFlexi aims to give end users much easier control over their content, even when that content might normally be quite complicated (as in the case of sliders, tables, structured or gridded HTML, and many other things). Possible uses for SuperFlexi are virtually limitless and we're really excited to be adding it as a core module in mojoPortal 2.6.

Whether you're a user or a developer, using SuperFlexi will almost entirely revolve around two things.

Current Functionality

  • Downloadable products
  • MS SQL and MySql are currently supported.
  • Currently, there is a simple Product List and an optional "Current Specials" list with links to add products to the cart. There is a product details page where more information about products can be shown.
  • Tax calculation
  • Several discount scenarios
  • Process payments through the Authorize.NET, PlugNPay, PayPal, and WorldPay payment gateways and customers can download immediately after purchase according to configurable download terms, i.e. how many downloads allowed, date range, etc.
  • Multiple stores within a site are supported but the payment gateways settings are at the site level so all stores would use the same commerce credentials in a given site. 
  • Users can log in and see their purchase history and download products for which the download ticket has not expired or been invalidated.
  • Sales Reports

Planned Improvements:

  • Product Creation Wizard
  • Shipping calculations and support for shippable product fulfillment tracking.
  • Product Categories and browse by category feature

How to Use:

  1. Download the latest WebStore release from GitHub.
  2. Copy the contents of the release zip file to the root of your mojoPortal installation.
  3. Browse to www.yourwebsite.url/setup/default.aspx
  4. Add the WebStore feature to a page the same as any other feature. It then exposes its administration links according to edit roles of the page or feature instance.

You have to configure eCommerce settings before you can actually process orders.

Note that the store administration allows configuring of products and offers. Products are not sold directly but through offers. Offers can contain 1 or more products. This allows bundling of products but makes configuration a little cumbersome so we're planning a product creation wizard.  Currently, in order to sell a Product, you must first create the product and then create an Offer to sell it in.

Skinning the WebStore

There is an optional Cart link control which can be added to the skin's layout.master to show a link to the WebStore's cart page with a count of items in the cart.

Skinning the WebStore is done primarily through theme.skin settings (Display Settings) and CSS.

Display Settings

First, open the theme.skin and add the following (check to be sure it's not already there). Then, you can make changes as necessary. default are shown

<%@ Register Namespace="WebStore.UI.Controls" Assembly="WebStore.UI" TagPrefix="webstore" %>

<webstore:WebStoreDisplaySettings runat="server" 
    UsejPlayerForMediaTeasers="true"
    UseAltCartList="false"
    EmptyCartFormat="<div class='alert alert-info'>{0} <a class='alert-link' href='{1}'>{2}</a></div>"
    ContinueShoppingLinkFormat="<a href='{0}' class='keepshopping store-cart-keepshopping btn btn-info'>{1}</a>"
    StartShoppingLinkFormat="<a href='{0}' class='store-cart-startshopping btn btn-info'>{1}</a>"
    ConfirmOrderLinkFormat="<a href='{0}' class='checkoutlink store-cart-confirmorder btn btn-success'>{1}</a>"
    LoginToCheckoutCssClass="store-cart-login btn btn-info"
    CartCheckoutActionsDivClass="row"
    CartCheckoutActionsEmptyCartOutsideTopMarkup=""
    CartCheckoutActionsEmptyCartOutsideBottomMarkup=""
    CartCheckoutDiscountDivCssClass="settingrow discountcode store-cart-discountcode"
    CartCheckoutLinksDivCssClass="settingrow checkoutlinks store-cart-checkoutlinks"
    CartCheckoutLinksDivOutsideTopMarkup=""
    CartCheckoutLinksDivOutsideBottomMarkup=""
    CartCheckoutLinksDivAnonymousExtraCssClass="store-cart-checkoutlinks-anon"
    CartCheckoutLinksDivAnonymousOutsideTopMarkup=""
    CartCheckoutLinksDivAnonymousOutsideBottomMarkup=""
    CartPayPalDivCssClass="settingrow paypalrow store-cart-paypal"
    CartPayPalDivOutsideTopMarkup=""
    CartPayPalDivOutsideBottomMarkup=""
    CartSubTotalFormat="<div class='settingrowtight carttotalwrapper storerow subtotal'><label class='settinglabeltight storelabel'>{0}</label> {1}</div>"
    CartTotalFormat="<div class='settingrowtight carttotalwrapper storerow total'><label class='settinglabeltight storelabel'>{0}</label> {1}</div>"
    CartDiscountTotalFormat="<div class='settingrowtight carttotalwrapper storerow discount'><label class='settinglabeltight storelabel'>{0}</label> {1}</div>"
    CartShippingTotalFormat="<div class='settingrowtight carttotalwrapper storerow shipping'><label class='settinglabeltight storelabel'>{0}</label> {1}</div>"
    AdditionalBodyClass=string.Empty
    ProductDetailsRatingPanelDivCssClass="productratingwrapper"
    ProductDetailsOffersDivCssClass="clearpanel offerspanel"
    AddToCartButtonCssClass="store-btn-addtocart btn btn-success"
    CartTableCssClass="cartgrid table table-bordered table-striped"
    OfferTableCssClass="offergrid table table-bordered table-striped"
/>