The Toolkit has several built-in layouts, called "modes" that you can use to display your pets.

Selecting a layout

The JavaScript Toolkit has built-in modes (layouts) you can use. Select the layout that works best for your website. If you need help making a particular layout work for your website, please contact us.

Mode

Description

Grid 1 (National)

This layout is designed to present well on National Search websites. The Grid 1 (National) Toolkit layout it will by default load the website visitor's zip code as opposed to the zip code you specify in the Toolkit. 

Each pet’s first thumbnail picture, name, and the breed is displayed in a grid format (for example, three pets on each row and four rows per page). See below for an example, or see this toolkit layout live on RescueGroups.org: https://www.rescuegroups.org/adoptable-pet-search-grid-1/


Grid 2

This layout includes each pet’s first thumbnail picture, name, and the breed displayed in a grid format (for example, three pets on each row and four rows per page). In addition:

  • Included Fields is used.
  • Show the search form is used
  • Known Issue: YES/NO results when selecting good with kids, spay/neuter and fields that return a yes, no value.

See below for an example, or see this toolkit layout live on RescueGroups.org:  https://www.rescuegroups.org/adoptable-pet-search-grid-2/.

Grid 3

This layout includes each pet’s first thumbnail picture, name, and breed in a grid format (for example, three pets on each row and four rows per page).
See below for an example, or see this toolkit layout live on RescueGroups.org:  https://www.rescuegroups.org/adoptable-pet-search-grid-3/.


List 2

This horizontal list of pets typically includes basic pet information and one picture (name, breed, age/size, picture). See below for an example, or see this toolkit layout live on RescueGroups.orghttps://www.rescuegroups.org/adoptable-pet-search-list-2/.

List 3

This layout features one picture with the basic information (name and breed) and the animal's description, in a list beside the photo. See below for an example, or see this toolkit layout live on RescueGroups.orghttps://www.rescuegroups.org/adoptable-pet-search-list-3/.

Random 1

A single pet, chosen at random, with name and breed. Suitable for a website's sidebar.
See below for an example, or see this toolkit layout live on RescueGroups.org: https://www.rescuegroups.org/adoptable-pet-search-random-1/





Have a question about this topic?

  • No labels