Topaz: Recreating the Demo - Showcase Section

Introduction

1

Grid Statistic (Particle)

2

Custom HTML (Particle)

3

WordPress Posts (Particle)

The Showcase area of the page is made up of three columned sections wrapped in a Container. Showcase Left and Showcase Right do not appear on the front end as they have no assigned content. However, there are Showcase A and Showcase B widget positions in the Showcase Main section which contain three different particles: Grid Statistic, Custom HTML, and WordPress Posts.

Here is a breakdown of the widget(s) and particle(s) that appear in these sections:

• Container
  • Showcase Left
  • Showcase Main
    • Showcase A (Widget Position)
      • Grid Statistic (particle)
      • Custom HTML (Particle)
    • Showcase B (Widget Position)
      • WordPress Posts (Particle)
  • Showcase Right

Container

The container wrapping the Showcase sections enables the three sections to exist within a single horizontal space.

Showcase Main

The Showcase Main section hosts the Grid Statistic, Custom HTML, and WordPress Posts particles on the front page. You will find the settings used in the section below.

Section Settings

Section Block Settings

Showcase A (Widget Position)

Particle Settings

Block Settings

Grid Statistic (Particle)

The Grid Statistic particle is assigned to the Showcase A widget position. This is done by creating a Gantry 5 Particle widget and assigning it to the showcase-a position, then selecting Grid Statistic as the Particle in the widget's settings. You will find its settings below.

Custom HTML (Particle)demo_showcase_10

The Custom HTML particle is assigned to the Showcase A widget position. This is done by creating a Gantry 5 Particle widget and assigning it to the showcase-a position, then selecting Custom HTML as the Particle in the widget's settings. You will find its settings below.

<ul>
   <li><a href="#">category</a></li>
   <li><a href="#">art</a></li>
   <li><a href="#">architecture</a></li>
   <li><a href="#">entenrpreneurship</a></li>
   <li><a href="#">history</a></li>
   <li><a href="#">design</a></li>
   <li><a href="#">culture</a></li>
   <li><a href="#">daily</a></li>
</ul>

Showcase B (Widget Position)

Particle Settings

Block Settings

WordPress Posts (Particle)

The WordPress Posts particle is assigned to the Showcase B widget position. This is done by creating a Gantry 5 Particle widget and assigning it to the showcase-b position, then selecting WordPress Posts as the Particle in the widget's settings. You will find its settings below.