あなたのウェブサイトにコンテンツを埋め込むための究極のガイド

あなたのコンテンツに社会的証拠を追加したり、実際の例でブログをサポー

しかし、実際にこのコンテンツを埋め込む方法を考え出すのは難しいかもしれません。

この記事では、Twitter、Facebook、Instagram、Pinterest、Google Calendar、YouTube、SlideShareからソーシャルメディアや関連コンテンツをウェブサイトに埋め込むためのステップバイステップガイドを見つfacebook、Instagram、Pinterest、Google Calendar、Youtube、SlideShareからウェブサイトに埋め込むためのステップバイステップガイドを見つけることができます。

→ 無料ダウンロード:高いパフォーマンスのウェブサイトを構築し、維持するための5つの重要なステップ

(残念ながら、LinkedInはまだ特定の投稿の埋め込み機能を許可していません-LinkedInのプロフィールやページを埋め込むことができるようにプラグインを提供していますが。)

セクション名をクリックすると、そのセクションに自動的にスクロールします。

  1. ツイートを埋め込む方法
  2. Facebookの投稿やビデオを埋め込む
  3. Facebookのフィードを埋め込む
  4. Instagramのフィードや投稿を埋め込む
  5. Pinterestのピンを埋め込む
  6. Pinterestのボードを埋め込む
  7. Google+のポストを埋め込む
  8. Facebookのフィードや投稿を埋め込む
  9. Facebookのフィードや投稿を埋め込む
  10. googleカレンダーを埋め込む
  11. Youtubeの動画を埋め込む方法
  12. スライドショーのプレゼンテーションとインフォグラフィックを埋め込む

ツイートを埋め込む方法

  1. 埋め込みたいツイートを見つけます。
  2. ツイートの右上にある下向きの矢印をクリックします。
  3. “ツイートを埋め込む”を選択します。”
  4. 表示されたコードをコピーして、ウェブサイトのHTMLエディタに貼り付けます。
  5. 埋め込みコードの”twitter-tweet”の後に’tw-align-center’を追加します。

埋め込みたいツイートを見つけます。

あなたのブログやウェブサイトにツイートを埋め込むには、まずその自然の生息地で表示したいツイートを見つける必要があります-Twitter。 TwitterのニュースフィードまたはTwitterユーザーのプロフィールでツイートを見つけます。 この例では、下のスクリーンショットに示すように、HubSpotのTwitterフィードからツイートを埋め込みます。

ツイートの右上にある下向きの矢印をクリックします。

埋め込みたいツイートを見つけたら、以下のようにツイートの右上にある下向きの矢印アイコンをクリックします。

downward-arrow-tweet

「ツイートを埋め込む」を選択します。”

この矢印アイコンをクリックすると、”埋め込みツイート”と呼ばれるオプションを含むドロップダウンメニューが表示されます。”このオプションをクリックします。

4. 表示されたコードをコピーし、webサイトのHTMLエディタに貼り付けます。

上記のドロップダウンメニューから”ツイートを埋め込む”をクリックすると、以下のコードボックスが開きます。 “このツイートを埋め込む”の下には、青色で強調表示されたテキストの文字列が表示されます。 このコードをクリップボードにコピーするには、キーボードのCommand+C(またはPcを使用している場合はControl+C)を使用します。

tweet-embed-code

この埋め込みコードをクリップボードにコピーして、このツイートを埋め込みたいウェブサイトに戻ります。 このウェブサイトのソースコードを開きます(一部のコンテンツ管理システムには、このソースコードにアクセスできる”</>”アイコンがあります)。 ここでは、ツイートの埋め込みコードを、ツイートを表示する場所に正確にHTMLに貼り付けます。

埋め込みコードの”twitter-tweet”の後に’tw-align-center’を追加します。

