Knowledge Base

E-Commerce in Weebly

As we upgrade our Customer Portal to an optimized and easy-to-use design, you may find some hosting products and/or services no longer available. Due to this update, Weebly is no longer offered by HostGator for new signups. If you currently have the service, there will be no change to your Weebly website.

While E-Commerce in Weebly is easy to understand and use, it is complex enough to ensure that you will be able to provide your customers with an attractive and secure shopping environment. This article will show you how to:

How to Create a Store

To create a store on your website:

  1. Log into your Weebly Dashboard.
  2. Click the Store tab from the top menu.

    Weebly - Store Tab

  3. The Overview section will be displayed.

    Weebly Add a Store

  4. To complete the creation of the store, click the following settings for more information.

How to Configure Your Store

Once you're logged into your Weebly Dashboard, the Store section will provide you with different options to configure and customize your website. You will see features and options under the Store menu.


The Orders tab will show any orders placed through your site. The orders can be exported for certain date ranges and either as a CSV or Quickbooks file.

Orders can be searched via the customer's name, phone number, city, zip code, or order number. The filter next to the search will allow you to show only certain order statuses. The following is a listing of all of the statuses an order can have:

Status Item Type Description
Pending Physical Goods New order default status once an item has been purchased.
Canceled Services and Physical and Digital Goods The order has been marked as canceled.
Shipped Physical Goods Once the order has been prepped for shipping and tracking information has been logged.
Paid Services and Non-Physical Goods The default status for new orders with non-physical items.
Sent Digital Goods and Services For an item or service that was paid for. Digital goods have been emailed.
Ready Physical Goods Optional status informing customers that they can pick up their purchased items.
Completed Physical Goods and Services Service has been rendered.
Refunded Services and Physical and Digital Goods A refund has been issued to the customer.


To provide customers with a discount, you can create a coupon to apply a percentage discount, price discount, or free shipping (shipping rates must be set up first). All discounts are applied to pre-tax and pre-shipping rates.

Weebly - Coupons

To add coupons to your store:

  1. In the Coupon Code field, enter a unique code for your coupon. This will be what customers use to apply the discount at checkout. You can use a combination of letters, special characters, and numbers. What's great is that it's not case-sensitive!
  2. In the Number available field, you can set how many coupons are available and how long the coupon is active.
  3. Set if the coupon has an end date or if it will never expire. When an end date is added, the coupon will be valid until midnight of that date.
  4. Select the Coupon Type – percentage (%) discount, price ($) discount, or Free Shipping and then set the amount in the field below.
  5. Choose what will be discounted,
    • All Orders - Applies the coupon to any order that meets the date constraints.
    • Orders over a certain amount - Applies the coupon to orders to the specified amount. For example, if the discount amount is set to $50, any orders that are $50 will be able to use the coupon.
    • Specific Categories - Applies the coupon to orders.
    • Specific Items - Applies the coupon to orders that have certain item(s). The coupon cannot be selected for SKUs or items with an item's options.
  6. Click Save.


The Items tab allows you to manage your store's items. Here are the submenus found in this tab.

Item Library

  • Import Items - This allows you to import items via a CSV file, Etsy, or Shopify Store.

    Weebly - Import Item

  • Add Item - This allows you to enter your item's information.

    Weebly - Add Item

  • To add items to your store:
    1. Click Add Item.
    2. Enter a name for your Item.
    3. Provide a description of the item.
    4. To the right-hand side, the option to add photos of the item is displayed.
    5. Scroll down to select the type of item, Physical, Digital, or Service. Define the settings below:
      • Price
      • Sale Price (Optional)
      • Visibility
      • Shipping Weight (Optional - Only available for Physical)
      • Sales Tax
      • SKU (Optional)
      • Track Inventory
      • Download Limit (Only available for Digital)
    6. Add the item to any category.
    7. Next, add in any Item Options.
      • For Digital Items, an Uploader will appear at the bottom.
    8. Configure the Search Engine Optimization (SEO) for an item:
      • Item Permalink (Optional)
      • SEO Title
      • SEO Description


