nopCommerce Gift Card

[Disclaimer: this writing is based on nopCommerce 1.90]

nopCommerce by default supports gift card (both physical and virtual), where you can specify a product variant to be a gift card, and hence allow the gift card to be purchased. This approach is intuitive and doesn’t create a separate purchasing mechanism in the code, which is really smart.

Here’s the problem: Different physical gift cards might look different so we can use different products or product variants to present them, but with virtual gift card the only difference is really the price. If we wish to have just one-page for gift card and allow the customers to just select predefined prices it doesn’t have such dedicated page out-of-the-box. Basically we want it to have something like this: http://www.vivre.com/content/gift-card

To achieve this, we will have a gift card product with multiple product variants, where each product variant is a gift card and will have a different price.  Ultimately this is not a “problem” per se. What we need is simply a different “product template”. The steps here are high-level and adjustments shall be made to specific cases.

Step 1. Create a GiftCardVariant user control under ~/Templates/Products. This will become the template that the product will inherit.

Step 2. We need to have

  • The gift card form
  • Dropdown list for prices
  • Quantity, Add To Cart button, Add To Wishlist button

So create a separate user control for these or put them directly inside this GiftCardVariant template control (You would most likely also have the ProductInfo.ascx in there)

Step 3. Bind the Product Variants to the DropDownList, with ProductVariantId being the value.
Since it’s a product page a ProductID can be accessed from the query string, and thus product variants.

Step 4. In the OnClick event of the AddToCart button, add values extracted from the gift card form to the attributes.

int productVariantId = Convert.ToInt32(ddlVariants.SelectedValue);
int quantity = txtQuantity.Value;
string attributes = string.Empty;
string recipientName = txtRecipientName.Text.Trim();
string recipientEmail = txtRecipientEmail.Text.Trim();
string senderName = txtSenderName.Text.Trim();
string senderEmail = txtSenderEmail.Text.Trim();
string giftCardMessage = txtGiftCardMessage.Text.Trim();
attributes = ProductAttributeHelper.AddGiftCardAttribute(attributes, recipientName, recipientEmail, senderName, senderEmail, giftCardMessage);

Step 5. Use ShoppingCartService.AddToCart to add product variant to shopping cart

string sep = "<br />";
List<string> addToCartWarnings = this.ShoppingCartService.AddToCart(
    ShoppingCartTypeEnum.ShoppingCart,
    productVariantId,
    attributes,
    0,
    quantity);

For wishlist, the ShoppingCartTypeEnum is ShoppingCartTypeEnum.Wishlist. The key is to supply that method with the product variant ID, which is retrieved from the DropDownList.

Step 6. Do some error handling or display the success message .

By Bryan Xu

Tagged with:
Posted in .NET, eCommerce

Leave a Reply