Developer forum

Forum » CMS - Standard features » Feature request in paragraph container

Feature request in paragraph container

Siv Hansen
Siv Hansen
Reply

I would really like to have the option of setting a class or an ID on a paragraph container, so that I can target my CSS more accurate.

I'm testing on rapido 3.2

Replies

 
Nuno Aguiar
Nuno Aguiar
Reply

Hi Siv,

 

There is an undocumented feature for this in Rapido 3.2. Here's what you need to do to have the support in Page Properties, Paragraph and Paragraph Container's Custom settings:

  • Go to Settings > Item Types > Settings > Paragraph Custom
  • Create a field with the system name DesignLayout of type dropdown list
  • Add the options you want. A recommendation is:
    • paragraphDesignLayout1
    • paragraphDesignLayout2
    • paragraphDesignLayout3
    • paragraphDesignLayout4
    • paragraphDesignLayout5

 

You can do the same for Paragraph Container (Custom) and Page (Properties Custom), but then you'd change the prefix from "paragraph" to "paragraphContainer" and to "page", so ultimately you'd get 15 possible css classes:

  • paragraphDesignLayout1
  • paragraphDesignLayout2
  • paragraphDesignLayout3
  • paragraphDesignLayout4
  • paragraphDesignLayout5
  • paragraphContainerDesignLayout1
  • paragraphContainerDesignLayout2
  • paragraphContainerDesignLayout3
  • paragraphContainerDesignLayout4
  • paragraphContainerDesignLayout5
  • pageDesignLayout1
  • pageDesignLayout2
  • pageDesignLayout3
  • pageDesignLayout4
  • pageDesignLayout5

 

The nice thing is that the 3 Rapido templates are already expecting a "DesignLayout" item field in each respective "custom" item type of type dropdown list.

 

And the css class is placed in the wrapper of each template.

 

I know these are now very detailed explanations, but let me know if you need additional help with it.

 

Best Regards,

Nuno Aguiar

 
Siv Hansen
Siv Hansen
Reply

It is a somewhat smart idea, but I'd need so many of them (as in combination of css classes for various settings), or the css I'd have to make for each selection would be large. I would like a text field only, where I insert classes with spaces. I tried to make the DesignLayout of type Text but then everything crashed. I assumed it is because it is expecting a Dropdown.

I know how to alter an item type, but if I add Css Class of type Text in paragraphContainerCustom and changes the layoutfile for the paragraph container, will it be overwritten on later upgrades?

I saw the webinar talked about blocks today, can I customize the template files using blocks?

 
Nuno Aguiar
Nuno Aguiar
Reply

Hi Siv,

 

You got the right assumptions. Right now it's only accepting the dropdown, so what I would suggest for you to create as many options as you need and/or you can use some js to recgonize that particular css class and then do some additional logic. That's actually how we do it, so there is some css associated with it, but then some js kicks in and does something else.

 

The blocks may be an option, but we found it unsuitable because we needed something in the wrapper.

 

Let me know if you have any questions and I hope it gets you going.

 

Nuno Aguiar

 

You must be logged in to post in the forum