Neighbors

By Becky Soll in Tag
Free!
Download
Neighbors
Description

A statamic 2.0 tag pair to turn those replicator and bard sets into friendly neighbors. Hidey ho!

Copy Neighbors folder into /site/addons/.

Usage

When templating replicator and bard sets, I have often found myself wanting to be able to add some extra markup depending on what the previous or next set type is. Maybe text sets that come after pull quote sets should get some extra space, or I want to wrap all consecutive video sets in an extra div.

To use, replace the normal tag pair with the neighbors tags (basically just add "neighbors:" before the field name in both the opening and closing tags). Inside, these tags are available:

  • {{ neighbors:next }}
    • returns the next set type
    • if there is no next set, returns null
  • {{ neighbors:previous }}
    • returns the previous set type
    • if there is no previous set, returns null

A field paramater can be added to these tags to retrieve a value other than type:

  • {{ neighbors:next field="section_title" }}
    • returns the next set section_title
    • if there is no next set or the next set does not have a section_title, returns null

If your data looks like this

evergreen_terrace:
  - 
    type: mansion
    family: The Bushes
    roof_color: gray
  - 
    type: house
    family: The Flanders
    roof_color: purple
  - 
    type: house
    family: The Simpsons
    roof_color: brown
  - 
    type: house
    family: The Wiggums
    roof_color: brown

Template

<ul>
{{ neighbors:evergreen_terrace }}
<li>We are {{ family }}</li>
  <ul>
    <li>We live in a {{ type }} with a {{ roof_color }} roof.</li>
    {{ if !first }}
    <li>{{ neighbors:previous field="family" }} live in the {{ neighbors:previous }} before us.</li>
    {{ /if }}
    {{ if !last }}
    <li>{{ neighbors:next field="family" }} live in the {{ neighbors:next }} after us.</li>
    {{ /if }}
    {{ if ({neighbors:previous field="roof_color"} == roof_color) }}
    <li>The {{ neighbors:previous }} before us has the same colored roof.</li>
    {{ /if }}
    {{ if ({neighbors:next field="roof_color"} == roof_color) }}
    <li>The {{ neighbors:next }} after us has the same colored roof.</li>
    {{ /if }}
  </ul>
{{ /neighbors:evergreen_terrace }}
</ul>

Outputs

  • We are The Bushes
    • We live in a mansion with a gray roof.
    • The Flanders live in the house after us.
  • We are The Flanders
    • We live in a house with a purple roof.
    • The Bushes live in the mansion before us.
    • The Simpsons live in the house after us.
  • We are The Simpsons
    • We live in a house with a brown roof.
    • The Flanders live in the house before us.
    • The Wiggums live in the house after us.
    • The house after us has the same colored roof.
  • We are The Wiggums
    • We live in a house with a brown roof.
    • The Simpsons live in the house before us.
    • The house before us has the same colored roof.

If you have any questions, issues, or any suggestion on how to make my code better, feel free to reach out.


Important Links
Details
Released May 15, 2018
Downloads 204
Requires Statamic 2

Becky Soll

More by Becky Soll

Similar Addons

See All
Only resize images with Glide when they are within set dimensions.

SafeGlide

by Pixel Primate in Media, Utility, Enhancement, Tag
Only resize images with Glide when they are within set dimensions.
Create, edit, and delete entries, pages, and globals on the front-end of your site without the control panel. $39

Workshop

by Statamic in Forms, Tag
Create, edit, and delete entries, pages, and globals on the front-end of your site without the control panel.
This addon allows you to embed videos from different providers into your Statamic site. $1

Video Embeds

by Miguel Piedrafita in Tag
This addon allows you to embed videos from different providers into your Statamic site.
This addon allows you to embed CodePen into your Statamic site. $1

CodePen Embeds

by Miguel Piedrafita in Tag
This addon allows you to embed CodePen into your Statamic site.