In the Logo source settings, choose either Image logo to upload or select a logo image file, or SVG logo to paste the logo as inline SVG code into a rich-text field.
Logo block
Updated last month
The Logo block displays your store logo in a section, either as an uploaded image or as inline SVG code, with the option to fall back to your shop name.
Logo source
Choose one of two ways to supply the logo. The shop name fallback covers a missing or empty logo.
Setting | Description | Default |
|---|---|---|
Image logo | An image picker for uploading or selecting the logo as an image file. | ā |
SVG logo | A rich-text field for pasting the logo as inline SVG code. | ā |
Enable shop name fallback | Renders your shop name when no image or SVG logo is provided. | On |
Size
The Width unit decides how the logo is sized, and the width field shown depends on the unit. Custom mobile size reveals separate mobile width fields.
Setting | Description | Default |
|---|---|---|
Width unit | Whether the width is set in pixels or percent. | px |
Width (px) | Logo width in pixels, from 20 to 600. Shown when the width unit is px. | 150 |
Width (%) | Logo width as a percent of the container, from 10 to 100. Shown when the width unit is %. | 100 |
Custom mobile size | Turns on separate width unit and width fields for mobile. When off, the desktop width applies on mobile. | Off |
Mobile width unit | Whether the mobile width is set in pixels or percent. Shown when Custom mobile size is on. | px |
Mobile width (px) | Logo width on mobile in pixels, from 20 to 400. Shown when Custom mobile size is on and the mobile width unit is px. | 100 |
Mobile width (%) | Logo width on mobile as a percent of the container, from 10 to 100. Shown when Custom mobile size is on and the mobile width unit is %. | 100 |
Layout and visibility
These settings control the block's spacing, alignment, color scheme, and which devices it appears on.
Setting | Description | Default |
|---|---|---|
Margin top (Desktop) / (Mobile) | Space above the block, from 0 to 34. | 0 |
Content alignment on desktop / on mobile | Horizontal alignment of the logo. | Left |
Hide block on desktop / on mobile | Hides the block on the chosen device. | Off |
Enable color scheme / Color scheme | Applies a color scheme to the block. The scheme applies only when enabled and a scheme is chosen. | Off / Scheme 1 |
FAQ
How do I add a logo to the Pops Logo block?
What happens in Pops when I don't add a logo image or SVG?
When no image or SVG logo is provided, the block renders your shop name instead. The Enable shop name fallback setting controls this and is on by default.
How do I resize the logo in the Pops Logo block?
Set the Width unit to pixels or percent. In pixels the logo width ranges from 20 to 600 (default 150); as a percent of the container it ranges from 10 to 100 (default 100).
Can I use a different logo size on mobile in Pops?
Yes. Turn on Custom mobile size to reveal separate mobile width unit and width fields. When it is off, the desktop width applies on mobile.
How do I hide the Pops Logo block on a specific device?
Use the Hide block on desktop / on mobile settings to hide the block on the chosen device. Both are off by default.
Can I apply a color scheme to the Pops Logo block?
Yes. Enable the color scheme setting and choose a scheme. The scheme applies only when it is enabled and a scheme is chosen; the default is off with Scheme 1 selected.