Site logo: set square aspect ratio by default with opt out for themes

[annezazu]

To make the Site Logo block a bit more opinionated, let's consider setting the default option to square/1:1 with the option for themes to opt out or to provide a set aspect ratio that's better suited for the theme design. I'm curious to hear from @WordPress/gutenberg-design and @WordPress/block-themers around this too as this would change the default of how the site logo block would work. This would still leave the aspect ratio/cropping tools for users to change back and theme authors could override the default.

[scruffian]

This isn't trivial. The Site Logo block doesn't do any cropping on its own, it uses the WordPress tools to achieve this and when it saves the cropped image it syncs it back to the site icon. We could apply some cropping on the block via CSS but then this wouldn't apply to the site icon, so I would advise against it.

[jasmussen]

This would not be a hard crop, it would be a soft-crop, same as what the Aspect Ratio tool does for the Image block. So what I'm reading here, and agree with, is a desired behavior of new Site Logo blocks being inserted defaulting to have a 1:1 square aspect ratio applied to the placeholder. Further, that this aspect ratio, as well as width and height, persist even when you add an image, or add a different image, regardless of those other images aspect ratios or dimensions.

Here's a mockup that advances the site logo a little bit in that regard:

New in this mockup, compared to trunk:

• There's no button in the placeholder itself, only "Add media" in the toolbar, based on this feedback.
• "Add media" is, as mentioned, added to the toolbar.
• Dimensions—width, height, aspect ratios—are shown in the inspector, in place of the "Image width" that's there currently. Note that these dimensions are shown both for placeholder and final states.
• Resize handles are added.

These mockups show a slightly longer view, and we can start with less, such as simply adding the aspect ratio control, and making it persist between placeholder and final states.

[richtabor]

Should the add control be "Add logo" to be a bit more apparent?

[jasmussen]

Good point. I also missed updating the block toolbar when one is set. Here are fresh ones:

Figma.

[carolinan]

Related: #40838

[luminuu]

I'd rather make this opt-in instead of forcing themes to opt-out. This will be annoying for existing themes if they're used on a site with a site logo set that isn't 1:1, that would suddenly become cropped or squished together. It might also be confusing for users why suddenly the logo is not working as expected, if they are used to the image being displayed with the original aspect ratio.

[jasmussen]

The way I'm understanding "opt-out" is this:

• If you are building a template and insert a site logo block, it defaults to a 1:1 aspect ratio applied.
• If you select this site logo block and set it to have its original aspect ratio, then save your template, your theme has opted out.

To that end, this is more of the default Site Logo block experience, than any separate theme opt-outs.

[richtabor]

To that end, this is more of the default Site Logo block experience, than any separate theme opt-outs.

That's my thinking as well.

[Sam-Xronn]

Isn't it time to remove the site logo block now?

It's purpose has been super seeded by recent updates to the site editor. I understand why it was initially added, but it continues to cause so many more issues than it solves, I'm unsure why we're continue to push this block.

[ndiego]

It's purpose has been super seeded by recent updates to the site editor. I understand why it was initially added, but it continues to cause so many more issues than it solves, I'm unsure why we're continue to push this block.

The Site Logo block is commonly used in most block themes, often in Header template parts. For those that don't need this block, it can easily be disabled.

[Sam-Xronn]

It's purpose has been super seeded by recent updates to the site editor. I understand why it was initially added, but it continues to cause so many more issues than it solves, I'm unsure why we're continue to push this block.

The Site Logo block is commonly used in most block themes, often in Header template parts. For those that don't need this block, it can easily be disabled.

It's commonly used due to it's early addition to the block editor not due to how useful it is. It no longer offers any apparent benefits compare to the image block. My concern is the continued waste of time diluting blocks into a level granularity not required. For example...

• Logo block doesn't support custom links, although a design system existing for this (image block). Making it useless to anyone running WP on a subdomain e.g. jobs. events. store. blog. etc...
• Favicon support added to settings >general making it redundant (it's only real benefit)
• No support for multiple headers e.g. dark and light logos
• No aspect ratio support

It's not about showing/hiding the block and more about a confusing and poor UX. Of course you'd select the logo block to use as your logo if it exists, only to find out it offers no value and remove it and add an image block. Huh!

[ndiego]

• Logo block doesn't support custom links, although a design system existing for this (image block). Making it useless to anyone running WP on a subdomain e.g. jobs. events. store. blog. etc...
• Favicon support added to settings >general making it redundant (it's only real benefit)
• No support for multiple headers e.g. dark and light logos
• No aspect ratio support

Fair points. I wonder if extending the Image block to include a few new controls, like "Use as site logo" and deprecating the Site Logo block, would be a possible approach. Backward compatibility might be a nightmare, but we could then introduce an Image block variation called Site Logo so it's easy to find in the block inserter. This would provide the benefits of having a dedicated "block" for the Site Logo, but it would be powered by the Image block. 🤔

[Sam-Xronn]

Backward compatibility might be a nightmare, but we could then introduce an Image block variation called Site Logo so it's easy to find in the block inserter.

This was a concern of mine, how possible the removal of a core block would be. Not sure if you could tie into the JSON versioning.

I'm still confused what a "Use site logo" option would change? As far as I'm aware the site logo doesn't change anything apart from offer an optional link to site homepage link which you can apply on an image. Or the ability to use as the site icon which should is now controlled in Settings > General.

To avoid hijacking this thread further I wonder if we could have a wider discussion on this topic in its own issue?

[richtabor]

Fair points. I wonder if extending the Image block to include a few new controls, like "Use as site logo" and deprecating the Site Logo block, would be a possible approach. Backward compatibility might be a nightmare, but we could then introduce an Image block variation called Site Logo so it's easy to find in the block inserter. This would provide the benefits of having a dedicated "block" for the Site Logo, but it would be powered by the Image block.

As I mentioned #63954 (comment), sure we can configure an image block to be the logo, home url, etc, but it will always be more complicated than the Site Logo block, which you can add with one click, with much more limited control than an image block. But if a user wants to use an image block for a site logo, that's also just as fine—accepting the limitations of that route all the same.

But let's keep this issue focused on the aspect ratio control being applied to the Site Logo block.