CMS Development

egleeson
Mitwirkender/Mitwirkende | Elite Partner
Mitwirkender/Mitwirkende | Elite Partner

Blurry logo in header/footer

Hi,

 

I've tried a couple logo versions, all hi-res, and they all appear blurry in the header and footer. Any ideas? I've uploaded both png and jpeg files with transparent and non-transparent backgrounds and gone through the CSS to make sure there's no settings in there distorting the logo sizes.

 

Help!

12 Antworten
LegUp
Mitglied

Blurry logo in header/footer

I followed the instructions on this page and it worked perfectly. I created individual artboards for each logo version (square, horizontal, etc.); also put the artwork on its own layer; used the artboard export tool as described in article; I tested as both a 1x output and a 150ppi.

The 150 ppi came out super crisp.

https://www.quora.com/What-is-the-best-practice-for-exporting-logo-asset-files-in-Illustrator-CC-usi...

0 Upvotes
jehlen
Teilnehmer/-in

Blurry logo in header/footer

I found a solution that works for me. Instead of uploading an image file, I added a new image and linked it to my logo url from my wordpress website. For whatever reason, the logo in the email is super crisp. 

jennysowyrda
Community-Manager/-in
Community-Manager/-in

Blurry logo in header/footer

Thanks for sharing @jehlen

0 Upvotes
benvanlooy
Stratege/Strategin | Platinum Partner
Stratege/Strategin | Platinum Partner

Blurry logo in header/footer

0 Upvotes
BryZ
Mitglied

Blurry logo in header/footer

?noresize does not work. It looks like it does in the builder, but once you send the email it goes back to blurry. Really disspointing. 

liesbethhermans
Teilnehmer/-in

Blurry logo in header/footer

I'm having the same issue...

0 Upvotes
nstell
Teilnehmer/-in

Blurry logo in header/footer

I had this issue for months. Try embedding your logo into a Rich Text Module (and add any custom coding necessary) and use that in place of the Global Logo Module.

 

After several back-and-forths with customer support, it seems like, at least in our case, the Global Logo Module was what was causing the logo to render poorly. According to the support rep I worked with:

 

"As the logo modules are designed to be user friendly there is a bit of a tradeoff to writing the source code in a custom fashion."

 

I was able to come up with a workaround that might provide you with a better image quality. If you look at the 1 column template you will see that there is a rich text module above the logo. I edited the source code of the module to be the following:

 

<div style="max-width: 300px;"><img src="https://xyz123.png" style="max-width: 100%;"></div>" 

liesbethhermans
Teilnehmer/-in

Blurry logo in header/footer

What works for me as well is using an .svg format for the logo

0 Upvotes
jonathanking
Teilnehmer/-in

Blurry logo in header/footer

SVG format will not work in email, so you are still going to have the pixelation issues.

0 Upvotes
Anonymous
Nicht anwendbar

Blurry logo in header/footer

Hi,

 

Can you share the preview link once?

SaraLynnn1
Mitwirkender/Mitwirkende

Blurry logo in header/footer

I had this issue too. Try saving your logo as a SVG file and using that--this worked for me and made the logo appear nice and crisp.

0 Upvotes
jonathanking
Teilnehmer/-in

Blurry logo in header/footer

SVGs won't work for in gmail, so unforatuntely this fix won't work for your email sends.

0 Upvotes