My Online Store | Retail Systems User Guides

My Online Store is a website product offered for myPOS customers which allows them to sell their products from their existing POS systems online.

Many features of the online store can be managed from the Control Panel Admin (cp-admin) and this guide is designed to explain how to perform a number of important tasks in keeping your website up-to-date.

Continue on through this guide and how to get the most out of your online store

To access the control panel for your My Online Store, simply navigate to your website with /cp-admin at the end of the address. For example if your website's address was www.localbottleshop.com.au your admin panel could be accessed through www.localbottleshop.com.au/cp-admin.

From here you will need to use your login credentials provided by your myPOS representative, which will include a username and password combination.

From the admin panel you can change a variety of settings and styles for your website, including but not limited to:

Shop Opening Times
Shop Name
Shop Accent Colour
Font Slider Images
Navigation Bar

This section will help you get started and learn the basic functionality of using the Admin Panel

To access the Admin Panel for your website you must first Login using your administrator username and password.
To Login follow these steps:

Enter your Username Marked 1
Enter your password Marked 2
Click Login Marked 3

Figure 4.1 - Login Interface

Locations of Username (1), Password (2) and Login Button (3)

It is important to Log Out from the Admin Panel when it is not in use to help keep your website secure.
To Log Out follow these steps:

Click the User button in the Top Right Corner Marked 1

Figure 5.1 - User Menu

Location of User Menu (1)

This reveals the User Menu, click the Log Out button Marked 2

Figure 5.2 - Logout Button

Location of Logout Button (2) within User Menu

You will now be returned to the Login screen seen in section Logging In

To navigate around the Admin Panel you can use the Navigation Sidebar located on the left side of the screen.
The navigation is divided into groups based on use case, and those groups consist of links, some of which contain sublinks.
By clicking on a link it may take you to a page or reveal sublinks depending upon whether there is a small arrow to the right of the link's name.

Figure 6.1 - Navigation

Location of the Navigation Menu (1)

The Navigation section is divided up into:

General

The Dashboard - Showing useful statistics
Shop Settings - Allowing you to change displayed information for your online store

CMS - Content Management System

Pages - Edit Pages, Navigation and Images
Widgets - Edit Sliders & News and create custom widgets
Style - Edit colour and layout settings

Support

Support - Send support tickets to the support team
Documentation - Access this very document

Customers

Members - View site members; your customers
Loyalty - Access and edit information regarding loyalty points

My Online Shop

Website Sales - Track Sales, Edit Email Messages and Payment Options
Payment Gateway - Toggle and Edit different payment methods
Products - Edit Products, Departments, Sales and more
Shipping - Edit Shipping details and options

Note: Some sections may not be visible depending upon what functionality is available to you

To Edit your store's details click the Store Settings navigation button on the Navigation Menu to the left.

Figure 7.1 - Store Settings Link

Location of the Shop Settings Link (1)

The Store Settings page will appear, from here you can choose a specific Settings Category (Marked 2) by clicking on it.

Once clicked that relevant category will appear within the View Pane (Marked 3).

From the View Pane relevant settings can be changed and once changed the must be saved with the Save Button (Marked 4)

Figure 7.2 - Store Settings Page

Store Settings Submenu (2), Store Settings view pane (3), Save Settings Button (4)

To create a unique online store you can differentiate with styling and colours. To access this click the Style Navigation Button (Marked 1) on the Navigation Menu.

This will reveal the Style Submenu Items (Marked 2) which contain subcategories for editing different sections of the website.

Figure 8.1 - Styling Navigation Link

Style Link on the Navigation Bar (1), Style Sublinks (2)

Each Sublink leads to a page to edit relevant style settings, containing different types of input including:

Toggle Switches (Marked 3)
Colour Input (Marked 4)
Colour Picker (Activated by clicking in the Colour Input) (Marked 5)
Image Uploader (Marked 6)

To save your changes to be live on the website click the Save Button (Marked 7).

Figure 8.2 - Header Styling Settings