ただし、このコードをHTMLに貼り付けたら、このツイートを中央揃えにして、webページの左側または右側に自動的にプッシュアップされないようにします。 これを修正するには、埋め込みコードの「twitter-tweet」の直後に「tw-align-center」(引用符なし)というテキストを追加します。 この方法の詳細については、こちらをご覧ください。

最終的なコードは次のようになります:

<blockquote class=”twitter-tweet”tw-align-center data-lang=”en”><p lang=”en”dir=”ltr”>私たちに知らせてください! ▲<br>今年はどのようなコンテンツを見てみたいですか?</p>&mdash;HubSpot(@HubSpot)<a href=”https://twitter.com/HubSpot/status/1085634067679322114?ref_src=twsrc%5Etfw”>January 16, 2019</></blockquote>
<スクリプト非同期src=”https://platform.twitter.com/widgets.js”charset=”utf-8″></スクリプト>

それだ! これは、完了したときに埋め込まれたツイートがどのように見えるかです:

私たちに知らせてください! ▲
今年はどのようなコンテンツを見たいですか?

—HubSpot(@HubSpot)January2019.12.2019 16, 2019

Facebookの投稿や動画を埋め込む

埋め込みたいFacebookの投稿を見つけます。

ツイートを埋め込む手順(上記)と同様に、Facebookの投稿をブログやウェブサイトに埋め込むことがFacebook上で開始されます。 Facebookから、Facebookユーザーのプロフィールページ、またはニュースフィードで埋め込みたい投稿に移動します。 この例では、下のスクリーンショットに示すように、HubSpot AcademyからFacebook投稿を埋め込みます。

省略記号をクリックします(“…投稿の右上にある”)アイコン。

埋め込みたいFacebook投稿の右上に、3つの小さなドットで構成される省略記号アイコンが表示されます。

埋め込みたいFacebook投稿の右上に、3つの小 以下に示すように、このアイコンをクリックします。

ellipsis-facebook-post

「埋め込み」をクリックします。”

以下の省略記号アイコンをクリックすると、”Embed”というラベルが付いたオプションのドロップダウンメニューが表示されます。「埋め込みたい投稿が動画の場合は、このメニューのさらに下に「</>埋め込み」というラベルの同様のオプションが表示されます。 いずれかのオプションをクリックします。

投稿を埋め込むオプションが表示されない場合、投稿は公開されておらず、埋め込み可能ではありません。

embed-facebook-post-from-hubspot-academy

表示されたコードをコピーし、webサイトのHTMLエディタに貼り付けます。

上記の”埋め込み”オプションをクリックすると、以下のボックスが開きます。 このボックスの上部には、”プレビューを隠す”と”詳細設定”ボタンのすぐ上に、コード化されたテキストの行が表示されます。 このコードを強調表示して、コンピューターのクリップボードにコピーします。

facebook-post-embed-code

この埋め込みコードをクリップボードにコピーして、このFacebookの投稿を埋め込むウェブサイトに戻ります。 このウェブサイトのソースコードを開きます(一部のコンテンツ管理システムには、このソースコードにアクセスできる”</>”アイコンがあります)。 ここでは、Facebook投稿の埋め込みコードを、投稿を表示する場所に正確にHTMLに貼り付けることができます。facebook投稿の埋め込みコードをHTMLに貼り付けるには、次の手順を実行します。

<center>と</center>タグをHTMLスニペット全体の周りに追加して、投稿を中央揃えにします。

ただし、このコードをHTMLに貼り付けたら、投稿を中央揃えにして、webページの左側または右側に自動的に押し上げられないようにする必要があります。 これを修正するには、Facebookの投稿が記事またはwebページの中央に表示されるように、'<center>’および'</center>’タグでコードをラップします。

最終的なコードは次のようになります:

<><iframe src=”https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2Fthehubspotacademy%2Fposts%2F741606746226328%3A0&width=500″width=”500″height=”448″style=”border:none;overflow:hidden”scrolling=”no”frameborder=”0″allowTransparency=”true”allow=”encrypted-media”></iframe></center>

