Skip to content

Our Customers 99% of our customers recommend us!

Setup

To initiate an Isotope grid simply build a normal Bootstrap grid then add the following to the .row element: data-toggle="isotope-grid" data-isotope-options='{ "itemSelector": "GRID-ITEM-SELECTOR"}' .

GRID-ITEM-SELECTOR should be a class that represents the items within the grid, this class should be present on all grid items.

data-isotope-options allows you to pass all Isotope plugin options available, see isotope.metafizzy.co for more information.

You can experiment with different grid item widths and even mix and match them as the bottom example shows.

Filtering items

1. Filters wrapper element requires an ID or unique class

2. The links also require a data-isotope-fid attribute which contains the class of the items to filter, this should match classes in the isotope items

3. Lastly your data-toggle="isotope-grid" element needs a data-isotope-filter attribute which is a selector which defines the filter links


Default Grid (with filtering)

Customer 1

Customer 1

Caecus in neo nisl pertineo. Elit imputo pagus refero sino. Ea gilvus hos oppeto quibus ratis sudo.

Customer 2

Customer 2

Haero jus pagus valde. Ex exputo gravis inhibeo iustum magna roto ut. Abigo eligo exerci interdico luctus modo scisco usitas velit.

Customer 3

Customer 3

Autem mos tamen ut utrum. Abluo autem blandit caecus cui dolus facilisis ideo voco. Abdo fere in minim nulla populus quae typicus uxor vulputate.

Customer 4

Customer 4

Dolus exputo quadrum utrum. Ea elit eum laoreet pecus suscipit. Augue elit genitus haero mauris populus quidem.

Customer 5

Customer 5

Ad dolor dolore humo loquor ludus pala populus usitas. Adipiscing laoreet premo quia scisco suscipere tamen veniam.

Customer 6

Customer 6

Aptent camur melior. Ideo loquor natu typicus vero. Abdo dolor eu neo obruo pagus te vulpes.

Customer 7

Customer 7

Bene commoveo defui erat tego veniam. Camur mauris odio. Accumsan exputo iustum natu nostrud nunc os saluto veniam.

Customer 8

Customer 8

Adipiscing et letalis sagaciter si. Abico defui eu macto odio oppeto quidem refoveo suscipere. Consectetuer damnum dolore genitus ymo.

Customer 9

Customer 9

At ea ex genitus incassum oppeto roto vero verto volutpat. Abico hendrerit lobortis nostrud vulputate.

Customer 10

Customer 10

Imputo in sit. Luctus neque tation. Jugis pneum praesent saepius veniam. Abluo brevitas dolus exputo haero hos ibidem iriure natu.

Customer 11

Customer 11

Capto haero hos voco. Comis commodo premo similis. Ad feugiat lucidus patria scisco ut. Magna nimis occuro olim similis wisi.


4 Items per row (no filtering)

Customer 1

Customer 1

Luctus molior virtus. Ea gemino torqueo. Elit si utinam. Accumsan enim fere os vel verto.

Customer 2

Customer 2

Meus probo quadrum refero tum. Abluo iustum pecus quibus uxor. Humo imputo jus paratus patria premo tation utinam utrum.

Customer 3

Customer 3

Ad enim erat exerci gilvus humo ibidem. Comis consequat eum gilvus praesent. Accumsan illum mauris probo roto ullamcorper utinam validus.

Customer 4

Customer 4

Ad jus typicus. Appellatio capto vicis. Accumsan esca ideo inhibeo interdico meus nibh quia refoveo venio.

Customer 5

Customer 5

Consequat euismod eum gilvus ibidem mauris meus quia similis singularis. Aliquip commodo quibus valde valetudo.

Customer 6

Customer 6

Camur interdico nostrud saluto similis volutpat. Pertineo similis torqueo. Cui decet ex exputo macto proprius vereor.

Customer 7

Customer 7

Appellatio cui erat ibidem illum immitto inhibeo persto valde. Fere saluto tum voco. Antehabeo melior neo.

Customer 8

Customer 8

Aptent conventio facilisi humo iaceo nostrud os singularis vereor. Distineo praesent ymo. Amet aptent brevitas neo oppeto voco.


Different width items (no filtering)

Customer 1

Customer 1

Decet dolore euismod feugiat luptatum persto plaga praemitto singularis ulciscor. At bene consequat plaga. Dolore feugiat iaceo quidne saluto scisco sed sino sit zelus.

Customer 2

Customer 2

Commoveo erat eum interdico nostrud saluto. Cogo luctus neo neque nimis persto pneum tation vulpes.

Customer 3

Customer 3

Ad ludus minim odio qui saepius venio verto. Cui distineo fere minim nutus paulatim praemitto sed suscipere.

Customer 4

Customer 4

Fere imputo jugis melior neo nunc ullamcorper virtus volutpat. Fere laoreet voco. Esse facilisi incassum vereor.

Customer 5

Customer 5

Aliquam immitto neo sit. Bene capto jumentum letalis similis usitas. Dolus duis haero nostrud occuro.

Customer 6

Customer 6

Haero inhibeo olim pala proprius tum. Caecus capto hos importunus jumentum. Comis pala praemitto sed tation tum ulciscor.

Customer 7

Customer 7

Facilisi pagus sagaciter. Abico in probo utinam uxor veniam verto ymo. Eum in lenis ratis.

Customer 8

Customer 8

Adipiscing amet appellatio lobortis luptatum metuo nostrud tum. Aliquam at dolus genitus saepius turpis vindico.

Awesome Features

99.9% Uptime Free Upgrades Fully Responsive Bug Free

Theme Colours

Green Red Blue Purple Pink Orange Lime Blue-dark Red-dark Brown Cyan-dark Yellow Slate Olive Teal Green-bright

Cookies are NOT enabled so colour selection is not persistent.

Back to main homepage

Back to intro page