WordPress.org

Make WordPress Core

Opened 8 months ago

Last modified 5 months ago

#40338 new defect (bug)

Twenty Seventeen: Layout broken and JS error in `wp-activate.php`

Reported by: flixos90 Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: 4.7
Component: Bundled Theme Keywords: has-screenshots has-patch needs-testing
Focuses: multisite Cc:

Description

In a Multisite setup with registrations enabled, one can access the wp-activate.php and wp-signup.php pages which use the header and footer as well as stylesheets and scripts of the current themes. It appears that the Twenty Seventeen theme was not optimized for these pages, particularly for wp-activate.php: The layout on that page is broken (no padding at all on the left side of the screen), and there is also a JavaScript error occurring.

I haven't looked into this more closely yet, but I just wanted to open this ticket for now. I can have a closer look probably later next week, if no-one gets there before. :)

Attachments (1)

40338.diff (2.4 KB) - added by xkon 5 months ago.
Fixes the js top error and activate styling

Download all attachments as: .zip

Change History (7)

#1 @adamsilverstein
8 months ago

I wasn't able to reproduce the JS error, I do see formatting issues on both pages. In addition top the lack of a left margin on the activate page, both pages forms stretch full width and push the sidebar widgets to the bottom of the page. When submitting signup form with an error, the resulting page shows the splash screen, the form is offscreen, below the visible area.

#2 @afercia
8 months ago

  • Keywords has-screenshots added

To reproduce the JS error:

  • make sure there's at least one widget in the sidebar
  • keep your browser's console closed
  • go to the signup or activate page, e.g.: mysite.com/wp-activate.php
  • open your browser's console

The JS error disappear after a page refresh.

Screenshot:

https://cldup.com/YbNOr_NSEi.jpg

#3 @afercia
8 months ago

Seems the styling issue is not limited to Seventeen, Twenty Fourteen has the same issue. Here's some screenshot for comparison, haven't checked Twenty Thirteen and the previous ones.

Twenty Seventeen:

https://cldup.com/F6a25VNuWC.jpeg
https://cldup.com/TLhJf20lcf.jpeg

Twenty Sixteen:

https://cldup.com/J3cXOHlOlF.jpeg
https://cldup.com/uI5Kt_eT3y.jpeg

Twenty Fifteen:

https://cldup.com/zlN-xmmfjo.jpeg
https://cldup.com/9gKEMhUov0.jpeg

Twenty Fourteen:

https://cldup.com/168L8egYmK.jpeg
https://cldup.com/uEvHZ72xSj.jpeg

This ticket was mentioned in Slack in #core-multisite by jeremyfelt. View the logs.


8 months ago

@xkon
5 months ago

Fixes the js top error and activate styling

#6 @xkon
5 months ago

  • Keywords has-patch needs-testing added; needs-patch removed

Hello, 40338.diff should solve all the issues.

I added 2 custom css styles for the body when you are viewing the wp-activate.php and wp-signup.php width wp-activate-page and wp-signup-page to address the js issue. It was caused because there is no sidebar rendered on these pages and the script was still trying to set the offsets for it with sidebarPosBottom = sidebarPos.top + ( $sidebar.height() + 28 ); in global.js .

TwentyFourteen is a minor css fix.

All these where tested under a Multisite install so be kind if somebody can to make a test on a single as well to be safe in case of extra errors.


Note: the js error is produced ONLY with an embeded developer console because you need to resize the height of it so the window changes height to trigger the offset js.

I had my console on an extra window and was never getting an error as well but I saw afercias screenshot and just had the shiny idea to test it that way! :D


Best regards,
Konstantinos

Last edited 5 months ago by xkon (previous) (diff)
Note: See TracTickets for help on using tickets.