- This is a Razor template and it defines how the different elements on Order Feedback popup should be displayed at your mobile site.
- Customization is easy with Razor templates and you will be having complete flexibility during customization.
- For easy understanding, the Source Code and different elements of this template are displayed here.
- You can restructure the template, show/hide elements, modify the static content as per your merchandising requirements.
- Note: Customer places an order for the required products. Order will be delivered to customer in due course. Next time when the customer logs into the site, the order feedback notification will be prompted as shown in the screenshot.
- The popup can be a:
- Center popup in all the pages post login
- Tray popup with position right bottom in checkout pages
Source Code - Order Feedback for Web Site:
<div class="store-rating">
<div class="skip-link">
<a id="btnSkip" href="#">SKIP</a>
</div>
<div class="site-logo">
<img src="humarashop-logo.png" width="159" height="53" />
</div>
<div class="store-name">@Martjack.CurrentLocation.Name </div>
<div class="order-id">Order ID: @Martjack.User.CurrentOrderCollection[0].OrderID<span>(@Martjack.User.CurrentOrderCollection[0].OrderItems.Count Items)</span></div>
<div class="order-date">@Martjack.User.CurrentOrderCollection[0].OrderDate.ToString("d MMMM, yyyy hh:mm tt") </div>
<div class="rating">
<a href="#" class="blankrating SelectedRating" id="orderfb1" data-rating="1"></a>
<a href="#" class="blankrating SelectedRating" id="orderfb2" data-rating="2"></a>
<a href="#" class="blankrating SelectedRating" id="orderfb3" data-rating="3"></a>
<a href="#" class="blankrating SelectedRating" id="orderfb4" data-rating="4"></a>
<a href="#" class="blankrating SelectedRating" id="orderfb5" data-rating="5"></a>
</div>
<textarea id="txtComment" class="comment-box" placeholder="comment"></textarea>
<div class="submit-btn">
<a id="btnSubmitFeedback" href="#">SUBMIT</a>
</div>
</div> | Elements - Order Feedback for Web Site | ||
|---|---|---|
| Placeholder | Placeholder Type | Description |
| @Martjack.CurrentLocation.Name | Variable | Displays order location name |
| @Martjack.User.CurrentOrderCollection[0].OrderID | Variable | Displays the Order ID |
| @Martjack.User.CurrentOrderCollection[0].OrderItems.Count | Variable | Displays the count of order items |
| @Martjack.User.CurrentOrderCollection[0].OrderDate.ToString(“d MMMM, yyyy hh:mm tt”) | Variable | Displays the order date |
| rating | CSS Class | HTML div contains rating buttons |
| txtComment | Textarea ID | Text area used for giving comment on order |
| btnSubmitFeedback | ID of (anchor tag) | Button for submitting rating and comment |