Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

Gantry

Trying to add ID selector to a div from .yaml

Started by mikael 9 years ago · 1 replies · 1784 views

9 years ago

Hey!

I am using Gantry5 with atom headroom.js and particle "one page menu". And i am trying to have different "one page menus" on different modular pages.

Here I want to grab ID from headroom.yaml:

YAML

 cssselector:
  type: input.text
  description: Enter the CSS Selector for the element that should get fixed/sticky, for example '#g-header'.
  label: CSS Selector
  placeholder: '#g-header'

and the type input to onepage-menu.html.twig:

TWIG

<div id="--->{{ What to write? }}<---" class="g-onepage-menu{% if particle.css.class %} {{ particle.css.class|e }}{% endif %}" {% if particle.extra %}{{ attr_extra|raw }}{% endif %}>

I have tried {{ particle.cssselector }}}

Sources: https://www.inspiretheme.com/documentation/gantry5-particles/onepage-menu
https://www.inspiretheme.com/documentation/gantry5-particles/headroom-js

Thanks for all replies 🙂

last edited 07/27/17 by mikael

9 years ago Solution

I found a workaround for this. It is not optimal, but it works for now 🙂

In the onepage_menu.yaml i added a new configuration

YAML

   headroom.id:
  type: input.text
  label: ID headroom
  description: Add ID so headroom can bind to the selector.
  default:

and added {{ particle.headroom.id }} to:

TWIG

<div id="{{ particle.headroom.id }}" class="g-onepage-menu{% if particle.css.class %} {{ particle.css.class|e }}{% endif %}" {% if particle.extra %}{{ attr_extra|raw }}{% endif %}>

Now instead of only adding ID to headroom.js config I also need to add the same ID to one page menu particle.
This is not optimal, but it works.

Wish to learn how I can access configurations from other particles and atoms to add in a theme.

Thanks for all help 🙂

Topic	Replies	Views	Activity
Skeleton for Helium / Hydrogen Gantry · by Chris, 11 months ago	1	179	11 months ago
Gantry 5: How to change the Theme logo? Gantry · by Sam, 1 year ago	7	223	1 year ago
Unable to display Comments plugin in Gantry 5 Helium theme Gantry · by Dima, 2 years ago	2	79	2 years ago
How to add comment in gantry5 theme Gantry · by KimTaeWoong, 9 years ago	2	1887	3 years ago
Critical message Gantry · by stani, 6 years ago	2	834	3 years ago

Suggested topics