Hiding and showing elements in Trap Kit

  • You can simulate a lot by just hiding and showing things
  • Both actions use simple “click this, hide/show this” syntax
  • Let’s look at an example: Subscribe template

Example

# Subscribe to our mailing list

{% include components/alert.html type="success" heading="Success" text="Thank you for subscribing. You’ll hear from us soon!" %}

{% include components/text-input.html label="Email" type="text" %}

{% include components/button.html label="Subscribe" link="#" %}

{% include actions/show.html click-this="subscribe" show-this="success" focus-this="close" %}

{% include actions/hide.html click-this="close" hide-this="success" %}
Back to agenda | Next: Saving and reusing data in Trap Kit