それだけです! ここでは、あなたが完了したときにそれがどのように見えるかです:

Facebookフィードを埋め込む

信じられないかもしれませんが、Facebookプロフィールのフィード全体をあなたのウェブサイトに埋め込むのは、単一の投稿や動画を埋め込むのと同じくらい簡単です。 そして、それを行うには複数の方法があります。

WordPressのプラグインを使用して

最初の方法は、コンテンツ管理システム(CMS)にプラグインやウィジェットをインストールすることです。 WordPressユーザーは、例えば、彼らの処分でいくつかのFacebookフィードプラグインを持っています。 ここでは、いずれかを使用する方法です:

  1. スマッシュバルーンによるカスタムFacebookフィードは、あなたのWordPressアカウントを介してダウンロードすることができますそのようなWordPressのプラグインです。 このプラグインはこちらからダウンロードできます。
  2. このプラグインをダウンロードして、WordPressアカウントにログインし、”プラグイン”メニューからこのプラグインを有効にします。
  3. CMSの”Facebookフィード”設定を使用して、ウェブサイトに表示する特定のFacebookフィードを選択して設定します。
  4. ウェブサイトのHTMLエディタに”というテキストを入力して、選択したFacebookフィードを生成します。

Facebookのページプラグインを使用する

Facebookには独自のページプラグインがあり、プロフィールの個々のFacebookフィードの埋め込みコードを生成し、ウェブサイトのHTMLに入力することができます。 これを使用する方法は次のとおりです。

1. Facebookのページプラグインツールを開きます。

Facebookのフィードをブログやウェブサイトに埋め込むには、Facebookのネイティブページプラグインツールをここで開きます。 以下のセクションが表示されるまで、このページを下にスクロールします。

facebook-page-plugin

2. 埋め込みたいFacebookページのURLを入力します。

このツールを開いた状態で、webブラウザに新しいタブを作成し、フィードを埋め込むFacebookプロファイルに移動します。 キーボードのCommand+C(またはPcを使用している場合はControl+C)を押して、このページのURLをコンピュータのクリップボードにコピーします。

Facebookのページプラグインが開いているブラウザタブに戻ります。 下のスクリーンショットに示すように、クリップボードのURLを左上のフィールドに貼り付けます。 この例では、HubSpotのFacebookビジネスページのFacebookフィードを埋め込みます。

hubspot-facebook-page-plugin

3. 埋め込みフィードの横に表示するタブを追加します。

プロフィールのタイムライン全体を表示するだけでなく、Facebookのページプラグインでは、そのプロフィールのイベントやMessengerアカウントのタブを表示するこ デフォルトでは、ページプラグインツールには”timeline”が単独で入力されます。

埋め込みFacebookフィードにイベントタブまたはMessengerタブを追加するには、以下に示すように、ページプラグインツールの右上にある”タブ”フィールドをクリックし 単語”timeline”の横に単語”events”および/または”messages”をすべてカンマで区切って追加します。

facebook-plugin-tabs

4. 自分のFacebookのフィードの寸法をカスタマイズします。

ウェブサイトに埋め込むメディアのサイズを制限する特定のサイズがあり、これらのサイズが何であるかがわかっている場合は、Facebookページプラグインツールの下の二つのフィールドに入力してください。 左側のフィールドに特定の幅を入力し、右側に特定の高さを入力することができます。

デフォルトでは、Facebookフィードは約340×500で表示されますが、ツールのプレビューテキストには推奨サイズが表示されます。

5. 「コードの取得」をクリックします。”

上記のスクリーンショットに示すように、ツールの下部にある青色の”コードを取得”ボタンをクリックするだけです。 これにより、以下のコードボックスが開きます。

6. “IFrame”タブをクリックします。

