HI all,
I'm trying to make an experience using widgets in a widget controller widget.
Unfortunately, widgets within the controller seem to be unable to have their sizes set, meaning that you have to manually resize them whenever you open them, or scroll down. This is kind of awful.
I was wondering if there was a way to set default sizes like you can when they're not in a widget controller?
Print widget inside controller | |
| Style page of print widget inside controller |
| Style page of print widget outside of controller. |
Solved! Go to Solution.
You can try using resizable tool on the bottom left corner of the widget panel to resize, and save the app. Panel size can be remembered, but not for the position at the moment.
As far as, I can tell it is not possible and it really should be. Or at least the widget controller modal should honor the default size of the widget in its config file, but unfortunately the widget controller overwrites this with inline css.
Yesterday, I came up with a work-around, but it incorporates several React anti-patterns: directly altering the DOM and children altering parents. I think it's harmless in this case, but it may have some unintended side-effects.
1. Copy the widget you want to change the size of into your custom widgets folder.
2. In the manifest.json of that widget, add a jQuery CDN as a dependency.
3. Add a class to the top div of your widget.
4. Inside a useEffect function that loads when the widget starts add
$('.your-class').parents('.single-widget-launcher').addClass('your-class-two')
I'm using a single widget launcher, if you are using multi-widget, this will need to find the right class name for that.
5. Add a css file and adjust the size of the widget in .your-class-two
(You will need to mark your css with !important to override the inline css that the widget controller uses.)
You can try using resizable tool on the bottom left corner of the widget panel to resize, and save the app. Panel size can be remembered, but not for the position at the moment.
Well, that does in fact work. Thank you.
Still weird that you can't set it from the Style page, too.