Jump to content

Customizing Customer Notifications

Recommended Posts

I customized my customer notification header with my site logo, but my logo is white so it gets lost in the white background of the header. Does anyone know how I can adjust the coding to change the background color of the header? Thank you in advance!

Screen Shot 2020-04-20 at 4.59.15 PM.png

Link to comment
  • 1 month later...
  • Replies 7
  • Views 1k
  • Created
  • Last Reply

Hi,

How did you add your logo in the header of the customer notification header? 

Also, once I figured out the previous issue, I will have the same issue as you as my current logo in white. Have you found a solution for your problem?

 

Thank you in advance. 

 

Link to comment
  • 2 months later...

@Caterinad you can add the image to the header of all emails by going into Commerce > Customer Notifications> Header & Footer and then add this code to the header:

<center><img src="URL OF YOUR LOGO IMAGE FILE WITHIN THESE QUOTES" style="width:50%"></center>

You can change the width and remove the <center></center> tags if you dont want it centered.

I find the logo image file URL by right clicking on the logo on one of my site's pages and just selecting "Copy Image Address" using Chrome.

Link to comment
  • 1 month later...
22 hours ago, Mysistermade said:

Thank you 44degreesnorth  I have used this coding for my header and it looks good on screen but when i sent the test email the logo didn't appear. not sure what could be the problem?

Which code did you paste in email header/footer? Can you paste here, we can check easier.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 3 months later...
On 8/25/2020 at 5:25 PM, 44degreesnorth said:

@Caterinad you can add the image to the header of all emails by going into Commerce > Customer Notifications> Header & Footer and then add this code to the header:


<center><img src="URL OF YOUR LOGO IMAGE FILE WITHIN THESE QUOTES" style="width:50%"></center>

You can change the width and remove the <center></center> tags if you dont want it centered.

I find the logo image file URL by right clicking on the logo on one of my site's pages and just selecting "Copy Image Address" using Chrome.

So just pasting that in the actual header of the global email styles and replacing the link should make the logo appear?

Because mine is still just a bunch of text. 

It did detect the dimensions of the image and auto-included them in the link, but there's still no picture. (I also tried sending a test email and nothing has changed.)image.thumb.png.f72340bb2e20410f406f405d7c162120.png

 

Link to comment
21 hours ago, 44degreesnorth said:

@Sotiris, @Mysistermade the code I had posted earlier in 2020 was applicable for the customer notifications prior to the changeover to the new notifications style.  You can now change the logo in the Global Email Styles within Customer Notifications

See attached.

Screen Shot 2021-01-25 at 2.20.28 PM.png

In my case I am trying to upload a .svg to get a better quality heading, which is why I posted my question.

I'm aware of how to use them throughout my site, but haven't found a way to do so in my email header as well yet.

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.