To add new categories to your store:

  1. From the Items tab on the right-hand menu, select Categories.
  2. Click the Add Category button.
  3. On the next page, give the category a name, add an image, and add any items.
  4. Select a layout for the category page. SEO information can be added to the category (optional).Weebly Add Category

Gift Cards

This is a great marketing tool that allows you to advertise your store more.

Note: To enable the Gift Cards feature, your Weebly plan must either be Pro or Business.

To use the Gift Card feature:

  1. Under the Items section, click Gift Cards.
  2. Click the Enable button found in the top right corner.
  3. Input the name of the gift card, custom amounts, description, categories, and images.
  4. Once done, republish your site to see the new gift card option.

    Weebly - Items Tab - Gift Cards


This section allows the customers to leave ratings and reviews of items.

To enable this feature:

  1. From the Items tab, select Reviews.
  2. Click Enable in the top right-hand corner.
  3. Next, you can set how long of a timeframe passes before the request for review email is sent to the customer.

    Weebly - Leave Reviews

To change the look of the review email, navigate to the Store Emails tab.

Store Emails

The Store Emails tab allows you to specify what email address Weebly should show to your customers when they receive an email from the store and what email address you should be notified of upon any new orders.

Store Emails

To edit the store emails:

  1. Under the Email Previews section, click the ellipsis icon (…) on the right side of the order or item status.
  2. Select Edit Email from the options.
  3. You will have options to Add a Footer Message or Add a Header Message and also to Send a Test Email.


The Setup tab will let you configure your Weebly store, its' settings, and how it looks. The submenus can be found under the Setup tab.

Item Settings

Weebly - Item Settings

  • Layout - This is the section where you can customize the appearance of your Weebly store.
  • Item Status - This is where you can set up the status of your items.
  • Stock Settings - This serves as an inventory tool that tracks the changes in your inventory that are not related to sales.
  • Gift Options - This allows the customers to add gift messages and gift wraps. 


To associate your merchant processor account with Weebly:

  1. Navigate to Setup, then click the Checkout tab.
  2. Click Connect to the right of your preferred merchant.

    Weebly Checkout Page

  3. Next, you will be prompted to either create a new account or log in to an existing account with the selected merchant.
  4. The next sections will allow you to set up Store Policies for returns and shipping and then Checkout Options to toggle fields on the checkout page.


The Shipping tab allows you to set up your shipping address and add your own shipping rules. Please follow the steps below to complete your Shipping Setup.

Setup - Shipping
Step 1:

To set up your store's shipping address:

  1. Go to the Shipping Address section.
  2. Click  Add Shipping Address on the right-hand side.
  3. Fill up the necessary fields. Here, you can select to use the address listed in the setup or add a new address.
  4. Click Save.

Step 2:

To set up your store's shipping rules:

  1. Go to the Add Shipping Rule section.
  2. Select the country or continent from the dropdown menu.
  3. Once the selection has been added, click Edit to expand or narrow down the shipping area. Repeat the process to add more countries to the listing.

Step 3:

  1. Once the shipping area has been defined, click Add Rate at the top right of the pop-up to specify how the shipping rates will be calculated and applied.

    Weebly - Add Rate

  2. Select one of the following shipping rate options from the dropdown.
  • Order Price - Set a minimum and maximum order price range and its shipping rate.
  • Order Weight - Set a minimum and maximum order weight and its shipping rate.
  • Quantity - Set a minimum and maximum order quantity and its shipping rate.
  • Flat Rate - Set shipping rate per item or order.
  • Free Shipping - Set free shipping by price or weight. 


This is the section where you can add your tax rate to calculate your store's taxes. Important Note: Please make sure that your physical store address is correctly listed. You can check that out in the Store Information ⤵ section.

Weebly Add Taxes