ただし、どのコードを選択するかに注意してください。.. webサイトを最初からコーディングしていない限り、最初のタブ(「JavaScript SDK」というラベルが付いています)には必要なコードがありません。 以下に示すように、”IFrame”というラベルの付いたタブに切り替えます。 このテキストは、あなたのブログやウェブサイトのHTMLエディタに埋め込むための既製です。

facebook-page-plugin-embed-code

7. この埋め込みコードをコピーしてwebサイトのHTMLエディタに貼り付けます。

上記のコードをクリップボードにコピーします。 次に、このFacebookフィードを埋め込むwebサイトに移動します。 ウェブサイトのソースコードを開きます(一部のコンテンツ管理システムには、このソースコードにアクセスできる”</>”アイコンがあります)。 ここでは、フィードの埋め込みコードをHTMLに正確に表示する場所に貼り付けます。

8. フィードを中央揃えにするには、IFrameスニペット全体に<center>および</center>タグを追加します。

ただし、このコードをHTMLに貼り付けたら、投稿を中央揃えにして、webページの左側または右側に自動的に押し上げられないようにする必要があります。 これを修正するには、Facebookフィードが記事またはwebページの中央に表示されるように、コードを'<center>’および'</center>’タグでラップします。

最終的なコードは次のようになります:

<center><iframe style=”border:none;overflow:hidden;”allow=”encrypted-media”xml=”lang”src=”https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Fhubspot&amp;tabs=timeline%2C%20events%2C%20messages&amp;width=340&amp;height=500&amp;small_header=false&amp;adapt_container_width=true&amp;hide_cover=false&amp;show_facepile=true&amp;appId”width=”340″height=”500″frameborder=”0″scrolling=”no”></iframe></center>

これで終わりです! 完了したら次のようになります:

Instagramのフィードと投稿を埋め込む

Instagramはマーケティング担当者の間で人気がありますが、Instagramのフィード全体を埋め込む Instagramのフィードと個々の投稿をウェブサイトに埋め込む方法は次のとおりです。instagramのフィードと個々の投稿をウェブサイトに埋め込む方法は次のとおりです。

InstagramフィードWordPressプラグイン

カスタムFacebookフィードのメーカーからInstagramフィードが来ます。 スマッシュバルーンによって開発された、このWordPressのプラグインは、WordPressベースのウェブサイトが特定のInstagramのアカウントから全体のInstagramのフィードを埋 これを使用する方法は次のとおりです:

  1. WordPress用のInstagramフィードプラグインをダウンロードしてください。instagramフィードプラグインはこちらから。
  2. このプラグインをダウンロードして、WordPressアカウントにログインし、”プラグイン”メニューからこのプラグインを有効にします。
  3. CMSの”Instagramフィード”設定を使用して、Instagramアクセストークンとユーザー IDを選択します。
  4. ウェブサイトのHTMLエディタに”というテキストを入力して、選択したInstagramフィードを生成します。

WordPressでのこのプラグインの指示に従って、”の形式でテキストを入力することで、複数のInstagramフィードを同時に表示することができます。 この例では、3つの別々のInstagramフィードにそれぞれ6つの画像を効果的に埋め込むことができます。

Instagramの埋め込み機能

個々のInstagramの写真を埋め込むには、Instagramのネイティブ機能よりもさらに見る必要はありません。 重要:特定のInstagram投稿をブログやウェブサイトに埋め込むために、そのInstagramアカウントがプライベートに設定することはできません。 アカウントを公開に設定するには、このプロファイルに移動し、”プロファイルの編集”>プライバシーとセキュリティをクリックします。 このページから、”プライベートアカウント”オプションのチェックを外し、すべて設定する必要があります。

1. 埋め込みたいInstagram画像をクリックします。

ウェブサイトに埋め込みたいInstagramの投稿に移動し、それをクリックすると画像が拡大します。 この例では、以下のスクリーンショットに示すように、HubSpotのカルチャアカウントであるhubspotlifeから画像を埋め込みます。