Toggle Switch (3), Colour Field (4), Colour Picker (5), Image Upload (6), Save Button (7)

For more information on styling options see Styling Options

To change the contents of a page within the website you must natigate to the Pages section by clicking the Pages Navigation Link (Marked 1) and the Pages Navigation Sublink (Marked 2).

The Pages section shows all pages in a table. To edit a page, find it's corresponding Row (Marked 3) and the associated Edit Link (Marked 4).

Figure 9.1 - Navigating to Pages Section

Pages Navigation Link (1), Pages Navigation Sublink (2), Page Row (3), Page Row Edit Link (4)

Within the Edit Page Section there are a variety of settings, including the Page Metadata (Marked 1) and the Page Contents (Marked 2) in List View.

Once settings have been changed the Update Button (Marked 3) can be used to update the page and save all changes.

Below the Update Button are the SEO Details (Marked 4).

Figure 9.2 - Edit Page Section

Page Metadata (1), Page Content View (In List View) (2), Update Page Button (3), SEO Settings (4)

The Page contents List View shows the contents of the page in terms of Widgets, which make up the entirety of a normal page.

Widgets can be dragged from the Saved Shortcodes List (Marked 1) section into the Current Page List (Marked 2) to have them display on the page.

To remove a widget from the page drag it to the Remove Drop Area (Marked 3) where the widget will be removed from the page. This will only remove the widget from displaying on that particular page, and can easily be replaced by dragging it back in from the saved shortcodes list.

Clicking the yellow HTML View Button (Marked 4) will allow you to toggle between the current simple List View and the advanced HTML View.

Figure 9.3 - Edit Page List View

Saved Shortcodes/Widgets List (1), Current Page List (2), Remove Drop Area (3), List View/HTML View toggle (4)

Alternatively the HTML view can be used to directly edit the page contents using HTML, however this is only recommended for advanced users with experience in both HTML and the Bootstrap 4 library.

The Text Editor (Marked 1) is used to edit the page in a text format, using the Source (Marked 2) button will display the page contents in a HTML format. To insert widgets into the HTML you can simply copy their shortcode from the Shortcodes Menu (Marked 3), and paste it where you wish within the HTML.

Figure 9.4 - Edit Page HTML Editor View

HTML Editor (1), Source Button (2), Shortcodes Menu (3)

To Edit News articles navigate to the News Page by clicking on the Widgets Navigation Link (Marked 1) and then click the News Navigation Sublink (Marked 2).

On the News Page there are rows for each News Article (Marked 3) containing a glace at data for that article. To edit the Article click the Edit Link (Marked 4) and to delete click the Delete Link (Marked 5).

To add a new news article click the Add News Button (Marked 6) and to search news articles type in the Article Search Field (Marked 7).

Figure 10.1 - News Page

Widgets Navigation Link (1), News Navigation Sublink (2), News Article Row (3), News Article Edit Link (4), News Article Delete Link (5), Add News Button (6), Search News Articles Field (7)

Once editing a news article you can add an image using the Image Picker to choose an image from your gallery (see Uploading Images)

WARNING: Slideshows have been integrated into the new Widgets System, see Editing Widgets for information on changing slideshows.

To edit the images shown on a slider you must first navigate to the sliders page through the Widgets Navigation Link (Marked 1) and then the Sliders Navigation Sublink (Marked 2).

Once you reach the Edit Sliders Page you can find the relevant slider's Row (Marked 3) and to edit click the Edit Slider Link (Marked 4).

If you wish to create a new slider you can click the Add Slider Button (Marked 5) in the upper right corner.

To search sliders by name simply use the Search Sliders Box (Marked 6).

Figure 11.1 - Edit Sliders Page

Widgets Navigation Link (1), Sliders Navigation Sublink (2), Slider Row (3), Slider Edit Link (4), Add New Slider Button (5), Sliders Search Box (6)

From the Slider Edit Page you can rename the slider using the Slider Name Field (Marked 7), add a new image to the slider with the Add Slider Image Button (Marked 8) and edit Slider Images with each Slider Image Row (Marked 9).

