画像と説明でTwitterとLinkedInに共有する

Question

WebリンクからTwitterとLinkedInにテキストを共有する必要があります。

テキストを追加できますが、画像を追加できません。

私はKentico CMSを使用しており、以下のようにWebパーツ変換を記述しました。しかし、画像はTwitterとLinkedInのプラグインには表示されません。

ここに以下の変換を添付します。

画像なしでTwitterとLinkedInの結果を追加しました。

誰かがTwitterとLinkedInのフィードを共有して私をガイドできますか？

おかげ

<a class="fb-xfbml-parse-ignore" target="_blank" 
href="https://twitter.com/intent/tweet?url=<%=Server.UrlEncode(CMS.DocumentEngine.DocumentContext.CurrentDocument.AbsoluteURL)%> 
&picture=<%#GetAbsoluteUrl(CMS.DocumentEngine.DocumentContext.CurrentDocument.GetValue("StoryImageURL").ToString())%> 
&text=<%#CMS.DocumentEngine.DocumentContext.CurrentDocument.GetValue("Title").ToString()%>" 
onClick="return popup(this, 'notes')"> 
    <img src="<%# Eval("twittericon") %>" alt="twitter icon" /> 
</a> 

<a class="fb-xfbml-parse-ignore" target="_blank" href="https://www.linkedin.com/shareArticle?url=<%=CMS.DocumentEngine.DocumentContext.CurrentDocument.AbsoluteURL%> 
&picture=<%#GetAbsoluteUrl(CMS.DocumentEngine.DocumentContext.CurrentDocument.GetValue("StoryImageURL").ToString()) %> <%#CMS.DocumentEngine.DocumentContext.CurrentDocument.GetValue("BlogDescription").ToString()%>" onClick="return popup(this, 'notes')"> 
    <img src="<%# Eval("linkedicon") %>" alt="linked icon" /> 
</a> 

Answer 1

まず第一に、私はTwitterやLinkedInのは、ちょうど株式URLにパラメータを追加することで、テキストと一緒に画像を共有する方法を公開しないと思います。 Twitterの場合は、Summary Cardなどのカードを設定し、ウェブサイトにメタタグを追加することができます。 twitter:imageメタタグを追加すると、Twitterにどの画像を使用するかを伝えることができます。

同様のことがLinkedInに適用されます。use Open Graph meta tagsにする必要があります。共有URLの一部として画像を提供する方法がないからです。あなたが書いた変換について

- 変革の内側CMS.DocumentEngine.DocumentContext.CurrentDocumentを使用して繰り返しアイテムのデータとは反対に、表示されている現在の文書からデータを取得すると同じように、あなたは正しいデータをレンダリングしていることを確認してください。繰り返しアイテムのデータをレンダリングするには、Evalメソッドを使用できます。

この：私は私がしたいページのページテンプレートにヘッドHTMLコードWebパーツを使用するすべての個人用サイトの

<%#Eval("Title")%> 

Answer 2

または持っている必要があります。

<%#CMS.DocumentEngine.DocumentContext.CurrentDocument.GetValue("Title").ToString()%> 

は、このになるだろうこのOpen Graph（OG）のデータ。ここでは、データの一部を動的に読み込むためのサンプルを示します。

<meta property="og:site_name" content="Kehren Development - Kentico MVP & Experts" /> 
<meta property="og:url" content="{% CurrentDocument.AbsoluteURL #%}" /> 
<meta property="og:image" content="{%RootDocument.AbsoluteURL#%}KehrenDev/media/images/logos/twitter-logo-800.jpg" /> 
<meta property="og:type" content="article" /> 
<meta property="og:title" content="{% BlogPostTitle %}" /> 
<meta property="og:description" content="{% StripTags(BlogPostSummary) %}" /> 
<meta property="article:publisher" content="https://www.facebook.com/bkehren" /> 
<meta name="twitter:card" content="summary_large_image"> 
<meta name="twitter:title" content="{% BlogPostTitle %}"> 
<meta name="twitter:site" content="@kehrendev"> 
<meta name="twitter:creator" content="@bkehren"> 
<meta name="twitter:description" content="{% StripTags(BlogPostSummary) %}"> 
<meta name="twitter:url" content="{% CurrentDocument.AbsoluteURL #%}"> 
<meta name="twitter:image" content="{%RootDocument.AbsoluteURL#%}KehrenDev/media/images/logos/twitter-logo-800.jpg"> 
<meta name="twitter:domain" content="{%RootDocument.AbsoluteURL#%}"> 

これは、ブログ投稿が表示されるといつでもページに表示されます。 Webパーツでこれらのプロパティを設定して、それらのページタイプのみを表示することができます。あなたが使うことができる他のメタタグや設定可能なフィールドはありますが、これはあなたを始めさせるでしょう。

OGタグはピックアップ残りを、します今、あなたはまだあなたが持っている共有リンクを使用することができるだけで、実際の記事のリンクと、おそらくエンコードされた記述と共有リンクを移入します。