Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
The IPE modal dialogue is rendered using the front-end theme, rather than the admin theme. This can cause the following types of issues:
* Broken submit buttons
* Unusable forms due to front-end themes not being designed to have long forms.
Comment | File | Size | Author |
---|---|---|---|
#20 | _misc.scss_.txt | 3.5 KB | dalin |
#16 | Screen_Shot_2014-10-15_at_10_09_56_AM.png | 22.91 KB | Kevin P Davison |
#16 | Screen Shot 2014-10-15 at 10.09.56 AM.png | 502.76 KB | Kevin P Davison |
#10 | Screen Shot 2014-01-15 at 13.46.24.png | 263.17 KB | ericmulder1980 |
Comments
Comment #1
Olivier Beerens CreditAttribution: Olivier Beerens commentedComment #2
mokargas CreditAttribution: mokargas commentedAgreed. I've noticed this breaks on custom themes quite severely.
Comment #3
gmclelland CreditAttribution: gmclelland commentedNot sure if it would work, but I wonder if adding a hook_admin_paths can help?https://api.drupal.org/api/drupal/modules%21system%21system.api.php/func...
The revision_scheduler module does this:
Comment #4
caschbre CreditAttribution: caschbre commentedI actually disagree and think that panels IPE should use the active (not admin) theme. That's the point of the IPE... to edit in-place. I think it's an issue with the theme that it's not working correctly as several projects where we've created custom themes we have not run into any issues with the IPE.
Comment #5
caschbre CreditAttribution: caschbre commentedThis is also a dupe of https://drupal.org/node/2084063.
Comment #6
ericmulder1980 CreditAttribution: ericmulder1980 commentedHi Craig,
While you may not agree with the statement that IPE 'should' use the admin_theme, perhaps we can turn this into a feature request so we can make it configurable? When multiple users of the module run into this problem i would think it is worth the effort.
You mention not running into these problems yourself with custom themes but did these include custom styling for form elements? In our current project we do have this and it breaks the usabillity of the forms in the IPE. Indeed we could adjust form styling specifically for the IPE but in the end we would have to do this for every client.
If you can roughly send me in the right direction i will be more that willing to invest a little and commit a patch.
Kind regards,
Eric
Comment #7
caschbre CreditAttribution: caschbre commentedThe way the IPE works is that it adds extra markup to the rendered node view page. This allows ajax to work as an in-place-editor. You can't really have it use a different theme because it embeds itself into the active theme.
If you want to allow a user to edit the panelizer settings, layout, content, etc. in the admin theme all they need to do is click the Panelizer tab that is next to the node view/edit tabs. Note that doing this is not using the IPE.
The custom themes I've worked on for sites using panels/panelizer/IPE have had the form elements styled. I guess I'm somewhat confused where you're seeing the issue.
Do you have any screenshots of what you're experiencing?
Comment #8
BarisW CreditAttribution: BarisW commentedI agree that it would be very nice if we could just define per site whether IPE should use the admin or front-end theme in the pop-up. I've tried all three steps listed on http://www.duckzland.com/content/drupal-7-force-ajax-use-admin-theme, but none seem to work.
caschbre; in our current project, the form labels are displayed in front of the form elements with a fixed width. We don't want/need this in IPE as it breaks the layout. In such case, it would be nice if IPE would just use Bartik.
Comment #9
caschbre CreditAttribution: caschbre commentedSo are you referring to just the modal window that opens up where the user can select a pane or layout? Or are you referring to when the the main window that shows the panels where you can drag panes around?
Do you have any screenshots of the areas affected?
Comment #10
ericmulder1980 CreditAttribution: ericmulder1980 commentedSee attached image. We are indeed refering to the modal window that opens up with the pane edit form. We would like this edit form to be styled with the chosen admin theme.
The main window that let's you drag panes around is displayed in the default theme just like it is supposed to. Nothing to change there.
Comment #11
gmclelland CreditAttribution: gmclelland commentedSame here. The form fields within the modal dialog look funny when used with the site theme.
Comment #12
buddaIs the solution to stop IPE from breaking to use CSS with !important to enforce its styles AND to better namespace its UI CSS classes to avoid clashing with the Bootstrap modals?
Comment #13
DamienMcKennaReducing this to Major as it does not cause dataloss.
Comment #14
boyan.borisov CreditAttribution: boyan.borisov commented+1
Comment #15
maxplus CreditAttribution: maxplus commentedYes,
would be great if IPE could be able to use the admin theme!
Comment #16
Kevin P Davison CreditAttribution: Kevin P Davison commentedThis would be a solution for some of our problems w/ IPE. I was about to add a bug about how the IPE "Finish" and "Cancel" buttons are too close. We could just add some CSS to our theme, and would rather make it part of IPE. However, this would be resolved if we didn't have to include our front-end theming work with IPE. Makes more sense to make IPE use the admin theme.
Comment #17
freality CreditAttribution: freality commentedEven though I agree with the sentiment, this appears to be an issue with ctools modals more than IPE; as Panels utilizes ctools modals for these popovers. Any theme control for modals would need to be taken up with ctools.
Comment #18
dalinIn #1646654: Using admin theme in modal Earl seems to suggest that it's the responsibility of the module that defines the menu callbacks (FPP, Panels, etc.), however there must be something more going on here because all of the paths in question start with /admin/* and so are already considered urls that should use the admin theme.
Comment #19
dalinComment #20
dalinWe tried several back-end hooks and other tricks to get it to use the admin theme, but were unsuccessful.
Instead we decided to use some CSS to do a browser reset of the forms. Now they are at least usable. Attached is the SASS that we used. It's written with hopes of it being usable across projects, so hopefully someone else will be able to make use of this.