From within the Slider Image Row you can add an optional Slider Image Title (Marked 10), an optional Slider Image Link (Marked 11) and the Image Url (Marked 12).

Slider Images can also be deleted using the Delete Slider Button (Marked 13).

Figure 11.2 - Edit Sliders Page

Slider Name Edit Field (7), Add Slider Image Button (8), Slider Image Row (9), Optional Image Title (10), Optional Image Link (11), Image Url (12), Delete Image Button (13)

Most often sections that require an image will provide an select image Button which will bring up the Image Selection Overlay, allowing for the uploading and selecting of images.

To Upload an image either drag an image onto the File Drop Zone (Marked 1) from File Explorer in Windows or Finder in macOS. Alternately you can click the File Drop Zone to choose a file manually.

Once a file has been uploaded it can be selected from the overlay by its Image Preview (Marked 2) and that photo's location will be automatically pasted into the relevant field.

Figure 12.1 - Image Selector Overlay

Upload Drop Zone (1), Image Preview (2)

Alternatively images can be uploaded through the Gallery Page by clicking the Pages Navigation Link (Marked 1) and then the Gallery Navigation Sublink (Marked 2).

To Upload an Image click the Upload Image Button (Marked 3), which will reveal a page which instructs to drag an image in from a Windows Explorer or macOS Finder window.

Each Image has its own Image Card (Marked 4), which contains a thumbnail of the image along with Image Actions (Marked 5), which are Copy File Location, Delete Photo and Preview Full Resolution respectively.

Figure 12.2 - Gallery Page

Pages Navigation Link (1), Gallery Navigation Sublink (2), Upload Image Button(3), Image Card (4), Image Actions (5)

To Navigate to the Calendar click on the Widgets Navigation Link (Marked 1) and then the Calendar Sublink (Marked 2)

Figure 13.1 - Navigating to Calendar Editor

Widgets Navigation Link (1), Calendar navigation sublink (2)

The calendar section contains three sections for different tasks.

The Create Event Box (Marked 1) is used for generating new events before dragging them onto the calendar

The Edit Event Box (Marked 2) is used for editing the name and description of existing events.

The Calendar (Marked 3) is where events are shown in a calendar format and can be moved and edited from there.

Figure 13.2 - Calendar Screen Overview

Create Event Box (1), Edit Event Box (2), Calendar Pane (3)

Within the Event Create Box there are fields to add data to your event before adding it to the calendar.

The

Figure 13.3 - Creating Event

Event Title Field (1), Event Description Field (2), Generate Event button (3)

Figure 13.4 - Adding Event to Calendar

Draggable Event (1), Day of Calendar (2)

To Submit a support ticket to the Support Team, you can do so by navigating to the Support page. Do so by clicking the Support Navigation Link (Marked 1).

On the support page there is the Support Tickets Table (Marked 2) which contains your support ticket history. From here you can click the View Ticket Button (Marked 3) to view ticket history.

To open a new ticket click the Open Ticket Button (Marked 4).

Figure 14.1 - Support Page

Support Navigation Link (1), Support Tickets Table (2), View Tickets Button (3), Open Ticket Button (4)

On the open ticket page you can create a new support ticket by inputting the relevant information.

The Support Ticket Information Fields (Marked 1) can be filled with relevant information and contact details.

Optionally the Upload Screenshot Buttons (Marked 2) can be used to upload screenshots of problems if deemed necessary. Screenshots can be acquired in different ways, one of which is using the Windows Snipping Tool.

You may need to check the Agree Button (Marked 3) if you have exceeded 3 support tickets within a month, as this may incur a fee depending upon the ticket.

Finally click Submit Ticket (Marked 4) to send off the ticket, the support team will be notified and will attempt to respond as soon as possible.

Replies for the ticket can be viewed by clicking View in the tickets page.

Figure 14.2 - Open New Ticket

Ticket Information Fields (1), Optional Screenshot Upload Fields (2), Potential Agree Checkbox (3), Submit Ticket Button (4)

