Smart Centered Logo Header for OXYGEN BUILDER

This remarkable addition to our toolkit will revolutionize the way you design and present your website headers.

🎯 No More Manual Adjustments: With this plug-and-play header, your logo automatically adjusts its position without the need for any manual input. Simply set up your layout as you desire it to appear if the logo were not centered, and let our component take care of the rest.

🧐 Automatic Centering Rules:

The logo will stay perfectly centered among your menu items under the following conditions:

1. There is an equal number of menu items on either side of the logo.

2. Strict Mode is enabled, and the logo remains within a specified tolerance level (as shown in the image with the red outline). For example, if the tolerance is set to 10 pixels, the logo will stay centered as long as it does not deviate more than 10 pixels from the center on either side.

3. In Strict Mode, the number of characters in the menu items is evenly distributed within the tolerance limit.

👁️ Visual Centering Indicator:

To provide you with a clear visual guide on the logo's centering, our component includes a logo centering indicator (as seen in the image, a green vertical bar). This indicator helps you understand how well the logo aligns with the tolerance level outlined in red.

🔄 Fallback to Builder Layout:

If the logo is not centered according to the defined rules, it will gracefully default to the layout settings you have configured in your builder. You also have the flexibility to choose specific breakpoints, such as on tablet portrait, to disable the centered logo feature.

🆕 Force Center the Logo Always:

This feature ensures that your logo remains centrally positioned within the viewport, even when adjacent menu items contain more characters than desired. Say goodbye to logo displacement due to lengthy menu items!

🔗 Compatibility:

Our Automatic Logo Centering Header is fully compatible with Oxygen site Navigation element and WP Nav elements, making it a seamless addition to your existing website setup.