2. 省略記号(“をクリックします。..”)投稿の右下隅にあるアイコン。

投稿を完全に表示した状態で、コメント欄の右下を見てください。 以下に示すように、3つの小さなドットで構成される省略記号アイコンをクリックします。

instagram-post-ellipsis

3. “埋め込み”を選択します。”

上記の省略記号アイコンをクリックすると、以下のオプションのボックスが開きます。 このメニューでは、上部から3番目のボタンである「埋め込み」を選択します。

instagram-post-embed-menu

4. 埋め込みコードをコピーしてwebサイトのHTMLエディタに貼り付けます。

TwitterやFacebookの指示(上記)と同様に、この”埋め込み”ボタンはコード化されたテキストの刺し傷を運ぶ別のボックスを生成します。 このボックスが画面に表示されたら、以下に示すように、上部のコードを強調表示します。 次に、下部にある青色の「埋め込みコードをコピー」ボタンをクリックして、このテキストをコンピュータのクリップボードにコピーします。

instagram-post-embed-code

5. 投稿を中央揃えにするには、HTMLスニペット全体の周りに<center>および</center>タグを追加します。

ただし、このコードをHTMLに貼り付けたら、Instagramの投稿を中央揃えにして、webページの左側または右側に自動的に押し上げられないようにする必要があります。

Instagram これを修正するには、コードを'<center>’および'</center>’タグでラップして、画像が記事またはwebページの中央に表示されるようにします。

それだ! 埋め込まれたInstagram投稿は次のようになります:

Pinterestのピンを埋め込む

Pinterestのウィジェットビルダーを開きます。

pinterestのピン留めされたコンテンツをブログやウェブサイトに埋め込むには、Pinterestのウィジェットビルダーを開きます。

左側の列で”ピンウィジェット”を選択します。

下のスクリーンショットに示すように、ピンウィジェットオプションが表示されるまで下にスクロールします。

pinterest-pin-widget

埋め込みたいピンのURLに貼り付けます。

まず、ツールの上部にある”Pin URL”フィールドに、以下に示すように、ウェブサイトに埋め込むpinのURLを入力します。

pin-widget-url

このセクションのコードをコピーして、webサイトのHTMLエディタに貼り付けます。

Pinterestのピンウィジェットで、あなたのピンのプレビュー画像のすぐ下のセクションまでスクロールダウンします。

pinterest-pin-embed-codeあなたのウェブサイトのHTMLエディタを開き、あなたのPinterestのピンがページ上に表示されたい場所に正確に最初の行をコピーして貼り付けます。 次に、2行目のテキストをコピーし、ページの一番下にあるwebサイトのHTMLエディタに貼り付けます。

このスニペット全体を単一のwebページに複数回貼り付けないように注意してください。 ピンを複数回表示したい場合は、コードの最初の行をコピーして、ページ上に表示したい場所に貼り付けるだけです。 そして、あなたが埋め込むことにしたピンの各インスタンスで次の手順を繰り返すことを忘れないでください。

以下に提供されたコードのスニペットをコピーします。

<!–pinterest–>

開始<a>タグと終了</a>タグの間にそのコードスニペットを貼り付けます。

コードは次のようになります:

<a data-pin-do=”embedPin”href=”http://www.pinterest.com/pin/99360735500167749/”><!–pinterest–></a>
…ページの下部にある


<スクリプトタイプ=”text/javascript”非同期src=”//assets.pinterest.com/js/pinit.js”></script>

ピンを中央揃えするために、HTMLスニペット全体の周りに<center>と</center>タグを追加します。

最終的なコードは次のようになります:

<センター><a data-pin-do=”embedPin”href=”http://www.pinterest.com/pin/99360735500167749/”><!–pinterest–></a>
<!–ピニットに電話してください。ページごとに一度だけjs–>
<スクリプトタイプ=”text/javascript”非同期src=”//資産。pinterest.com/js/pinit。js”></スクリプト></センター>