On the Ticket View page the Ticket Information (Marked 1) is shown alongside a Reply Field (Marked 2) which allows you to have back-and-forth between you and the support team.

The messages from the ticket are shown in the Ticket History (Marked 3).

Figure 14.3 - Support Replies Page

Ticket Details (1), Reply Form (2), Ticket History (3)

Navigate to Website Sales > Sales on the side navigation bar to bring up all website sales.\

The Sales View Page allows for viewing of the most recent sales (1), viewing them and their details (2), searching through all sales (3) and navigating through the pages containing sales (4).

Figure 15.1 - All Sales View

(1) Sale Row, (2) View Button, (3) Sales Search, (4) Sales Page Links

By viewing a sale the various aspects of that sale can be seen. The Customer's Details (1) as entered when they checked out, the customer's Payment method of choice (2), the freight choice (3) and any other information relevant to the order (4).

The order's status and tracking information (5) can be updated from here. While orders should be updated from a myPOS terminal, this allows for the easy updating of statuses if a myPOS terminal is currently unavailable.

Below the sale information is a copy of the Invoice emailed to the customer (6) and a button allowing for the downloading of a PDF invoice (7).

Figure 15.2 - Viewing Sale

(1) Customer Details, (2) Payment Details, (3) Freight Details, (4) Order Details, (5) Update Status and Tracking, (6) Copy of Invoice, (7) Create Printable PDF for invoice

To Edit the navigation bar you first navigate to the Pages Navigation Link (Marked 1) and then the Navigation Sub Link (Marked 2).

This will reveal the Navigation editing page.

Figure 16.1 - Navigation Location and Menus

Pages location in navigation (1), Navigation sublink (2), Navigation organisation menu (3), navigation item editing and updating menu (4)

In the 'Website Main Menu' window the order of the links can be changed either by clicking and dragging to move each row or by using the Up and Down Buttons (Marked 1).

To show or hide child elements of navigation menu items you can click the Green +/- Button (Marked 2) next to the link's name. Links can be made into child elements either by dragging them into the child position underneath their proposed parent or by using the Parent and Unparent Buttons (Marked 3). Note that navigation links that are grandchildren (nested two deep) will not appear on the website.

The Links themselves can be modified and deleted using their respective Modify and Delete Buttons (Marked 4).

Any changes made to the navigation layout must be saved with the green Save Button (Marked 5).

Figure 16.2 - Editing and Organising Window

Movement Arrows (1), Reveal Sublinks (2), Make Child and Make Subling Buttons (3), Edit and Delete Buttons (4), Save Button (5)

The Add / Edit Menu Item window can be used to either update or create a new link for the navigation bar.

This window has a number of Fields for information to be used by the navigation link within the navigation bar, they include:

Menu Type - Either Page or Custom. Page type allows for the use of a preexisting page while custom type allows for the use of a custom URL within the website (e.g. Contact)
Page - Used only for Page type links, this provides a list of pages to link to within the website
Text - The displayed text which shows on the navigation bar
Icon (Marked 2) - Allows you to choose from a selection of icons to be displayed on the navigation bar alongside the text
URL - Used only for custom type links, this allows you to define a custom URL within the website to link to on the navigation bar (e.g. Beer)
Target - this defines where the link destination will appear, e.g. Self will have the link appear in the same browser Tab (default), Blank will appear in a new browser tab and top will appear over the current tab.
Tooltip - this is a helpful message to elaborate on where the link goes to.

The Update and Add Buttons (Marked 3) are used to either update a link (If the update button is clicked on a link this will be enabled) or create a new link.

Figure 16.3 - Creating and Editing Links Window

Menu Input Fields (1), Icon Dropdown Menu (2), Update & Add Buttons (3)

Coming Soon

To find the Store Settings, navigate to My Online Shop > Store Settings on the side navigation bar.

(1) Minimum Order: The Minimum dollar amount required to allow the customer to checkout

(2) Minimum Items: Minimum number of items in a customers cart before they can checkout

(3) Out of Stock Text: Text displayed when products are out of stock

