Partstore.Online Help and Training Center

Resources to help you become an expert at using Partstore.Online

Tiles Widget

Tiles are images with associated underlying textual information. When a user moves the mouse cursor over a tile, the tile changes. The user can click on a tile to navigate to web page.
Tiles Widget


The Tiles widget allows tiles to be quickly added to a webpage in a visually pleasing format without requiring the generation of complex HTML code.


Tiles are images with associated underlying textual information. When a user moves the mouse cursor over a tile, the tile changes to display the underlying text associated with the tile image. The user can click on a tile to navigate to a url or web page.


To add tiles to a webpage click on a Tiles Widget icon. Select the layout from the dropdown preview.


The widget is added to the page and displayed on the left side of the page editor in the list of “Your Widgets”.


Click the Edit button to modify the content.


Title field is the name you want to give the widget in your widget list and can optionally appear on the web page.


The "show title" toggle controls if the title is displayed on the web page.


Wrapper class -is a techie term for how the content will be displayed.


Select if you want the content size to be limited by its parent container, or stretched to the full-screen width.


Background Color allows the selection of the background around the tiles block.


Image style provides a selection of three different tile highlight orientations for when a user mouses over an individual tile. - Selections are Square, Portrait, and Landscape.


Image size allows a selection of the tile size - Large, Medium and Small.


List of Tiles is where the individual tile items are added to the tiles widget.


Click the add button. The Tile item form opens. Populate the fields you need:


Optionally enter a URL in the URL field.


This is an absolute or relative web page address that will be used to navigate the user when a tile is clicked. If this field is empty no action will be performed when a tile is clicked.


Background Color allows the selection of the background color behind the image. The text content will be displayed on the selected background color on "mouse over" or when the user moves their cursor over an image.


Enter the text you want displayed to the user when they mouse over the tile.


Color of Font provides the ability to select the color of the text content that will be displayed when the user mouses over the tile.


In the Graphic field, Select an exiting image or upload an image using the File Manager.


When editing is complete, click the Add button again to close the individual tile's settings.


Repeating these steps will add additional tiles.


The order of tiles items in the tiles item list can be changed by clicking and dragging.


Currently displayed for the purpose of demonstration is a Tile widget with the four tiles defined.


In addition to the Tile widget the sample page also includes a Text block widget.


A page can be previewed before saving by clicking on the "live preview" button at the bottom of the page.


Always remember to click the Save button.


Thank you for watching this video.