Product CategoriesCreate custom categories for all of the products you are authorized to sell.
Category Name |
No. of Products |
Last Modify Date |
|
Subscription-Based |
10 |
11/25/2020 |
|
Product Name |
MSRP (USD) |
Unit Price (USD) |
Billing Type |
|
One Drive For Business Plan 1SNX SKU# 4006192 |
6.00 |
4.94 |
Monthly |
|
One Drive For Business Plan 1SNX SKU# 4006192 |
6.00 |
4.94 |
Monthly |
|
One Drive For Business Plan 1SNX SKU# 4006192 |
12.00 |
9.94 |
Monthly |
|
One Drive For Business Plan 1SNX SKU# 4006192 |
12.00 |
9.94 |
Monthly |
|
One Drive For Business Plan 1SNX SKU# 4006192 |
18.00 |
14.76 |
Monthly |
|
|
Government |
10 |
11/25/2020 |
|
Product Name |
MSRP (USD) |
Unit Price (USD) |
Billing Type |
|
One Drive For Business Plan 1SNX SKU# 4006192 |
6.00 |
4.94 |
Monthly |
|
One Drive For Business Plan 1SNX SKU# 4006192 |
6.00 |
4.94 |
Monthly |
|
One Drive For Business Plan 1SNX SKU# 4006192 |
12.00 |
9.94 |
Monthly |
|
One Drive For Business Plan 1SNX SKU# 4006192 |
12.00 |
9.94 |
Monthly |
|
One Drive For Business Plan 1SNX SKU# 4006192 |
18.00 |
14.76 |
Monthly |
|
|
Hardware-based |
|
160 |
11/25/2020 |
|
Healthcare |
23 |
11/25/2020 |
|
Azure |
15 |
11/25/2020 |
|
Non-Profits |
12 |
11/25/2020 |
|
Small Business |
150 |
11/25/2020 |
|
Top Sellers |
230 |
11/25/2020 |
|
<!--Catalog Management Categories-->
<div class="storefront-rightbar catalog-management categories">
<h1 class="storefront-heading">Product Categories<span>Create custom categories for all of the products you are authorized to sell.</span></h1>
<div class="products-search">
<div class="search-input-col">
<i class="icon-cross"></i>
<i class="icon-search"></i>
<input type="text" class="form-control form-control-padding search-category" placeholder="Search by category name" autocomplete="off">
</div>
<button class="btn btn-outline openRtFly" data-flyout="createNewCat"><i class="icon-plus"></i> Create New Category</button>
</div>
<div class="categories-table">
<div class="list-view-tile summary-tab-table templates">
<table class="table custom-table adminTable">
<thead class="thead-light">
<tr>
<th scope="col" width="30%">Category Name</th>
<th scope="col" width="25%">No. of Products</th>
<th scope="col" width="25%">Last Modify Date</th>
<th scope="col" width="20%"></th>
</tr>
</thead>
<tbody>
<tr class="prod-row newCategoryRow" style="display: none;">
<td><span class="text-blue"><strong>Subscription-Based</strong></span></td>
<td>10</td>
<td>11/25/2020</td>
<td>
<div class="table-action-link">
<a href="javascript:void(0);" ><i class="icon-subscriptions"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void();" >
<div class="circle-link"><i class="icon-line-edit"></i></div>
</a>
<a href="javascript:void();"><i class="icon-circle-del"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void()" class="row-expand-icon" data-toggle="tooltip" data-placement="top" title="Expand"><i class="icon-arrow-bottom"></i></a>
</div>
</td>
</tr>
<tr class="addOnRow addon-shadow" style="display: none;">
<td colspan="4" class="p-0 border-0">
<div class="total-customer-col">
<div class="cutomer-container">
<div class="table-search">
<h1>Product List</h1>
<div class="products-search">
<div class="search-input-col">
<i class="icon-search"></i>
<input type="text" class="form-control form-control-padding ui-autocomplete-input" placeholder="Search by product name/SKU#" autocomplete="off">
</div>
<button class="btn btn-outline ml-auto openRtFly" data-flyout="addProducts">Add Product</button>
<button class="btn btn-outline del" data-toggle="modal" data-target="#alertModal" data-delete="delProd" ><i class="icon-delete m-0" data-toggle="tooltip" data-placement="top" title="Delete"></i></button>
</div>
</div>
<div class="customers-box">
<div class="customer-tabel-col pt-0">
<table>
<thead>
<tr>
<th class="th-col-1">Product Name</th>
<th class="th-col-2 text-right">MSRP (USD)</th>
<th class="th-col-3 text-right">Unit Price (USD)</th>
<th class="th-col-4 text-center">Billing Type</th>
<th class="th-col-5"></th>
</tr>
</thead>
<tbody tabindex="5" style="overflow-y: hidden; outline: none;">
<tr>
<td><span class="product-name">One Drive For Business Plan 1</span><span class="snx-sku">SNX SKU# 4006192</span></td>
<td class="text-right">6.00</td>
<td class="text-right">4.94</td>
<td class="text-center">Monthly</td>
<td>
<div class="sub-action-link"><i class="icon-line-edit"></i><i class="icon-delete"></i></div>
</td>
</tr>
<tr>
<td><span class="product-name">One Drive For Business Plan 1</span><span class="snx-sku">SNX SKU# 4006192</span></td>
<td class="text-right">6.00</td>
<td class="text-right">4.94</td>
<td class="text-center">Monthly</td>
<td>
<div class="sub-action-link"><i class="icon-line-edit"></i><i class="icon-delete"></i></div>
</td>
</tr>
<tr>
<td><span class="product-name">One Drive For Business Plan 1</span><span class="snx-sku">SNX SKU# 4006192</span></td>
<td class="text-right">12.00</td>
<td class="text-right">9.94</td>
<td class="text-center">Monthly</td>
<td>
<div class="sub-action-link"><i class="icon-line-edit"></i><i class="icon-delete"></i></div>
</td>
</tr>
<tr>
<td><span class="product-name">One Drive For Business Plan 1</span><span class="snx-sku">SNX SKU# 4006192</span></td>
<td class="text-right">12.00</td>
<td class="text-right">9.94</td>
<td class="text-center">Monthly</td>
<td>
<div class="sub-action-link"><i class="icon-line-edit"></i><i class="icon-delete"></i></div>
</td>
</tr>
<tr>
<td><span class="product-name">One Drive For Business Plan 1</span><span class="snx-sku">SNX SKU# 4006192</span></td>
<td class="text-right">18.00</td>
<td class="text-right">14.76</td>
<td class="text-center">Monthly</td>
<td>
<div class="sub-action-link"><i class="icon-line-edit"></i><i class="icon-delete"></i></div>
</td>
</tr>
</tbody>
</table>
</div>
<nav aria-label="navigation" class="pagination-col">
<span class="item-dropdown-col">
View
<div class="items-dropdown">
<i class="icon-arrow-bottom"></i>
<select>
<option>16</option>
</select>
</div>
<span class="view-text">Items Per Page</span>
</span>
<div class="pagination-holder m-auto">
</div>
<ul class="next-prev-page">
<li><a href="javascript:void(0);"><i class="icon-left-arrow-double mr-1"></i>First</a></li>
<li><a href="javascript:void(0);"><i class="icon-left-arrow mr-1"></i>Previous</a></li>
<li><span class="page-count">1 of 12</span></li>
<li><a href="javascript:void(0);">Next<i class="icon-right-arrow-b ml-1"></i></a></li>
<li class="last-page"><a href="javascript:void(0);">Last <i
class="icon-left-arrow-double pr-1"></i></a></li>
</ul>
</nav>
</div>
</div>
</div>
</td>
</tr>
<tr class="prod-row">
<td><span class="text-blue"><strong>Government</strong></span></td>
<td>10</td>
<td>11/25/2020</td>
<td>
<div class="table-action-link">
<div class="link-text-more moreMainDiv ml-auto">
<a href="javascript:void(0);" class="openMoreFly"><i class="icon-subscriptions" data-toggle="tooltip" data-placement="top" title="Copy Category" ><span class="path1"></span><span class="path2"></span></i></a>
<div class="text-more-flyout" style="display: none;">
<i class="icon-dropdown-arrow"></i>
<h6>Copy Category</h6>
<div class="temp-details">
<label class="mt-2">Template Name <span class="asterisk">*</span></label>
<div class="search-input-col">
<i class="icon-cross" style="display: none;"></i>
<input type="text" class="form-control form-control-padding " placeholder="Enter template name">
</div>
<div class="mini-flyout-footer-btns">
<input type="button" class="btn btn-outline ml-auto cancelCopy" value="Cancel">
<input type="button" class="btn btn-primary disabled createCopy" value="Create Copy">
</div>
</div>
</div>
</div>
<!-- <a href="javascript:void(0);" ><i class="icon-subscriptions" data-toggle="tooltip" data-placement="top" title="Copy Category"><span class="path1"></span><span class="path2"></span></i></a> -->
<a href="javascript:void();" >
<div class="circle-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i></div>
</a>
<a href="javascript:void();" data-toggle="modal" data-target="#alertModal" class="delete" data-delete="delCat"><i class="icon-circle-del" data-toggle="tooltip" data-placement="top" title="Delete Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void()" class="row-expand-icon" data-toggle="tooltip" data-placement="top" title="Expand"><i class="icon-arrow-bottom"></i></a>
</div>
</td>
</tr>
<tr class="addOnRow addon-shadow" style="display: none;">
<td colspan="4" class="p-0 border-0">
<div class="total-customer-col">
<div class="cutomer-container">
<div class="table-search">
<h1>Product List</h1>
<div class="products-search">
<div class="search-input-col">
<i class="icon-search"></i>
<input type="text" class="form-control form-control-padding ui-autocomplete-input" placeholder="Search by product name/SKU#" autocomplete="off">
</div>
<button class="btn btn-outline ml-auto openRtFly" data-flyout="addProducts">Add Product</button>
<button class="btn btn-outline del" data-toggle="modal" data-target="#alertModal" data-delete="delProd"><i class="icon-delete m-0" data-toggle="tooltip" data-placement="top" title="Delete All" ></i></button>
</div>
</div>
<div class="customers-box">
<div class="customer-tabel-col pt-0">
<table>
<thead>
<tr>
<th class="th-col-1">Product Name</th>
<th class="th-col-2 text-right">MSRP (USD)</th>
<th class="th-col-3 text-right">Unit Price (USD)</th>
<th class="th-col-4 text-center">Billing Type</th>
<th class="th-col-5"></th>
</tr>
</thead>
<tbody tabindex="5" style="overflow-y: hidden; outline: none;">
<tr>
<td><span class="product-name">One Drive For Business Plan 1</span><span class="snx-sku">SNX SKU# 4006192</span></td>
<td class="text-right">6.00</td>
<td class="text-right">4.94</td>
<td class="text-center">Monthly</td>
<td>
<div class="sub-action-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i> <i class="icon-delete" data-toggle="tooltip" data-placement="top" title="Delete Category"></i></div>
</td>
</tr>
<tr>
<td><span class="product-name">One Drive For Business Plan 1</span><span class="snx-sku">SNX SKU# 4006192</span></td>
<td class="text-right">6.00</td>
<td class="text-right">4.94</td>
<td class="text-center">Monthly</td>
<td>
<div class="sub-action-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i> <i class="icon-delete" data-toggle="tooltip" data-placement="top" title="Delete Category"></i></div>
</td>
</tr>
<tr>
<td><span class="product-name">One Drive For Business Plan 1</span><span class="snx-sku">SNX SKU# 4006192</span></td>
<td class="text-right">12.00</td>
<td class="text-right">9.94</td>
<td class="text-center">Monthly</td>
<td>
<div class="sub-action-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i> <i class="icon-delete" data-toggle="tooltip" data-placement="top" title="Delete Category"></i></div>
</td>
</tr>
<tr>
<td><span class="product-name">One Drive For Business Plan 1</span><span class="snx-sku">SNX SKU# 4006192</span></td>
<td class="text-right">12.00</td>
<td class="text-right">9.94</td>
<td class="text-center">Monthly</td>
<td>
<div class="sub-action-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i> <i class="icon-delete" data-toggle="tooltip" data-placement="top" title="Delete Category"></i></div>
</td>
</tr>
<tr>
<td><span class="product-name">One Drive For Business Plan 1</span><span class="snx-sku">SNX SKU# 4006192</span></td>
<td class="text-right">18.00</td>
<td class="text-right">14.76</td>
<td class="text-center">Monthly</td>
<td>
<div class="sub-action-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i> <i class="icon-delete" data-toggle="tooltip" data-placement="top" title="Delete Category"></i></div>
</td>
</tr>
</tbody>
</table>
</div>
<nav aria-label="navigation" class="pagination-col">
<span class="item-dropdown-col">
View
<div class="items-dropdown">
<i class="icon-arrow-bottom"></i>
<select>
<option>16</option>
</select>
</div>
<span class="view-text">Items Per Page</span>
</span>
<div class="pagination-holder m-auto">
</div>
<ul class="next-prev-page">
<li><a href="javascript:void(0);"><i class="icon-left-arrow-double mr-1"></i>First</a></li>
<li><a href="javascript:void(0);"><i class="icon-left-arrow mr-1"></i>Previous</a></li>
<li><span class="page-count">1 of 12</span></li>
<li><a href="javascript:void(0);">Next<i class="icon-right-arrow-b ml-1"></i></a></li>
<li class="last-page"><a href="javascript:void(0);">Last <i
class="icon-left-arrow-double pr-1"></i></a></li>
</ul>
</nav>
</div>
</div>
</div>
</td>
</tr>
<tr class="prod-row">
<td class="non-edit"><span class="text-blue"><strong>Hardware-based</strong></span></td>
<td class="editTd" style="display: none;">
<div class="search-input-col">
<i class="icon-cross" style="display: none;"></i>
<input type="text" class="form-control form-control-padding " value="Hardware-based">
</div>
</td>
<td >160</td>
<td>11/25/2020</td>
<td>
<div class="table-action-link">
<a href="javascript:void(0)" class="editTd cross-circle cancelEditing" style="display: none;"><i class="icon-cross-circle" data-toggle="tooltip" data-placement="top" title="Cancel Editing"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void(0)" class="editTd cross-circle saveRow" style="display: none;"><i class="icon-file-v1" data-toggle="tooltip" data-placement="top" title="Save"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void(0);" class="non-edit ml-auto"><i class="icon-subscriptions" data-toggle="tooltip" data-placement="top" title="Copy Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void();" class="non-edit editTemplate">
<div class="circle-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i></div>
</a>
<a href="javascript:void();" class="non-edit"><i class="icon-circle-del" data-toggle="tooltip" data-placement="top" title="Delete Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void()" class="row-expand-icon non-edit" data-toggle="tooltip" data-placement="top" title="Expand"><i class="icon-arrow-bottom"></i></a>
</div>
</td>
</tr>
<tr class="prod-row">
<td><span class="text-blue"><strong>Healthcare</strong></span></td>
<td>23</td>
<td>11/25/2020</td>
<td>
<div class="table-action-link">
<a href="javascript:void(0);" class="non-edit ml-auto"><i class="icon-subscriptions" data-toggle="tooltip" data-placement="top" title="Copy Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void();" class="non-edit editTemplate">
<div class="circle-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i></div>
</a>
<a href="javascript:void();" class="non-edit"><i class="icon-circle-del" data-toggle="tooltip" data-placement="top" title="Delete Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void()" class="row-expand-icon non-edit" data-toggle="tooltip" data-placement="top" title="Expand"><i class="icon-arrow-bottom"></i></a>
</div>
</td>
</tr>
<tr class="prod-row">
<td><span class="text-blue"><strong>Azure</strong></span></td>
<td>15</td>
<td>11/25/2020</td>
<td>
<div class="table-action-link">
<a href="javascript:void(0);" class="non-edit ml-auto"><i class="icon-subscriptions" data-toggle="tooltip" data-placement="top" title="Copy Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void();" class="non-edit editTemplate">
<div class="circle-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i></div>
</a>
<a href="javascript:void();" class="non-edit"><i class="icon-circle-del" data-toggle="tooltip" data-placement="top" title="Delete Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void()" class="row-expand-icon non-edit" data-toggle="tooltip" data-placement="top" title="Expand"><i class="icon-arrow-bottom"></i></a>
</div>
</td>
</tr>
<tr class="prod-row">
<td><span class="text-blue"><strong>Non-Profits</strong></span></td>
<td>12</td>
<td>11/25/2020</td>
<td>
<div class="table-action-link">
<a href="javascript:void(0);" class="non-edit ml-auto"><i class="icon-subscriptions" data-toggle="tooltip" data-placement="top" title="Copy Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void();" class="non-edit editTemplate">
<div class="circle-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i></div>
</a>
<a href="javascript:void();" class="non-edit"><i class="icon-circle-del" data-toggle="tooltip" data-placement="top" title="Delete Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void()" class="row-expand-icon non-edit" data-toggle="tooltip" data-placement="top" title="Expand"><i class="icon-arrow-bottom"></i></a>
</div>
</td>
</tr>
<tr class="prod-row">
<td><span class="text-blue"><strong>Small Business</strong></span></td>
<td>150</td>
<td>11/25/2020</td>
<td>
<div class="table-action-link">
<a href="javascript:void(0);" class="non-edit ml-auto"><i class="icon-subscriptions" data-toggle="tooltip" data-placement="top" title="Copy Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void();" class="non-edit editTemplate">
<div class="circle-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i></div>
</a>
<a href="javascript:void();" class="non-edit"><i class="icon-circle-del" data-toggle="tooltip" data-placement="top" title="Delete Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void()" class="row-expand-icon non-edit" data-toggle="tooltip" data-placement="top" title="Expand"><i class="icon-arrow-bottom"></i></a>
</div>
</td>
</tr>
<tr class="prod-row">
<td><span class="text-blue"><strong>Top Sellers</strong></span></td>
<td>230</td>
<td>11/25/2020</td>
<td>
<div class="table-action-link">
<a href="javascript:void(0);" class="non-edit ml-auto"><i class="icon-subscriptions" data-toggle="tooltip" data-placement="top" title="Copy Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void();" class="non-edit editTemplate">
<div class="circle-link"><i class="icon-line-edit" data-toggle="tooltip" data-placement="top" title="Edit Category"></i></div>
</a>
<a href="javascript:void();" class="non-edit"><i class="icon-circle-del" data-toggle="tooltip" data-placement="top" title="Delete Category"><span class="path1"></span><span class="path2"></span></i></a>
<a href="javascript:void()" class="row-expand-icon non-edit" data-toggle="tooltip" data-placement="top" title="Expand"><i class="icon-arrow-bottom"></i></a>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!--Catalog Management Categories-->