(4) Displaying Stock Values: How to display stock values on product cards. These can be:

Specific Stock Values - Show the specific amount of stock available for every product
Generalised Values - Show "In Stock", "Low Stock" (Less than 6 of that item), and Out of Stock
No Values - Do not show stock to customers, however they can still not purchase more than is in stock

(5) Oversell Stock: Allow customers to purchase more than is in stock for every item, even if that item is out of stock.

(6) Show out of Stock: Continue to display products even when they are out of stock, their purchaseability is determined by "Oversell Stock" setting

Figure 18.1 - All Store Settings

Most pages within the store are build from Widgets, many of which can be created and edited from the Widgets Screen.

The Widgets screen can be accessed by clicking on the Widgets Navigation Link (Marked 1) and the Manage Sublink (Marked 2).

From this screen all widgets are shown, along with their templates and shortcodes. To edit a widget click the Edit Button (Marked 3) which will open the Update Widgets page. Alternatively to add a new widget click on the Add Widget Button (Marked 4) which will take you to the Add Widgets page, which is identical to the Update Widgets Page.

Figure 19.1 - Manage Widgets Page

Widgets Navigation Link (1), Manage Sublink (2), Edit Widget Button (3), Add Widget Button (4)

Adding and Editing widgets use the same interface which allows for the selection of a Widget template and provides relevant settings fields for that template.

Widget Name (Marked 1) is used for your own reference so it is advised that a descriptive name is used.
Full Width Toggle (Marked 2) is used to determine whether the widget will extend to the sides of the webpage or whether it will have margins on either side.
Widget Shortcode (Marked 3) is used to render the widget in the webpage, this code should be relevant and unique, however simple names such as "Slider 2" are perfectly acceptable.
Widget Template (Marked 4) determines the template that is rendered onto the webpage, and determines what settings that widget can have.

The Template Settings (Marked 5) are unique to the Template selected, if there are any. These settings will change specific data about the widget, such as Colours or Messages. The settings shown int the figure below are for a "Message" Widget which is a small banner to display a customisable message to customers, such as free delivery or money back guarantee for example. See References for a breakdown on the types of Widget Templates possible.

Ensure that you save your widget settings with the Update/Add Widget Button (Marked 6).

Figure 19.2 - Add or Edit Widget

Widget Title Field (1), Full Width Toggle (2), Widget Shortcode Field (3), Template Selector (4), Template-specific Settings (5), Update/Add Widget Button (6)

To edit the colours used on the website navigate to the Site Colours page by clicking the Style Navigation Link (Marked 1) and then the Site Colors Sublink (Marked 2), which will take you to the Site Colours page.

From here you can easily edit each colour by either:

Clicking the Paint Brush Button (Marked 3) and using a Colour Picker (Marked 4) to easily choose a colour that suits
Entering a colour value in the Colour Value Field (Marked 5) if you require a specific colour. Hexadecimal and RGB colours are both accepted.
Clicking the Reset to Default (Marked 6) button if you are not happy with your changes.

Once you make changes that you are happy with click the Save Button (Marked 7) to confirm your changes.

Figure 20.1 - Edit Site Colours Page

Style Navigation Link (1), Site Colours Sublink (2), Color Picker Button (3), Color Picker (4), Color Input Field (5), Reset to Default Button (6), Save Button (7)

To provide store fulfilled deliveries or stop deliveries to specific states or postcodes you must first navigate to the Custom Rates and Restrictions section by first clicking the Shipping Navigation Link (Marked 1), within the My Online Shop section, and then clicking the Custom Rates and Restrictions Navigation Sublink (Marked 2).

Figure 21.1 - Shipping Navigation

Shipping Navigation Link (1), Custom Rates and Restrictions Navigation Sublink (2)

The page revealed shows different changes to be made on the left side with Store-Fulfilled Delivery Menu Item (Marked 1), Restrict Delivery Zones Menu Item (Marked 2), Courier Services Settings Menu Item (Marked 3).

