2015-01-03 6 views
-1

안녕하세요. 이미지를 포함한 이메일을 보내고 싶습니다.iPhone의 HTML 이메일에 이미지가 표시되지 않습니다.

<html> 
<body paddingwidth="0" paddingheight="0" bgcolor="#d1d3d4" style="padding-top: 0; padding-bottom: 0; padding-top: 0; padding-bottom: 0; background-repeat: repeat; width: 100% !important; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;" offset="0" toppadding="0" leftpadding="0"> 

    <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tableContent bgBody" align="center" bgcolor="#F6F6F6" style='font-family:Helvetica, Arial,serif;'> 
    <tr> 
     <td> 
     <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
      <tr> 
      <td class='movableContentContainer' > 


       <div class='movableContent'> 
       <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
        <tr><td height='25' colspan='3'></td></tr> 

        <tr> 
         <td valign='top' colspan='3'> 
         <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
          <tr> 
          <td align='left' valign='middle' > 
           <div class="contentEditableContainer contentImageEditable"> 
           <div class="contentEditable" > 
            <img src="mailtest/images/logo.png" alt='Compagnie logo' data-default="placeholder" data-max-width="301" width='301' height='78' > 
           </div> 
           </div> 
          </td> 

          <td align='right' valign='top' > 
           <div class="contentEditableContainer contentTextEditable" style='display:inline-block;'> 
           <div class="contentEditable" > 
            <a href="[SHOWEMAIL]" style='color:#A8B0B6;font-size:13px;text-decoration:none;'>Open in your browser </a> 
           </div> 
           </div> 
          </td> 
          <td width='18' align='right' valign='top'> 
           <div class="contentEditableContainer contentImageEditable" style='display:inline-block;'> 
           <div class="contentEditable" > 
            <a href="[SHOWEMAIL]"><img src="mailtest/images/openBrowser.png" alt='open in browser image' data-default="placeholder" width='15' height='15' style='padding-left:10px;'></a> 
           </div> 
           </div> 
          </td> 
          </tr> 
         </table> 
         </td> 
        </tr> 
       </table> 
       </div> 

       <div class='movableContent'> 
       <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
         <tr><td height='25' ></td></tr> 

         <tr> 
          <td height='290' class='bgItem'> 
          <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 

           <tr><td height='50' ></td></tr> 

           <tr> 
           <td width='350' > 
            <div class="contentEditableContainer contentImageEditable"> 
            <div class="contentEditable" > 
             <img src="mailtest/images/bigImg.png" alt='featured image' data-default="placeholder" data-max-width="300" width='326' height='269' > 
            </div> 
            </div> 
           </td> 
           <td width='250' valign='top'> 
            <table width="250" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
            <tr><td colspan='3' height='10'></td></tr> 

            <tr> 
             <td width='10'></td> 
             <td width='230' valign='top'> 
             <table width="230" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
              <tr> 
              <td valign='top'> 
               <div class="contentEditableContainer contentTextEditable"> 
               <div class="contentEditable" > 
                <h1 style='font-size:24px;font-weight:normal;color:#ffffff;line-height:19px;'>Application 2.0</h1> 
               </div> 
               </div> 
              </td> 
              </tr> 
              <tr><td height='18'></td></tr> 
              <tr> 
              <td valign='top'> 
               <div class="contentEditableContainer contentTextEditable"> 
               <div class="contentEditable" > 
                <p style='font-size:13px;color:#cfeafa;line-height:19px;'>What does the app do?</p> 
               </div> 
               </div> 
              </td> 
              </tr> 
              <tr><td height='33'></td></tr> 
              <tr> 
              <td> 
               <div class="contentEditableContainer contentTextEditable"> 
               <div class="contentEditable" > 
                <a href="#" style='padding:15px;font-size:13px;text-decoration:none;background:#1C80C9;color:#E5F5FF;border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;'>Learn more, noob</a> 
               </div> 
               </div> 
              </td> 
              </tr> 
              <tr><td height='15'></td></tr> 
             </table> 
             </td> 
             <td width='10'></td> 
            </tr> 
            </table> 
           </td> 
           </tr> 

           <tr><td height='25'></td></tr> 
          </table> 
          </td> 
         </tr> 

         <tr><td height='25' ></td></tr> 
       </table> 
       </div> 


       <div class='movableContent'> 
       <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'><tr><td> 
       <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
        <tr><td colspan='3' height='25'></td></tr> 
        <tr> 
        <td width='50'></td> 
        <td width='500'> 
         <table width="500" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
         <tr> 
          <td align='center'> 
          <div class='contentEditableContainer contentTextEditable'> 
           <div class='contentEditable'> 
           <h1 style='font-size:32px;'>Introducing INvitor! 
           </h1> 
           </div> 
          </div> 
          </td> 
         </tr> 
         <tr><td height='20'></td></tr> 
         <tr> 
          <td align='center'> 
          <div class='contentEditableContainer contentTextEditable'> 
          <div class='contentEditable'> 
           <p >Benefits for users.<br> 
           Available on (when is it available?) on (platform? Chrome store? Desktop? PC? Mac? iPhone?) 
           </p> 
          </div> 
          </div> 
         </td> 
         </tr> 
        </table> 
        </td> 
        <td width='50'></td> 
       </tr> 
       <tr><td colspan='3' height='45'></td></tr> 
       </table> 
       </td></tr></table> 
      </div> 

      <div class='movableContent'> 
      <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'><tr><td> 
       <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" > 
       <tr><td height='10'>&nbsp;</td></tr> 
       <tr><td style='border-bottom:1px solid #DDDDDD'></td></tr> 
       <tr><td height='10'>&nbsp;</td></tr> 
       </table> 
       </td></tr></table> 
      </div> 

      <div class='movableContent'> 
      <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'><tr><td> 
       <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
       <tr><td colspan='3' height='10'></td></tr> 
       <tr> 
        <td width='30'></td> 
        <td width='540'> 
        <table width="500" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
         <tr> 
         <td align='center'> 
          <div class='contentEditableContainer contentTextEditable'> 
          <div class='contentEditable'> 
           <p >It’s been downloaded...</p> 
          </div> 
          </div> 
         </td> 
         </tr> 
         <tr><td height='30'></td></tr> 
         <tr> 
         <td> 
          <div class='contentEditableContainer contentTextEditable'> 
          <div class='contentEditable'> 
           <table width="500" border="0" cellspacing="1" cellpadding="20" align="center" valign='top'> 
           <tr> 
            <td align='center' bgcolor='#444444' style='border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;color:#ffffff;font-size:28px;'>1</td> 
            <td align='center' bgcolor='#444444' style='border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;color:#ffffff;font-size:28px;'>3</td> 
            <td align='center' bgcolor='#444444' style='border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;color:#ffffff;font-size:28px;'>3</td> 
            <td align='center' style='color:#444444;font-size:28px;'>,</td> 
            <td align='center' bgcolor='#444444' style='border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;color:#ffffff;font-size:28px;'>3</td> 
            <td align='center' bgcolor='#444444' style='border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;color:#ffffff;font-size:28px;'>3</td> 
            <td align='center' bgcolor='#444444' style='border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;color:#ffffff;font-size:28px;'>7</td> 
           </tr> 
           </table> 
          </div> 
          </div> 
         </td> 
         </tr> 
         <tr><td height='45'></td></tr> 
         <tr> 
         <td align='center'> 
          <div class='contentEditableContainer contentTextEditable'> 
          <div class='contentEditable'> 
           <a href="#" class='link2'>Grab one quick! 
           </a> 
          </div> 
          </div> 
         </td> 
         </tr> 
        </table> 
        </td> 
        <td width='30'></td> 
       </tr> 
       <tr><td colspan='3' height='45'></td></tr> 
       </table> 
       </td></tr></table> 
      </div> 

      <div class='movableContent'> 
      <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'><tr><td> 
       <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" > 
       <tr><td height='10'>&nbsp;</td></tr> 
       <tr><td style='border-bottom:1px solid #DDDDDD'></td></tr> 
       <tr><td height='10'>&nbsp;</td></tr> 
       </table> 
       </td></tr></table> 
      </div> 

      <div class='movableContent'> 
      <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'><tr><td> 
       <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
       <tr><td colspan='5' height='30'></td></tr> 
       <tr> 
        <td> 
        <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
         <tr> 
         <td width='166' valign='top'> 
          <table width="166" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
          <tr> 
           <td> 
           <div class='contentEditableContainer contentImageEditable'> 
            <div class='contentEditable'> 
            <img src="mailtest/images/featured1.png" alt='featured image' data-default="placeholder" data-max-width="166" width='165' height='165' > 
            </div> 
           </div> 
           </td> 
          </tr> 
          <tr><td height='22'></td></tr> 
          <tr> 
           <td align='center'> 
           <div class='contentEditableContainer contentTextEditable'> 
            <div class='contentEditable'> 
            <h2>First Feature</h2> 
            </div> 
           </div> 
           </td> 
          </tr> 
          <tr><td height='22'></td></tr> 
          <tr> 
           <td align='center'> 
           <div class='contentEditableContainer contentTextEditable'> 
            <div class='contentEditable'> 
            <p >A feature is a tangible aspect of the product.</p> 
            </div> 
           </div> 
           </td> 
          </tr> 
          </table> 
         </td> 
         <td width='51'></td> 
         <td width='166' valign='top'> 
          <table width="166" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
          <tr> 
           <td> 
           <div class='contentEditableContainer contentImageEditable'> 
            <div class='contentEditable'> 
            <img src="mailtest/images/featured2.png" alt='featured image' data-default="placeholder" data-max-width="166" width='165' height='165' > 
            </div> 
           </div> 
           </td> 
          </tr> 
          <tr><td height='22'></td></tr> 
          <tr> 
           <td align='center'> 
           <div class='contentEditableContainer contentTextEditable'> 
            <div class='contentEditable'> 
            <h2>Second Feature</h2> 
            </div> 
           </div> 
           </td> 
          </tr> 
          <tr><td height='22'></td></tr> 
          <tr> 
           <td align='center'> 
           <div class='contentEditableContainer contentTextEditable'> 
            <div class='contentEditable'> 
            <p >Instead, you can talk about benefits 
            </p> 
            </div> 
           </div> 
           </td> 
          </tr> 
          </table> 
         </td> 
         <td width='51'></td> 
         <td width='166' valign='top'> 
          <table width="166" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
          <tr> 
           <td> 
           <div class='contentEditableContainer contentImageEditable'> 
            <div class='contentEditable'> 
            <img src="mailtest/images/featured3.png" alt='featured image' data-default="placeholder" data-max-width="166" width='165' height='165' > 
            </div> 
           </div> 
           </td> 
          </tr> 
          <tr><td height='22'></td></tr> 
          <tr> 
           <td align='center'> 
           <div class='contentEditableContainer contentTextEditable'> 
            <div class='contentEditable'> 
            <h2>Third Feature</h2> 
            </div> 
           </div> 
           </td> 
          </tr> 
          <tr><td height='22'></td></tr> 
          <tr> 
           <td align='center'> 
           <div class='contentEditableContainer contentTextEditable'> 
            <div class='contentEditable'> 
            <p >Or the problems (pain points) your app helps with</p> 
           </div> 
           </div> 
          </td> 
          </tr> 
         </table> 
         </td> 
        </tr> 
        </table> 
       </td> 

       </tr> 
       <tr><td colspan='5' height='45'></td></tr> 
      </table> 
      </td></tr></table> 
      </div> 

      <div class='movableContent'> 
       <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
        <tr> 
        <td> 
         <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 
         <tr> 
          <td> 
          <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" valign='top'> 

           <tr> 
           <td> 
            <table width="600" border="0" cellspacing="0" cellpadding="0" align="center" > 
            <tr><td height='10'>&nbsp;</td></tr> 
            <tr><td style='border-bottom:1px solid #DDDDDD'></td></tr> 
            <tr><td height='10'>&nbsp;</td></tr> 
            </table> 
           </td> 
           </tr> 

           <tr><td height='28'>&nbsp;</td></tr> 

           <tr> 
           <td valign='top' align='center'> 
            <div class="contentEditableContainer contentTextEditable"> 
            <div class="contentEditable" > 
             <p style='font-weight:bold;font-size:13px;line-height: 30px;'>This email was sent to [email] when you signed up on [CLIENTS.WEBSITE]. Please add us to your contacts to ensure the newsletters land in your inbox.</p> 
            </div> 
            </div> 
           </td> 
           </tr> 

           <tr><td height='28'>&nbsp;</td></tr> 

           <tr> 
           <td valign='top' align='center'> 
            <div class="contentEditableContainer contentTextEditable"> 
            <div class="contentEditable" > 
             <p style=' font-weight:bold;font-size:13px;line-height: 30px;'>INvitor inc</p> 
            </div> 
            </div> 
            <p style='font-size:13px;line-height: 15px;'>[CLIENTS.ADDRESS]</p> 
            <div class="contentEditableContainer contentTextEditable"> 
            <div class="contentEditable" > 
             <a href='[UNSUBSCRIBE]' style='line-height:19px;color:#A8B0B6; font-size:13px;'>Unsubscribe</a> 
            </div> 
            </div> 
           </td> 
           </tr> 

           <tr><td height='28'>&nbsp;</td></tr> 
          </table> 
          </td> 
         </tr> 
         </table> 
        </td> 
        </tr> 
       </table> 
       </div> 


     </td> 
     </tr> 
    </table> 
    </td> 
