Creating a more complex re-usable element with global styles

Hi everyone,

I’m still stunned by the awesomeness of GenerateBlocks (Pro) and GeneratePress (Pro), which I’m both using for a pretty big project right now. Thanks a lot for creating this milestone of web development.

That being said, I’m still trying to figure out what the recommended way of doing certain things is. Right now I’m working on a widget (not in the wordpress-sense) for user app store ratings, which should look like this:

The widget consists of an outer container, a headline, a paragraph and a 3 column grid for the lower part, which then contains the icon (which is an image actually), the meta data and the stars.

This widget is being re-used on several places and I would like to use global styles for it. When I started creating those styles, I noticed that not everything is actually applied to my local element when selecting a global style for it (e.g. grid widths). Also, the global styles of course don’t contain the image. I may be doing something wrong here though.

My question is: What would be the best way to create such a “complex” widget as a re-usable element, to make sure that changes to it only need to be done on a central place? Should I use a combination of global styles and local templates?

Thanks in advance for every hint.


The best solution is to build this as a Local Template. The big difference with global styles and reusable blocks is that changes affects al previous builds as well. Once a Local Template is inserted, it becomes independent.

EDIT: After re reading: As far as I understand what you try to do is either use a combination or add proper classes that can be modified with some central stored CSS.