Store-Fulfilled Delivery Zones is the default page and provides both fixed-price delivery zones alongside free delivery zones within the Store-Fulfilled Delivery Zones Table (Marked 4).

With each zone represented by a row there is a View Zone Button (Marked 5) which allows for the viewing and editing of delivery zones.

The Add New Custom Delivery Button (Marked 6) allows for the creation of additional delivery zones.

Figure 21.2 - Shipping Menu and Store-Fulfilled Delivery Zones Page

Store-Fulfilled Delivery Menu Item (1), Restrict Delivery Zones Menu Item (2), Courier Services Settings Menu Item (3), Store-Fulfilled Delivery Zones Table (4), View Zone Button (5), Add New Custom Delivery Button (6)

Adding and editing store-fulfilled delivery zones is achieved with the same form.

This form contains the following fields:

Name Field (Marked 1) - A descriptive title for the zone, e.g. "Local Free Delivery" or "$5 Local Delivery"
Minimum Order Value (Marked 2) - Minimum order value in dollars for this delivery option to be available, e.g. Free delivery for orders over $100.
Fixed Delivery Fee (Marked 3) - A Fixed price for delivery within this zone, e.g. 5.00 for a flat $5 charge, 0 for free delivery.
Eligible Postcodes (Marked 4) - A simple list of postcodes which are eligible for this delivery service, e.g. 2067,2068,2069,2087
Description for Customer (Marked 5) - A simple description of the service provided, including potential limitations, e.g. Delivery only between 12PM and 2PM.

Note: To find eligible postcodes within a radius of your business, use this tool or follow the link below the field to the same tool. See the Reference section on how to use this tool.

To save your zone click the Add/Update button at the bottom of this page.

Figure 21.3 - Add/View Store-Fulfilled Delivery Zone

Name Field (1), Minimum Order Value Field (2), Fixed Delivery Fee Field (3), Eligible Postcodes Field (4), Description for Customer Field (5).

A: Contact your myPOS representative

A: Admin Panel will automatically log you out after a specific period of inactivity, this is to protect your website if you forget to log out.

A: The website obtains its product data from your myPOS database, and any changes made to the website will be overwritten by changes made on your myPOS terminals. This is likely the cause of product changes being reversed on the website.

How They Work

