「WordPressもくもく勉強会 at コエド第6回」で発表したスライドです。 Twitter、Instagram等は以前から簡単に、WordPressに組み込む方法が広く共有されていましたが、WordPress4.0以上になって組み込み可能なメディアが増えました。 実際に組み込む手順と、それを実現してくれている「oEmbed」について解説しています。 --------- 「WordPressもくもく勉強会」についての詳細 --------- WordPressなどで制作するための初心者勉強会＆もくもく会です。 「もくもく」の意味は、個人でコツコツと学習するという意味です。 学習中にわからないことがあれば、みんなで考えましょう！という勉強スタイルです)^o^( ハンズオン、セミナー形式の勉強会をお探しの方へ。 この勉強会は、もくもく（自主）勉強会が中心になります。 もし、ハンズオンやセミナー形式の勉強会を受講したい方は以下のセミナーをお勧めします。 ゼロから始めるWordPress勉強会｜Co-Edo WordPress 勉強会　　 https://coedo-wordpress.doorkeeper.jp/ このイベントについて 目的は３つです。 セッション（講演）が上手くなること。 近くの人に気軽に聞けて問題解決の手助けになること。 交流して、仲間を増やすこと。 前半で、セッション（講演）をして、そのあとはもくもく会です。 自分達で、もくもく勉強して、セッションで発表して、、、を繰り返すことで学習レベルを引きあげよう！！という勉強会です。 セッションはだれでも発表してもよいので、恐れずに発表してください！ （※セッションは希望者のみで、10分程度です。） また、経験者の方は、セッションの訓練の場として、講師のように参加してくれると嬉しいです(・∀・) 勉強会運営についてスライドにまとめています。 SlideShare WordPressもくもく勉強会について―WordPressもくもく倶楽部 http://www.slideshare.net/YoshinoriKoba/word-presswordpress 情報共有やイベント告知のためのグループがあります。 細かなイベント開催内容や、講演したスライド、Swiftの学習に役立つ情報、最新情報などをみんなで共有しています。 FaceBook：ゼロから始めるWordPress勉強会グループ Twitter：ハッシュタグ　#wpmoku DoorKeeper：https://wp-moku.doorkeeper.jp/ コンテンツ 動画でも配信予定です。 Ustream中継 WordPressもくもく勉強会 Youtube再生リスト WordPressもくもく勉強会

1. WordPressもくもく倶楽部
oEmbedで、コンテンツを
WordPressに組み込もう！

2. Self-Intoroduction
• Swiftビギナーズ倶楽部@Co-Edoを開催しています♪
• Ruby/Ruby on Railsビギナーズ倶楽部@Co-Edoを開催しています( ́ ▽ ` )ﾉ
• 最近Railsで開発を始めた、アプリケーションエンジニア(LAMP/Java/Oracle）
https://ror-beginners.doorkeeper.jp/
https://swift-beginners.doorkeeper.jp/
徳島県出身です
(ó ｀o) 一緒に開発しましょう( ́ ▽ ` )ﾉ
勉強会やってます！

3. １）外部コンテンツを組み込みたい！
Today's Agenda
２）方法は、とっても簡単！
３）oEmbedって何？

4. WordPressに、
Gistとか、SlideShareとか
簡単に表示させたい！
写真素材ぱくたそ
http://www.pakutaso.com
１）外部コンテンツを組み込みたい！

5. 例えば・・・

6. SlideShareのスライドを、
WordPressの投稿に埋め込みたい！

7. 人気があるVineの投稿を、
WordPressの投稿に埋め込みたい！

8. GitHubに投稿したGistを、
WordPressの投稿に埋め込みたい！

9. 興味のある「TED」動画を、
WordPressの投稿に埋め込みたい！

10. 方法はとっても簡単！

11. プラグイン：https://wordpress.org/support/plugin/vine
プラグインをインストールする系
プラグインは不要系
プラグイン：https://wordpress.org/plugins/slideshare/
プラグイン：https://wordpress.org/plugins/oembed-gist/
・SlideShare
・GitHub Gist
・Vine
・TED
サイト：http://www.slideshare.net/
サイト：https://vine.co/
サイト：https://github.com/
日本語サイト：https://www.ted.com/talks?language=ja

12. STEP１）組み込みたいコンテンツを表示
SlideShare

13. STEP２）URLをコピー
SlideShare

14. STEP３）投稿画面にURLを貼り付け
SlideShare

15. STEP１）組み込みたいコンテンツを表示
Vine

16. STEP２）URLをコピー
Vine

17. STEP３）投稿画面にURLを貼り付け
Vine

18. STEP１）組み込みたいコンテンツを表示
& Enbed URLをコピー
Gist

19. STEP２）投稿画面にURLを貼り付け
Gist

20. STEP１）組み込みたいコンテンツを表示
& Enbed URLをコピー
TED

21. STEP２）URLをコピー
TED
※Wordpress shortcodeを試してみたのですが、なぜかだめでした・・・？

22. STEP３）投稿画面にURLを貼り付け
TED

23. この仕組を提供してくれているのが
oEmbed （おーえんぶど）です (￣＾￣ゞ

24. ３）oEmbedって何？
oEmbed は、サード・パーティーの
メディア共有サイトにあるコンテンツを
Webページに埋め込んで表示するために
提供しているAPIです。

25. • Vine 動画WordPress 4.1
• TED 動画 WordPress 4.0
• Animoto 動画 WordPress 4.0
• CollegeHumor動画 WordPress 4.0
• Issuu ドキュメント WordPress 4.0
• Mixcloud 音楽 WordPress 4.0
３）4.0以上で利用可能になったoEmbed！
4.0以前の搭載では、YouTube、Twitter、Instagramとかは有名ですね＾＾
詳細は、http://wpdocs.sourceforge.jp/oEmbed

26. WordPress4.0以降に、対応メディアが
増えて選択肢が広がったので、
お気に入りのコンテンツを投稿に
組み込んでみてはいかがでしょうか。
ま と め

27. Let's study together！
Thank you :)