それだけです! 完了したら次のようになります。

Pinterestボードを埋め込む

Pinterestボードを追加するには、手順は一般的に、上で説明した個々のピンを埋め込むのと同じです。 ここでは、それが行われている方法です:

  1. Pinterestのウィジェットビルダーを開きます。
  2. “ピンウィジェット”ビルダーのすぐ下の左側の列で”ボードウィジェット”を選択します。
  3. ボードウィジェットを開いたら、上記のピンを追加するのと同じ手順に従います。

あなたのウェブサイトのHTMLエディタにコードの下の二行をコピーして貼り付け、それはそれです! 埋め込みボードは次のようになります。

埋め込みGoogle+投稿

1. 埋め込みたいGoogle+投稿を見つけます。 右上隅にマウスを置き、より多くのオプションをプルダウンするように表示される灰色の矢印をクリックします。

google-plus-embed-1

2. 「投稿を埋め込む」を選択します。”

google-plus-embed-2

3. 表示されるコード全体をコピーし、webサイトのHTMLビューに貼り付けます。

google-plus-embed3

4. HTMLスニペット全体の周りに<center>と</center>を追加して、埋め込み投稿を中央に配置します。

最終的なコードは次のようになります:

<センター><!–このタグをあなたの頭の中またはあなたの近くのボディタグの直前に置きます。 –>
<スクリプトタイプ=”text/javascript”src=”https://apis.google.com/js/plusone.js”></script>
<!–ウィジェットをレンダリングする場所にこのタグを配置します。 –>
<divクラス=”g-post”データhref=”https://plus.google.com/110490539670062886957/posts/be2TCKDBMsG”></div></center>

これで終わりです! ここでは、あなたが完了したときにそれがどのように見えるかです:

Googleカレンダーを埋め込む方法

特定のGoogleカレンダーをブログやウェブサイトに埋め込むには、モバイルアプリではなくウェブ版のGoogleカレンダーを使

オープンしましたか? 埋め込んでみましょう。

歯車のアイコンをクリックして設定を開きます。

Googleカレンダーの上部にある歯車のアイコンをクリックし、以下のように”設定”を選択します。

google-calendar-settings

埋め込みたいカレンダーを選択し、下にスクロールして”カレンダーを統合します。”

カレンダーの設定に入ったら、左側のサイドバーでウェブサイトに埋め込む特定のカレンダーを探します。 この例では、HubSpotの祝日カレンダーを埋め込みます。

カレンダーを選択したら、設定の右側を見て、”カレンダーの統合”セクションが表示されるまで下にスクロールします。 (また、単にあなたの選択したカレンダーの下に左側に同じ名前のオプションをクリックすることができます。)

google-integrate-calendar-1

“カスタマイズ”をクリックし、カレンダーのサイズと色を設定します。

設定の”カレンダーの統合”セクションで、テキストの”埋め込みコード”行のすぐ上にある”カスタマイズ”ボタンを見つけてクリックします。 これは、あなたがそれを埋め込む前に、あなたのカレンダーのサイズと配色を変更することができ、オプションの大きなウィンドウが開きます。

カレンダーの見た目に満足していて、美的な変更を加える必要がない場合は、この埋め込みコードをクリップボードにコピーするだけです。

Googleの統合カレンダー設定内のカスタマイズボタン。

上部にある埋め込みコードをコピーして、ウェブサイトのHTMLエディタに貼り付けます。

カスタマイズウィンドウまたは設定ページから埋め込みコードをコピーし、ウェブサイトのHTMLエディタに貼り付けます。 必要に応じて、この埋め込みコードを<center>および</center>タグでラップして、ウェブサイトの余白内にカレンダーを中央揃えすることができます。

