Refactoring of custom header page

[ocean90]

I did a refactoring of the custom header page:

Changes:

• added no-js support
• removed unused JS code
• changed the jQuery plugin for cropping, now imgAreaSelect
• improved layout
• added transparency option to wp_crop_image(), otherwise we have the ugly black background
• fixed several bugs (#13214, #12469)
• used new cap edit_theme_options, see ​wpdevel

[johnonolan]

Additional issue: Layout breaks at 1024px wide, suggest using floated divs rather than table for displaying header image options.

[ocean90]

In the second patch:

• fixed layout, thx johnonolan
• fixed small bugs
• updated functions.php of 2010, because the old styles aren't needed anymore

[ocean90]

without clean up

[momo360modena]

This patch work well on my trunk install. Nice work.

[ocean90]

updated to trunk

[ocean90]

Updated to trunk, Valid HTML

[nacin]

I've looked over this. I like it, but it introduces some new complexity.

First, we should entirely scrap transparency. Way too close to release for that, it should be saved for 3.1.

The image preview is cut off. If we remove all but the width attribute from .appearance_page_custom-header #headimg img (and thus, only have width:100% and no absolute positioning) and remove the calculated height from #headimg, then the image will scale to the width of the page.

NO_HEADER_TEXT should probably be a true/false check, not a defined check. Perhaps we define it as false if it isn't defined, early on, and then we can simply assess NO_HEADER_TEXT throughout.

Remove the CDATA blocks -- #11939.

Also, in the future, it may be a good idea to ignore whitespace for lines that aren't changed when doing major refactoring -- it is much more difficult to analyze. Better to do that as a follow-up.

Overall, some very good improvements here. After saying it for a week, I would really like to check this in soon.

[nacin]

Also, closed #12469 as a duplicate.

[ocean90]

Thx for your comment.

First, we should entirely scrap transparency. Way too close to release for that, it should be saved for 3.1.

Because of that reason I created the ticket with the patch 13 days ago, but okay, I remove it and create a new ticket #13411.

The image preview is cut off.

Please check this again, it should work, see ​http://screenr.com/URp

NO_HEADER_TEXT should probably be a true/false check

Yup, I introduce header_text() for this check. true = show text, false = hide text.

Remove the CDATA blocks

No! It should be valid,otherwise it is not valid. Harke only want to improve them, see also azaozz comment.

Overall, some very good improvements here. After saying it for a week, I would really like to check this in soon.

Fine. Patch comes. :)

[nacin]

Please check this again, it should work, see ​http://screenr.com/URp

But it's distorted. We can easily have it properly scale with its aspect ratio with the right CSS.

No! It should be valid,otherwise it is not valid. Harke only want to improve them, see also azaozz comment.

I'm not adding them through this ticket. It would need to come through #11939.

[ocean90]

see comment above

[JohnONolan]

Replying to nacin:

Please check this again, it should work, see ​http://screenr.com/URp

But it's distorted. We can easily have it properly scale with its aspect ratio with the right CSS.

I completely agree, this is a must.

[ocean90]

Better scale for header image

[nacin]

Also closed #12468 as a duplicate.

[ryan]

Refactoring time is past. We need to reduce this down to must have bug fixes.

[ocean90]

updated to trunk

[ocean90]

I have removed the withspaces clean up. I would recommend to add this patch to the core because the current header page is hair-raising and at the moment, sry, the ugliest page of WordPress.
Also don't forget, with the nice 2010 theme the user will visit the Custom Header page often.
We should make an exception in this case, please.

[ryan]

Ugly is not broken.

Will themes have to update their admin header style callbacks?

[ryan]

Lots of themes style #headimg, #headimg h1, and #headimg #desc in their admin header callback. They don't look so good with the patch. I do think the admin looks a lot better though.

[ocean90]

Which bugs are fixed and changes are in my patch?

• define('NO_HEADER_TEXT', false); doesn't work, it hides the button too, it shows only if the line is removed
• You can only change the status/color of the header text if you have set a header image, why not without an image?
• JS bugs hide_text not defined or container not defined
• Text color buttons are useless if javascript is disabled.
• If the screen resolution is 1024x800 the layout will be broken, see ​http://grab.by/4yKf
• display: none; for #headimg h1 and #headimg #desc was needed, because WordPress doesn't have handled it itself and it should do it.
• Same for #headimg styling. Because of that the layout can be broken, see above, WordPress should handle this by itself.
• It is not possible to reset the image to the original image only if empty($this->default_headers) == true, but the orignal image should be HEADER_IMAGE.
• Do not use remove_theme_mods(), because it removes ALL theme mods.
• A table for default headers is not flexible enough, it can break the layout too, see above.
• Wrong page title "Your Header Image", you cannot only customize the image also the text.
• And at least the layout: Current is ​http://grab.by/4yMF and with my patch it will look like this ​http://grab.by/4yMM

---

Will themes have to update their admin header style callbacks?

If they only changed the color/font-style no, if the changed positions then perhaps, but I think if they want to change the position or something else like that, they should better use admin_image_div_callback, that would be saver. But I could try to improve this point.

[ryan]

I like the patch; it looks good and fixes bugs. But, every theme I've tried that styles the header text in the admin header callback look awful.

[ryan]

Random sampling: Vigilance and Daydream

[ocean90]

I will now working on the image/text preview. At the moment it kills the preview mostly on wp.com blogs.

[ocean90]

Revert the old header preview

[ryan]

(In [14907]) Custom header fixes and rework. Props ocean90. fixes #13231