2011-08-28 26 views
38

Tôi hiện đang gửi email định dạng html từ hàm mail() của PHP và kiểm tra chúng đơn giản để đảm bảo chúng hiển thị dưới dạng HTML (định dạng sang một bên) Tôi biết rõ rằng định dạng sẽ thay đổi (có thể là quyết liệt) từ máy khách đến ứng dụng khách). Chúng được hiển thị dưới dạng HTML trong ứng dụng khách Apple Mail cũng như trên iPhone của tôi. Tuy nhiên, Gmail chỉ đơn giản từ chối hiển thị nó dưới dạng HTML. Và do đó tôi không có nghĩa là nó được định dạng không chính xác, nó chỉ đơn giản là không sử dụng HTML nó xuất hiện.Email được định dạng HTML không hiển thị ở tất cả trong Gmail nhưng hiện đang ở các ứng dụng thư khác

Phần lạ là một img từ một thẻ đang được tải, nhưng đó là về nó ... là nó mà tôi đang sử dụng divs cho bố trí và đó là quá mới cho Gmail hoặc một cái gì đó (vs bảng)?

Theo như CSS và những gì không đi, xem nguồn nguyên liệu cho thấy như sau:

<html><head><style>body { background-color: #F2F2F2; font-family: Arial; color: #5C5C5C; font-size: 11pt; } a { color: #46AAFF; text-decoration: none; } #container { width: 750px; margin-right: auto; margin-left: auto; } #header { float: right; padding: 3px; height: 30px; } #header a { color: #666666; margin-right: 10px; } #mainBody { padding: 20px; background-color: #FFF; border: 1px solid #DADADA; border-radius: 3px; } #imageArea { border-top: solid #E8E8E8 1px; margin: 15px; } #singleImageArea { width: 250px; padding: 15px; } #singleImageArea p { float: right; line-height: 30px; width: 130px; margin-top: 20px; } #footer { padding: 10px; color: gray; } #footer p { text-shadow: 0px 2px #FFF; font-size: 10pt; } #footer a { color: #ADADAD; float: right; padding-left: 20px; padding-right: 20px; } #footer img { width: 35px; height: 23px; padding: 10px; float: left; } </style></head><body><div id="container"><div id="header"><a href="http://appname.local/login/">Login</a></d 
iv><div style="clear: both;"></div><div id="mainBody"><h1>Hi Josh Holat!</h1>You've sent a request to <strong>reset</strong> your appname password. Just click the link below <em>(or copy and paste it into your browser)</em> and follow the instructions to set a new password. The link will expire in one hour.<br/><br/><a href="http://appname.local/sb/reset-password/?r=2768af61698fcde9c04f9449351575d6bfe6d720">http://appname.local/sb/reset-password/?r=2768af61698fcde9c04f9449351575d6bfe6d720</a><br/><br/>If you feel this request was submitted in error, don't worry; you can safely ignore this e-mail and your password will not be changed.<br/><br/>Much Love,<br/>Us</div><!-- #mainBody --><div id="footer"><img src="http://appname.local/images/email/footer_sb.png" /><p>&copy; 2011 appname, Inc. All Rights Reserved <a href="http://appname.local/sb/legal/">Legal</a><a href="http://appname.local/sb/contact/">Contact</a><a href="http://s 
tagebloc.local/sb/developers/">Developers</a><a href="http://appname.local/sb/blog/">Blog</a></p></div><!-- #footer --></div><!-- #container --></body></html> 

Cũng như:

Delivered-To: [email protected] 
Received: by 10.229.40.2 with SMTP id i2cs133298qce; 
     Sun, 28 Aug 2011 14:29:08 -0700 (PDT) 
Received: by 10.42.152.199 with SMTP id j7mr4419937icw.417.1314566947950; 
     Sun, 28 Aug 2011 14:29:07 -0700 (PDT) 
Return-Path: <[email protected]> 
Received: from joshholat.local (arh2281.urh.uiuc.edu [130.126.70.193]) 
     by mx.google.com with ESMTP id w3si6800550icz.109.2011.08.28.14.29.06; 
     Sun, 28 Aug 2011 14:29:06 -0700 (PDT) 
Received-SPF: neutral (google.com: 130.126.70.193 is neither permitted nor denied by best guess record for domain of [email protected]) client-ip=130.126.70.193; 
Authentication-Results: mx.google.com; spf=neutral (google.com: 130.126.70.193 is neither permitted nor denied by best guess record for domain of [email protected]) [email protected] 
Received: by joshholat.local (Postfix, from userid 70) 
    id 775063662E01; Sun, 28 Aug 2011 16:29:06 -0500 (CDT) 
To: Josh Holat <[email protected]> 
Subject: Password Reset Request 
X-PHP-Originating-Script: 501:Email.php 
From: appname <[email protected]> 
Content-type: text/html 
Message-Id: <[email protected]> 
Date: Sun, 28 Aug 2011 16:29:06 -0500 (CDT) 

Tôi đang bối rối là tại sao ba khách hàng bên sẽ cho thấy nó tốt nhưng Gmail chỉ đơn giản là bỏ qua nó?

+0

Bạn có thể đăng toàn bộ nguồn (bao gồm cả tiêu đề) của một trong các tin nhắn của bạn không? –

+0

Ví dụ HTML của bạn kết thúc sau khi mở '' -tag… – feeela

+0

Tôi đã thêm tất cả các tiêu đề cũng như phần còn lại của HTML – joshholat

Trả lời

67

Gmail không hỗ trợ thẻ <style>. Bạn cần sử dụng css nội tuyến để gmail hoạt động chính xác.

Đây là danh sách tham chiếu. http://www.campaignmonitor.com/css/

+13

Thật sao? Wow. Đó là khá xấu ... Cảm ơn bạn đã liên kết. – joshholat

+6

Thật tuyệt vời khi thấy một sự hỗ trợ xấu từ Gmail, một trong những dịch vụ email phổ biến nhất! Apple mail và Android 4 (Gmail) dường như đi trước với sự hỗ trợ. Tôi thực sự ngạc nhiên về Gmail mặc dù! –

+0

Chạy HTML của bạn thông qua [thư viện này] (https://github.com/tijsverkoyen/CssToInlineStyles) trước khi gửi thư, nó sẽ lấy phong cách từ đầu của bạn và phân tích chúng thành nội tuyến. –

29

GMail doesn't support<style> thẻ và cũng không có một số khách hàng. Để làm cho cuộc sống của bạn dễ dàng hơn, bạn có thể sử dụng chuyển đổi để chuyển đổi thẻ kiểu của bạn thành CSS nội tuyến: http://beaker.mailchimp.com/inline-css

+1

Đó là công cụ và liên kết dễ dàng nhất cho công việc này. Cảm ơn! – Patrick

2

Tôi thấy bạn đang sử dụng ID có tên #footer. Dường như Google không nhận ra tên đó khi xử lý thư. Lưu ý rằng trong mã phông chữ được thấy từ gmail, tất cả ID của bạn có thể xuất hiện với "exc" + idName, ngoại trừ #footer. Hãy thử sử dụng một tên khác.