</tr> 




</table> 
    </body> 
    </html> 

그러나 iPhone을 열면 이미지가 표시되지 않습니다. PHP에서 내 게시 코드는 다음과 같습니다

내가 Gmail을 통해 연결하는 경우
<?php 
       $email_to = ''; 
        $email_subject = sec("subject"); 
        $email_message = "<html><body>".$_POST['message']."</body></html>"; 
        $fromaddress = "From: xxxxx$gmail.com ,\r\n"; 
        $fromaddress .="BCC: ".$email_address."\r\n"; 
        $fromaddress .= 'Content-Type: text/html'; 


        mail($email_to, $email_subject, $email_message, $fromaddress); 

?> 

나는 당신을 볼 수 있습니까 그렇게 사진 보안상의 이유로 메일의 코드

+0

이메일에 이미지를 표시하려면 전체 웹 주소를 입력해야합니다. –

답변

1

코드를 시도하지 않았습니다. 하지만 괜찮아 보인다. 내가 볼 수있는 유일한 문제는 이미지 경로입니다. 메일 템플릿의 경우 폴더 디렉토리가 아닌 서버에서 이미지를로드해야합니다.

예를 들어

: <img src="mailtest/images/bigImg.png" alt='featured image' data-default="placeholder" data-max-width="300" width='326' height='269' > 는, 그래서

` <img src="http://www.yourdomain.com/mailtest/images/bigImg.png" alt='featured image' data-default="placeholder" data-max-width="300" width='326' height='269' > 

할 이미지 경로를 변경합니다. 희망은 그 작품. 감사합니다.

0

아마 스팸 필터 블록 이미지 만 무슨 문제.

나는 문제를 해결하기 위해이 방법을 사용합니다 : Insert images into html email without physically inserting them

이미지는 HTML 이메일에 표시 할 수 있습니다 물리적으로 삽입하지 않고.

이미지가 이메일과 함께 이동하지 않기 때문에 이메일 크기가 줄어들지 않습니다. 따라서 필터링 규칙에서 전자 메일의 크기를 고려할 때 전자 메일 필터에 갇힐 가능성이 적습니다.

+0

스팸으로 차단되지 않았습니다. 총 이미지 크기 50KB – eyal

관련 문제