Image pixelation problems when previewing and uploading as a wordpress theme

Question

Hello,

I'm new to Template Toaster, and Wordpress, but I used to build websites with dreamweaver years ago.

I'm trying to make my logo look the same quality as the original image.
I've tried saving it as a PNG and JPEG, as a large file, and as the same sized file as if I screen shot the preview.
I've also tried using the logo function, and the foreground image function.

The issue I'm having is my image looks great in Photoshop and Template Toaster. But in both preview version in Chrome, and even uploaded to wordpress as the actual theme and seen through Chrome. The image becomes pixelated. I also tried using one of the stock image people photos in the header and it does the same to that.

Internet Explorer isn't pixelated, but the entire header is much smaller than it's meant to be.

I'm guessing it's related to the width and height which seems to give dimensions different to it's actual display size, but I don't know how to correlate that to have the correct measurement to actual image size without pixelating in Chrome.

What am I doing wrong?

I have just tried to upload the screenshots into this post, but funnily enough it shatters the screenshots into low quality so they're not much use.

You can see the pixelated logo here through Chrome: http://www.jamestheartist.com/

Answer 1

Hi,

Please open a support ticket  and send some screenshot of your problem with your site URL for the quick solution: http://templatetoaster.com/support/.

 

 

Comments

Hello,

After two days of research I've realised I'm not actually doing anything wrong. Template Toaster itself is using my true image so the resolution is okay. But once it's in Chrome, it's reduced in size (To the correct pixel size from height and width). What Chrome seems to do is zoom in as standard which is actually the same display size as Template Toaster, unlike Explorer which doesn't and appears smaller but at the correct resolution. Thus Chrome gives pixelated logos as standard.

I've noticed it on every website I've looked at in Chrome and Explorer now regardless of the company.

The solution appears to be to save the logo as a vector SVG file and hard code it to work in wordpress with Chrome. Explorer probably won't read it, so I need to add a PNG file to load in it's place incase of an error.
So I'll have to work out how to do that.

Ahh the joys of web design.