ホームページ  >  記事  >  WeChat アプレット  >  WeChat は共有リンクのサムネイルとタイトルを実装します

WeChat は共有リンクのサムネイルとタイトルを実装します

小云云
小云云オリジナル
2018-03-22 14:43:226273ブラウズ


この記事では主にWeChatの共有リンクのサムネイルとタイトルを共有しますので、皆様のお役に立てれば幸いです。

1. WeChatで共有

WeChatでリンクを開いた後、右上隅の[…]をクリックし、[友達に送信]または[モーメントに共有]を選択します。この共有方法のサムネイルを取得する方法:

  • 方法 1: ページ本文の上部に 300*300 ピクセルの画像を追加します

画像を表示する必要がない場合は、CSS を使用して非表示にすることができますが、display: none; 。 display: none;

可以在父层 p 上设置 display: none; 或者对 img 设置 position: absolute; visibility: hidden;

親レイヤー p で display: none; を設定することも、img で position: ABSOLLE; Visibility: hidden; を設定することもできます。
    <p style="display:none;">
    <img src="/img/thumbnail.png" alt=""></p>
  • 方法 2: WeChat JS-SDK の共有インターフェースを使用する

この方法では、署名を生成するために WeChat 公式アカウントの app_id とバックエンド サービスが必要です。利点は、共有タイトル、サムネイル、説明をカスタマイズできることです。

2. ブラウザから共有

ブラウザでリンクを開いた後、共有アイコンをクリックし、[WeChat] を選択します。 この共有方法でサムネイルを取得する方法:

ページの先頭部分に Open Graph メタデータを追加します。 :

<meta property="og:type" content="website" />
<meta property="og:title" content="页面标题">
<meta property="og:description" content="页面描述">
<meta property="og:image" content=" 
<meta property="og:url" content="http://www.example.com/">

og:image は、ブラウザがアイコンを共有するときにアイコンに影響を与えるため、画像のフルパスを指定する必要があります。 🎜

以上がWeChat は共有リンクのサムネイルとタイトルを実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。