To add the tax rates for each country that you will ship to:

  1. Click the Add Tax Rate button.
  2. Select the country from the dropdown menu.
  3. Manually add in the country tax rate and tax name to be displayed.
    • For the United States, automatic tax calculations are available.
  4. Click Save in the right-hand corner of the pop-up.

Tax calculation settings are used to determine if taxes are included in the item price and if taxes should be charged on shipping rates.


  • Store Information - Add your company information here to be used for shipping and to be displayed in store emails.

    Setup Tab - Store Information

  • General - Defaults for the store, such as currency, units, and shopping cart options.

    Weebly - General Settings

  • Tracking - Add Google Analytics code to track visitors.

    Weebly - Tracking

E-Commerce Elements

The Weebly Build tab has several different elements to use to display items on the site. Here are the elements under the E-commerce section.

Weebly - E-commce Icons

Products (Multiple Items)

To display several store items on the website's page: 

  1. Under the Build tab, locate the Products icon under the Ecommerce menu.

    Weebly - Products Element

  2. Drag and drop the Products element on the page.
  3. In the selection window, select the item(s) by clicking its checkbox.
  4. Once your preferred items are selected, click Select Products in the top right corner of the pop-up window.

    Weebly - Products - Select Product

    Note: If there are no saved items yet, you will be prompted to add new items first. Please do so by clicking the Add Products to Store button.

    Weebly - Products - Add Product

  5. Once you click the Select Products link, a new pop-up window will appear for the layout options.

    Weebly - Build - Choose Layout

  6. Select your preferred layout, then click Done.

To manage the products:

  1. Click the Products element in your workspace.
  2. A pop-up window will appear, showing you different options to customize your products.

    • Manage Products- Add or remove items from showing. Change the priority of the items and view the item in the store.
    • Change Layout - Select a different layout for the items.
    • Columns - Change how many columns are shown.
    • Display Options - Use this to change the following settings:

      • Image Options - Use to toggle the item image display and the aspect ratio.
      • Button Options - Use to toggle the button display and modify the button text and the style of the item button.
      • Name - To toggle the display of the item name.
      • Price - To toggle the display of the item price.
      • Short Description - To toggle the display of the item name.
      • Information Placement - Use to change how the item text displays.
    • Pagination - Update what is displayed for multiple item pages and how many items are sown per page.


The Categories store element will display all of the categories that are selected from the pop-up.

To display the categories on the website's page:

  1. Under the Build tab, drag and drop the Categories element on your workspace.

    Weebly - Categories Element

  2. In the selection window, all current Categories and subcategories will be displayed.
    Note: If there are no saved categories yet, you will be prompted to add new categories first. Please do so by clicking the Add Categories button.

    Weebly - Build - Add Category
  3. Select the preferred category by clicking its checkbox.

    Weebly - Category List

  4. Once done, click Select Categories in the top right corner of the pop-up window.
  5. After the categories are added, choose a layout for the category display.
  6. Click Done once the preferred layout is selected.

To manage the categories:

  1. Click on the Category element in your workspace for the settings pop-up.
  2. A pop-up window will appear where you can manage the item categories, change the layout, modify the columns shown, update the display options for images, buttons, information, and the pagination for multiple category pages. 

Product (Single Item)

Placing the Product element in your workspace will show only a single item.

To manage your product:

  1. Click the Product element in your workspace.

    Weebly - Build - Single Product

  2. A pop-up window will appear, providing you with options to make several changes to your product element.

    Weebly - Build - Single Product

    • Button Type - Allows you to change the button in the element to either "Add to Cart" or "Buy Now."
    • Button Size - Allows you to change the button size to large or small.
    • Spacing - This allows you to change the padding above and below the item.
    • Advanced - Allows you to select whether or not your item image, description, or price will be displayed in this element.

Once you publish your changes, the elements will start to function, and the buttons in the elements will allow your customers to add items to a cart or purchase immediately.

Did you find this article helpful?

* Your feedback is too short