Short Codes are small codes inserted into content of a page that will be replaced with a widget once displayed on the website. Multiple short codes can be placed in succession to have multiple widgets on one page.
Short Codes look like {this} and are simply references to widgets encased in curly braces { }. The text within the braces determines what is placed there, for example {Storenews} would place the store news widget in place of that code.
Some short codes are not predetermined and require an Identifying number to be placed at the end, for example to place a slideshow you will write {slideshow-#} where the # is replaced with that slideshow's respective idenfitying number, for example {slideshow-4} for the slideshow whose identifiying number is 4.

Predetermined Shortcodes

Preset Shortcodes:

Contact Details	`{contactdetails}`	Editable in Shop Settings
Trading Hours	`{tradinghours}`	Editable in Shop Settings
Vector Map	`{vectormap}`	Not Editable
Google Maps	`{map}`	Editable in Shop Settings
Contact Form	`{contactform}`	Not Editable
Store News	`{storenews}`	Editable in Widgets > News
Featured Products	`{featuredproducts}`	Not Editable

Dynamic Shortcodes

Dynamic Shortcodes:

Slideshows	`{slideshow-#}`	Editable in Widgets > Sliders
Custom Widgets	`{features-#}`	Editable in Widgets > Custom

# must be replaced with a Slideshow or Widget ID

Header Styling Options

Header Styling Options

Enable Top Header Menu - Toggles the visibility of the top header
Full Width Top Header Menu - Toggles the width of the top header, to either have side margins or take the full width of the page.
Top Header Menu Background - Changes the background colour of the top header
Full Width Main Header - Toggles the width of the top header, to either have side margins or take the full width of the page.
Main Header Menu Background Colour - Changes the background colour of the Main Header

(1) Top Header, (2) Main Header, (3) Full Width

Body Styling Options

Body Styling Options

Enable Full Body Width - Toggles the width of the body, to either have side margins or take the full width of the page.
Body Background Colour - Change the colour that appears behind the main body using either a hex colour value or using the colour picker
Background Image - Toggle whether an image appears in the background, behind the body.
Background Image Url - The Url destination of an uploaded image which will appear as the background behind the body.
Navigation Background Colour - The colour of the navigation bar. The text colour will automatically adjust depending upon whatever the provided colour is.
Navigation Full Width - Toggle the width of the navigation bar, to either have side margins or take the full width of the page.

(1) Navbar, (2) Body, (3) Full Width, (4) Background

Footer Styling Options

Footer Styling Options

Full Width Main Footer- Toggle the width of the main footer, to either have side margins or take the full width of the page.
Main footer menu background colour - Change the colour of the main footer using either a hex colour value or by using the colour picker provided
Main Footer number of columns - Change the number of footer information columns, the minimum being 1 and maximum being 4
Column 1 to Column 4 - Edit the content of each footer column using the editor provided. Only the columns up to the number set in the Main Footer number of columns will be displayed.
Enable Bottom Footer - Toggles the visibility of the bottom footer.
Full Width Bottom Footer - Toggles the width of the bottom footer, to either have side margins or take the full width of the page.
Bottom Footer Background Colour - Change the colour of the bottom footer using either a hex colour value or by using the colour picker provided.
Bottom Footer Number of Columns - Change the number of bottom footer information columns, the minimum being 1 and maximum being 2.

(1) Main Footer, (2) Bottom Footer, (3) Main Footer Column, (4) Full Width

Template Options

There are a number of widget templates to be used, with varying degrees of customization.

Products - This displays a widget with a limited number of filtered products. The Settings include: Default Display (Default category displayed, e.g. Specials, New), Show Tabs (Show options to switch filtered category), Columns (products per row), Rows (number of rows of products).
Store News - This displays the Store News - this has no settings.
Contact Form - A contact us form for users to fill in - this has no settings.
Trading Hours - A table containing the trading hours of the business - this has no settings.
World Map - A World map displaying different countries/regions to filter products by - this has no settings.
Store Locator - A Map to display the location of the store - this has no settings.
Contact Details - A table containing contact details of the business - this has no settings.
Calendar - A list of events coming up at the venue - this has no settings.
Message - A small customised message with an Icon to display a specific message to customers - Settings include: Color (Colour of the Icon), Message (the Message to be displayed), Icon (a font awesome icon name to be displayed with the message).
Department Links - Links to different departments within the store - Settings include a Link, Name and Image for all four department links.
Click & Collect - A small section explaining to customers how click and collect works - Settings include a colour for the icons for the click and collect.
Jumbotron - A large banner that greets the user to the website - Settings include: an Image (Displayed as the background of the Jumbotron), a Colour Shade (colour that shades over the image), a Title and a Body which are displayed over the Jumbotron.
Carousel - Also known as a Slider, this displayed a number of images with optional links - Settings include an image and link for each of the slides in the jumbotron, can be added dynamically.
Layout - A Widget for creating widgets-within-widgets and organising them into columns - Settings are similar to that of the Edit Page Contents section but instead with two separate columns and a Layout Ratio setting.
Custom - A blank canvas for any HTML code, recommended for advanced users only - Settings are a text editor which can be used to edit HTML.

Accessing the Tool

To access the "Find Australian Postcodes Inside Radius" Tool you can either click here or follow the link in the Add/View Store-Fulfilled Delivery Zone form.

Once you arrive at the page (FreeMapTools.com) you should be greeted with a page that looks something like this:

To use the tool simply enter a radius in step 1, then your own postcode in step 2, then click "Draw Radius".

In the output section below a list of postcodes will be generated, each one separated by a single comma (,) with no space. This is the desired format for entering into the delivery website, so copy that data and paste it into your delivery zone's field.

Note: this data may not include your original postcode, so adding that to the end of the postcodes is advised, delineated by an extra comma.

Introduction

Get Started