vdeep

*

vdeepはプログラミング、IT、Web技術、ライフハックの事などなどを管理人okutaniがつぶやくブログです。月間13万PV〜。

SlideShareに登録してスライドを公開してみよう

      2017/01/31

LINEで送る
Pocket

slideshare
こんにちは、okutani(@okutani_t)です。最近、『SlideShare』というサイトをよく目にするようになりました。

SlideShareは文字通り『スライドを共有』できるサイトです。勉強会やLTで使ったスライドなどをSlideShareで公開しておけば、使い終わったあとでも無駄なくスライドを有効活用できますね。

スライドをアップロードして公開するだけであれば無料で利用できるため、手軽に始められるのも魅力のひとつですね。

本記事では『SlideShareの登録方法』『スライドのアップロードから公開まで』、最後に『WordPressサイトへスライドを埋め込む方法』を紹介しています。

では、さっそくSlideShareの登録方法から見ていきましょう。

スポンサーリンク

SlideShareの登録方法

まずはSlideShareの公式ページに移動します。移動したらTOPページ右上の『Signup』をクリック。

LINKShare and Discover Knowledge on LinkedIn SlideShare

slideshare1

SlideShareの登録は『Email』もしくは『LinkedIn』『Facebook』のアカウントを使うことができます。

今回はEmailを使って登録を進めました。

Email』『ユーザー名』『パスワード』を入力、入力後に出てくる画像の文字を入力し、『Signup』をクリック。

slideshare2

登録が完了すると、そのままSlideShareにログインした状態でTOPページに飛びます。

右上のアイコンをクリックして、自分のユーザー名が表示されれば、SlideShareにログイン済みということが確認できますね。

slideshare3

登録したメールアドレス宛に、次のようなメールが届きます。『Confirm email』をクリックして認証しておきましょう。

slideshare4

これでSlideShareが利用できるようになりました。

スライドを公開してみよう

SlideShareの登録が済んだら、次は実際にスライドを公開してみましょう。

サイト右上にある『Upload』をクリック。

slideshare5

Select files to upload』を選択、もしくはここにファイルをドラッグ&ドロップします。

slideshare6

公開したいファイルを選択します。今回はPDFファイルを選択してみました。

slideshare7

ちなみに、下記の拡張子付きのファイルであればSlideShareにアップロードできます。

  • PowerPoint(.ppt等)
  • OpenOffice(.odp等)
  • Keynote(.key)
  • Microsoft Office(.doc, .xls等)
  • PDFファイル(.pdf)
  • テキストファイル(.txt)
  • 動画ファイル(mp4, m4v, wmv, mpeg, avi等)

タイトル、注釈、タグ、カテゴリなどの詳細設定をおこないます。

slideshare8

  • Title
  • スライドのタイトルを入力。

  • Description
  • スライドの注釈を入力。

  • Category
  • スライドのカテゴリーを選択。

  • Privacy
  • スライドを公開にするか非公開にするか選択。今回は公開の『Public』を選択。

  • Tags
  • スライドに関連したタグを入力し、選択。

  • Discoverability Score
  • スライドの見つけやすさ。タイトルや注釈、カテゴリー、タグを適切に設定するとスコアが上がる。

  • Add a lead form
  • ここにチェックを入れるとビジネス用に最適化される?ようです。詳しいことが分かったら追記します。

Publish』を押して公開します。ちなみに、この設定情報はアップロード後に変更可能です。

これでスライドがSlideShareに公開されました。

slideshare9

このページのURLをメモして置いて、シェアしたい人に送れば、スライドを共有することができますね。

WordPressサイトにスライドを埋め込んでみる

このスライドを、WordPressサイトに埋め込む方法を最後にご紹介します。

先ほどのスライドが公開されている画面で『Share』を選択、『WordPress Shortcode』のコードをコピーします。

slideshare10

ちなみに、WordPress以外のサイトに埋め込みたい場合は、『Embed』のコードをコピーして利用すればOKです。

次に、WordPress管理画面から『SlideShare for WordPress by Yoast』というプラグインをインストールします。

『プラグイン』→『新規追加』→『SlideShare for WordPress by Yoast』で検索し、インストール。

slideshare11

インストールが終わったあと、有効化するのを忘れずに。

先ほどコピーしたSlideShareのコードを、WordPressの投稿画面に貼り付けて投稿してみます。

slideshare12

このとき、『テキストモード』で貼り付けるようにしましょう。ビジュアルモードだとただの文字として投稿されてしまうので注意してください。

当ブログはWordPressで運営しているので、次のように埋め込んでみました。無事に表示されているでしょうか?(スライドは以前使った勉強会用のスライドです)。


スマートフォンでの表示崩れを防ぐ

実は、このままだとスマートフォンで大きく表示されはみ出してしまってレイアウトが崩れてしまいます。

次のHTMLとCSSでスマホ対応しました。まずは先ほどの埋め込み用コードをdivタグで囲っておきます。

<div class="slideshare">
  ここにSlideShareの埋め込みコード
</div>

次に、style.cssなどのCSSファイルに下記を記述します。

/* slideshareスマホ対応 */
.slideshare {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 79%;
  margin-bottom: 20px;
}
.slideshare iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: 580px;
  max-height: 1000px;
}

適宜、padding-topやmax-widthの値を調整して使ってみてください。

参考SlideShare の埋め込み表示をレスポンシブ対応させる – HAM MEDIA MEMO

プレゼン資料をブログで紹介したいときなどに、ぜひ活用してみてください。

まとめ

SlideShareの登録方法、スライドの公開、WordPressサイトへの埋め込み方法までを紹介しました。

それ以外にも、スライドのダウンロードや、SlideShareのユーザー同士と交流ができたりと、様々な活用方法があるようです。気になる方は調べてみてください。

特に、IT系の方で使っている人が多いので、エンジニアやSEの方はこの機会にSlideShareの使い方を覚えておくといいですね。

この記事が気に入ったら
いいね ! しよう

Twitter で
LINEで送る
Pocket

okutani (@okutani_t) のヒトコト
今まで、プレゼン資料を共有するといったことがなかったので、SlideShareを使ってみて新しい発見がありました。やれることの幅が広がっていいですね!

 - Webサービス

スポンサーリンク

PC用AdSense

PC用AdSense

Share
  • このエントリーをはてなブックマークに追加

  こちらの関連記事もどうぞ

関連記事はありませんでした

vdeepのトップページへ戻る画像です。風船の形をした島を女の子が掴んでいます。