Components in tabs / passing child parameters

[papercutpm]

Sorry to ask this - but I honestly can’t find anything anywhere else. Do components with parameters work in tabs? Obviously it’s got to be driven by shortcode (since there’s no intra-tab builder functionality), but no matter what I do, I cannot get it to work. I see old posts that suggest there might once have be a problem doing this, but I’ve seen no updates either way. Are there any tricks with this?

Update: For clarity, here’s what I’ve done:

1. I have a fairly complex component I’ve created that’s meant to swap several blocks of text in and out. The component will sit in 6 identical tabs. As the user clicks each tab, the responsive template is the same but the text is different depending on the tab label (I’m linking the in-progress page in a secure note).

2. On the component, I’ve set up my parameters, and they seem to work fine. Just to test it out, I swapped the background color and text for a text element like so:

{
“competencyColor” : {
“label” : “Background”,
“type” : “color”,
“initial” : “#000000”
},
“appearanceLabel” : {
“label” : “Appearance Label”,
“type” : “text”,
“initial” : “Scooby”
}
}

This seems to work just fine and in the builder I can see the “params” tab appear with the correct editable text boxes.

3. Back on the page, in the first tab of the tab element, I inserted the component. The component inserts just fine! But when I try to apply the parameters nothing happens. There’s no builder inside a tab so I have to use the following shortcode:

[cs_component id="…" parameters=’{ “competencyColor” : “#B10800”, “appearanceLabel” : “Appearance” }’]

I could just be doing this all wrong.

[papercutpm]

Hrm. After more digging, it seems this has nothing to do with tabs and everything to do with the fact that I’m trying to place parameters in the children of the component. I believe I’ve placed them somehow incorrectly. On my page, inside the tab, I call the component using the shortcode above.

The component I exported was the WHOLE thing. The parameters I’m currently trying to set though, are in a textbox that is a child to the component (“Appearance Label”, most of the way down). When I’m inside the component, everything looks the same as the docs. On the page, however, the shortcode displays the component but ignores the parameters. Am I interpreting this correctly?

[papercutpm]

I figured it out. Dynamic content works just fine in tabs. The issue is how you wire the items together. If anyone else has a similar problem, you have to set the actual parameters at the top level of the component you exported. This is because when you use the shortcode, you’re talking to the parent component, not its children (if I understand this correctly). When that’s done, then you can go to the children you want to pass the dynamic content to, and add in the dynamic content notation, {{dc:p:whatever}}. As long as you wire things together that way, it works a treat.

I figured this out from the following forum entry:
Component with a Slot

It’s a bit tricky so I thought I should post this for other folks at my level of coding (which is not very hehe).

[papercutpm]

Last thing - if you have to pass any HTML in the parameters you send over to your components, the rich text editor will absolutely blow up the entire shortcode as soon as you open it again for editing. You can prevent this by disabling the rich text editor as per this post:
Disabling the rich text editor

Okay, I’m done now.

[marc_a]

Hey @papercutpm,

Thanks for reaching out!

We’re glad that you’re able to figure it out! Just want to let you know that if you response to your own thread it will be queue again to the newest.