Add or Change Your Logo

Your logo is the visual cornerstone of your brand’s identity — often the first thing visitors notice. Shock lets you set several logo variants (standard, sticky, and mobile) plus a browser site icon, all from one place.

Set your logos

1. Open Branding.

   From your WordPress panel, go to Shock » Branding.

2. Upload your logo variants.

   Set the options that apply to your site:

   • Logo — your main logo file.
   • Sticky Logo — shown when the navbar sticks while scrolling.
   • Mobile Logo — shown only on mobile devices.
   • Logo Height — the logo’s height in pixels; the width scales automatically.
   • Site Icon — the favicon shown in browser tabs, bookmarks, and the WordPress mobile apps.

3. Save your changes.

   Click Publish to apply.

Give the sticky logo enough contrast

The sticky logo appears over your header once it condenses on scroll, which may have a different background. Upload a variant that stays legible there — for instance, a light version of your logo if the sticky header is dark.

Prefer a transparent PNG or SVG

Use a logo with a transparent background so it sits cleanly on any header color, and provide it at roughly twice the display size so it stays crisp on high-resolution screens.

You can also add a logo through the Navbar widget when building with Elementor, which works independently of the logo set here. See Building the Navbar for details on that widget.