4

Outlook 用の HTML メールを作成しているときに、修正できない小さな問題に遭遇しました。

以下は、html テーブルのスクリーンショットです。テキストだけでなく、領域全体をクリックできるようにする必要があります。またはを配置する<a href="#">と、ブラウザーでは機能しますが、Outlook では機能しません。<td><table>

ここに画像の説明を入力

コードは次のとおりです。

<table border="0" cellpadding="0" cellspacing="0" style="border-top-left-radius: 5px;border-top-right-radius: 5px;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;background-color: #2FBA45;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
    <tbody>
        <tr>
            <td align="center" valign="middle" style="font-family: Arial;font-size: 22px;padding: 15px;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                <a href="#" title="Yes please, send me a quote." target="_self" style="font-weight: bold;letter-spacing: -0.5px;line-height: 100%;text-align: center;text-decoration: none;color: #FFFFFF;word-wrap: break-word !important; display:block; width:100%; height:100%">Yes please, send me a quote.</a>
            </td>
        </tr>
    </tbody>
</table>
4

4 に答える 4

1

これは古い質問であることは知っていますが、この問題 (Outlook でクリック可能なボタン全体) に対する答えを探していて、次の解決策に出くわしました:

<table border="0" cellpadding="0" cellspacing="0">
    <tbody>
        <tr>
            <td align="center" valign="middle" >

<!-- start of Outlook compatible button generated by http://buttons.cm/ -->
<div><!--[if mso]>
  <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://yoururlhere.com/" style="height:52px;v-text-anchor:middle;width:330px;" arcsize="10%" stroke="f" fillcolor="#2fba45">
    <w:anchorlock/>
    <center>
  <![endif]-->
      <a href="http://yoururlhere.com/"
style="background-color:#2fba45;border-radius:5px;color:#ffffff;display:inline-block;font-family:sans-serif;font-size:13px;font-weight:bold;line-height:52px;text-align:center;text-decoration:none;width:330px;-webkit-text-size-adjust:none;">Yes please, send me a quote.</a>
  <!--[if mso]>
    </center>
  </v:roundrect>
<![endif]--></div>
<!-- end of Outlook compatible button generated by http://buttons.cm/ -->

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

上記のコードはテストしていないことに注意してください。

他の回答はキャンペーンモニターのウェブサイトにリンクしていましたが、解決策を提供したこのリンクにはリンクしていませんでした。

Campaignmonitor のブログ投稿では、Stig M (Twitter の @stigm) によって作成されたソリューションに基づいて、Outlook 互換のクリック可能なボタンを生成する特定の Web サイトを作成したと述べています。

私はキャンペーンモニターで働いていません。

それが誰かを助けることを願っています。

于 2013-11-29T07:20:03.227 に答える
0

を削除してみてくださいtarget="_self"。Outlook はメール クライアントであるため、おそらくそれを認識せず、問題を引き起こしている可能性があります。

余談ですが、メール内でアンカー リンクを使用している (同じページの別の場所にリンクしている) 場合、これはすべてのメール ブラウザーで完全にサポートされているわけではありません。サポートチャートはこちら

于 2013-07-24T15:46:47.953 に答える
0

これを試して

http://jsfiddle.net/KrRzP/ 

<table border="0" cellpadding="0" cellspacing="0"   style="border-top-left-radius: 5px;border-top-right-radius: 5px;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;background-color: #2FBA45;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt; cursor:pointer;">
    <tbody>                 
        <tr>
            <td align="center" valign="middle"  style="font-family: Arial;font-size: 22px;padding: 15px;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                <a  href="http://www.example.org" title="Yes please, send me a quote."  target="_self" style="font-weight: bold;letter-spacing: -0.5px;line-height: 100%;text-align: center;text-decoration: none;color: #FFFFFF;word-wrap: break-word !important; display:block; width:100%; height:100%">Yes please, send me a quote.</a>
            </td>  
        </tr>
    </tbody>
</table>
于 2013-07-24T11:15:41.227 に答える