Components of the Template

Introduction

This doc is intended to give a brief over view of the components of a Donation Store webstore template. It gives information on how certain components are laid out, but also explains how the templates work. The next sections will give an overview of the main parts of the template.

While you are free to design the template the way you'd like. Please try adhere to good UI standards, especially if this template is for the Marketplace. Follow rules like the F Shaped Pattern and Nielsen's Heuristics

Navbar

The navbar is the main focus point and source of information across all pages. While the content on the pages changes, the navbar itself doesn't really. Feel free to customise the look and structure of the navbar, but try to maintain the same level of information that is displayed on the default nav. For example, don't put the cart total at the bottom of the page.

The top most part of the nav shows the login status of the user and gives a link to where they can submit support tickets. This should be at the top or very visible to the user.

Next is the middle section with the home page banner. You can see that it also displays the currency and the cart total on the right hand side. This is important information and should be kept visible

Finally the main nav with the categories and packages. This is horizontal on the default template but can be displayed however you'd like

Content

For most of the pages, the content follows the template of the content on the left and the right hand side being a sidebar with the modules. The right hand side bar is a great place to put custom information about your store. You can follow this or invent your own way of displaying it.

It's worth looking at the HTML files provided in the default template because it shows you the correct way to layout your packages etc. so they follow the intended functionality of the webstore. You can use the default template as a reference

Footer

The footer of the webstore should show the year and the store with the Copyright symbol. Also, inline with our EULA you cannot remove the "Powered by Donation Store" text from the bottom of the store. If you feel that you would like to remove it, please contact us by opening a Support Ticket.

To remain GDPR compliant, make sure the Privacy Policy link is visible and easy to find. Along with the Terms and Conditions link. It's also good to have the language changer here, but this can be moved around the site, depending on where you think is the best place for it.

Modules

Modules are small pieces of independent functionality that can be placed throughout your webstore. Donation Store comes with some default Modules that can be used by you throughout your store.

Donation Store will render modules for you automatically and you can view what they look like in the modules folder in the default template. For more information on Modules, check out the Modules Doc, that explains each one individually.

Template Tags

Template Tags are Python functions that you can call from the frontend HTML. They are really useful for when you want to execute some sort of programming logic from the front end and receive the result. You can use the default template tags that come with Donation Store, or make your own. For each there is a doc that explains how both work. Check out the doc for Default Template Tags and the doc for Custom Template Tags/Functions