studiopress / genesis-sample

This is the sample theme created for the Genesis Framework.
https://demo.studiopress.com/genesis-sample/
528 stars 285 forks source link

Fix/logo cls #372

Closed dreamwhisper closed 3 years ago

dreamwhisper commented 3 years ago

CLS occurs when a custom logo is set. Since the logo height is variable, there may be more or less impact on CLS.

This PR uses aspect ratio to reserve the logo space.

How to test

  1. Use Genesis 3.3.3 and this branch.
  2. Under Appearance > Customize > Site Identity, upload a logo.
  3. Adjust the Logo Width as desired.
  4. Close the customizer and run some tests with Chrome dev tools, https://developers.google.com/speed/pagespeed/insights/ and https://web.dev/measure/
  5. Adjust the Logo Width a few times to make sure the logo size looks correct on the front end. Note that the aspect ratio is not added in the customizer.
  6. Repeat with logos of varying sizes.

Documentation

No documentation required.

Suggested changelog entry

Notes