impresspages / ImpressPages

ImpressPages is php framework with admin panel. Build functional website in one hour.
http://www.impresspages.org
Other
501 stars 178 forks source link

Ability to add classes to any object #871

Closed silicahd closed 6 years ago

silicahd commented 6 years ago

I guess the title said it all. Kind of crazy that you cant add classes to any object. Yes you can add them in the theme, but would be nice if you could do that from the front end.

jankus commented 6 years ago

Can you give more details where and for what purpose you want to add CSS (correct?) classes?

silicahd commented 6 years ago

Lets say that you want to use a transition class on any object that was added via the front end. You can change the style of any element without having to do the hard coding. Lets say that an image needs a left padding of 10, or just want to create a drop shadow element and reuse it on all the new elements that are added. The problem is not that you cant add them when creating the template, but since you can use any position for any element, this would really add a huge flexibility to the framework. Right now the only way to do it is to add skins to custom plugins as the skin will create the -skinname class instead of the -default. But that has huge limitations. I was looking to create a plugin that allows animations and transitions for any element. Is here a way to add a setting tab to all the plugins (default or not) ?

jankus commented 6 years ago

Yes, you can. It's not super easy but doable. Via ipWidgetManagementMenu filter you can add custom control button to any widget. Then you need to decide what should happen when it is clicked. That goes into JavaScript area, creation of required HTML, controls, admin actions, etc. All this to handle all CRUD actions.

The hardest part comes in with attaching that data to a specific widget. Widget ID changes all the time due to page revisions feature. Which means you need to be careful how to store your custom configuration. One of the ways is to catch widget related events and duplicate/modify required data (i.e. when widget is duplicated, you need to duplicate your custom configuration for a new widget, too).

The last part is ipWidgetHtmlFull filter where you can play with generated HTML and add/modify whichever part you want (usually with some regExp function). Depending on widget type or configuration you can add class on widget or on specific element.

And don't forget to add required assets (CSS, JS) when needed. Some will be required only in admin mode, some only in preview mode.

I hope this helps.

silicahd commented 6 years ago

I feel like this will be a really good addition to this framework. I will try to do it myself but it would be a nice core function as it will allow you to add css animations and custom styles to blocks.

wannaco commented 6 years ago

@virgiltu you can look at this pluginhttps://github.com/impresspages-plugins/WidgetClass kind of old but it does pretty much what you are looking for I modified it for some themes flat and lanty to add transitions