YouTube動画を埋め込む方法

  1. 埋め込みたいYouTube動画を見つけます。
  2. ビデオの下で、”共有”を選択します。”
  3. 表示されるメニューで、”埋め込み”を選択します。”
  4. 表示されたコードをコピーして、ウェブサイトのHTMLエディタに貼り付けます。

埋め込みたいYouTube動画を見つけます。

YouTubeの動画をブログやウェブサイトに埋め込むのは非常に簡単です。 開始するには、YouTubeを開き、埋め込みたい動画に移動します。 この例では、以下のスクリーンショットに示すように、HubSpotのインバウンドYouTubeチャンネルからインバウンドマーケティングに関するビデオを埋め込みます。

ビデオの下で、”共有”を選択します。”

ビデオ自体の下に、以下に示すように、”共有”ボタンを探します。

inbound-youtube-video

表示されるメニューで、”埋め込み”を選択します。”

選択したYouTube動画の下の”共有”ボタンをクリックすると、さまざまなソーシャルネットワークに動画を共有できるオプションの小さなメニューが開きます。 これらのオプションの左端には、しかし、あなたはまた、円形の”埋め込み”ボタンが表示されます。 このボタンをクリックします。

youtube-share-embed

表示されたコードをコピーし、webサイトのHTMLエディタに貼り付けます。

次に表示されるウィンドウは、コード化されたテキストのボックスの大きなだけでなく、あなたがそれを埋め込む前に、あなたのビデオをカスタマイズするためのいくつかのオプションを生成します。 たとえば、埋め込みコードの下で、ビデオを特定のタイムスタンプから開始するかどうかを設定できます。

あなたがそれらを望むようにあなたの設定を正確に持っていたら、ウィンドウの上部にコード化されたテキストを強調表示します。 次に、右下の「コピー」をクリックします。

youtube-embed-code

HTMLスニペット全体の周りに<center>と</center>タグを追加して、ビデオを中央揃えにします。

最終的なコードは次のようになります:

<><iframe width=”560″height=”315″src=”https://www.youtube.com/embed/mZxa3lrLhXM”frameborder=”0″allow=”accelerometer;autoplay;encrypted-media;gyroscope;picture-in-picture”allowfullscreen></iframe></center>

これで終わりです! ここでは、あなたが完了したときにそれがどのように見えるかです:

SlideShareプレゼンテーションとインフォグラフィックを埋め込む

埋め込みたいSlideShareプレゼンテーションまたはインフォグラSlideShare.net…..

slideshare_step_1

「カスタマイズ」をクリックします。”

埋め込みSlideShareプレゼンテーションやインフォグラフィックをカスタマイズする場合は、”カスタマイズ”をクリックすると、以下のオプションが表示されます。 希望するオプションを選択し、「埋め込み」セクションのコードをコピーして、WEBサイトのHTMLビューに貼り付けます。

Slideshareプレゼンテーションを埋め込むオプション

HTMLスニペット全体の周りに<center>と</center>を追加して、埋め込みSlideshareを中央に配置します。

最終的なコードは次のようになります:

<center><iframe src=”//www.slideshare.net/slideshow/embed_code/31128788″width=”427″height=”356″frameborder=”0″marginwidth=”0″marginheight=”0″scrolling=”no”allowfullscreen></iframe><div><strong><a href=”https://www.slideshare.net/HubSpot/a-sales-and-marketing-love-story”title=”販売とマーケティングの愛の物語”target=”_blank”>販売とマーケティングのラブストーリー</a></strong>from<strong><a href=”http://www.slideshare.net/HubSpot”target=”_blank”>HubSpot</a></strong></div></center>

それだ! 完了したら次のようになります:

これらの埋め込みコードのいくつかは、あなたのブログやウェブサイトで完璧に見えるように少し調整する必要があ 幸せな埋め込み!

Canva HubSpotウェブサイトEbook

コメントを残す

メールアドレスが公開されることはありません。