【WordPress】埋め込みメディアの挿入/編集について


media_button←このボタン、
TinyMCE Advancedの『埋め込みメディア挿入/編集』のボタンです。
超気になります。
多分、Wordpress3.xから実装されているんじゃないかと思ったのですけど、気にも止めていませんでした(汗)

 まず、どんな種類の動画が埋め込みが可能か?というところですが

media

プルダウンしてみると

  • media_dig.video
  • media_dig.audio
  • media_dig.flash
  • media_dig.quicktime
  • media_dig.shockwave
  • media_dig.windowsmedia
  • media_dig.realmedia
  • media_dig.iframe

 という。8つの項目が出てきます。

・media_dig.flash⇒*.flv 
・media_dig.quicktime⇒*mov 
・media_dig.shockwave⇒*.swf 
・media_dig.windowsmedia⇒*.wmv、*.asf、*.avi
・media_dig.realmedia⇒*.rm、*.rmvb
・media_dig.iframe⇒外部メディア挿入(YOUTUBE等、多分ニコ動はダメだと思う)

というのはなんとなく解る気がします。

・media_dig.video
・media_dig.audio

なんだっけ…これ???

…ということで、謎が一つ解けました。
HTML5のタグに

HTMLクイックリファレンス 様
★HTML5タグリファレンス
<video> …… 動画を再生する
http://www.htmq.com/html5/video.shtml
<audio> …… 音声を再生する
http://www.htmq.com/html5/audio.shtml

さっそくテストアップしてみることに。

まずはaudioのほうから*.mp3をアップ。

まずはOKでしょう。(FireFox、InternetExplorer、GoogleChrome、Safari)OperaはNGでした。

videoのほうはどうでしょ?*.mp4形式の動画をアップしてみる。


祝!ウレロ☆未体験少女放送記念

 …おお、*.mp4が再生されたじゃないですか!!!(動作はFireFox、GoogleChrome、Safari、InternetExplorer)
しかーし、またしてもOperaで表示されず。
なんでだろ?バージョンは最新にしてるはずなんだけどなー。

…*.mp4については、ファイルが重いのもあるので、サイトで使用するということを考えると、あんまり選択肢には入らないかなーと思います。

でも、今までサポートされていなかった動画ファイルがページ上で表示されるというのはいいですね。
これからもいろいろと使えそうです。

 

【WordPress Plugin】TinyMCE Advanced


Blogを今風にしたい!その2

今どきのブログを書くページに絵文字を入れたり、ボタン一つで画像URLや動画URLが貼られたり出来るパネルがあったりします。
WordPressの場合はビジュアルエディタを使う時に、ちょいと味気ない感じがします。
なんというか、色味がないというか。

そういった色付け的なモノを導入するPlugin

TinyMCE Advanced
http://wordpress.org/plugins/tinymce-advanced/

ビジュアルエディタのほうで

こんなことや

表とか 作れちゃったりして
   


動画(↑これはQuick Time動画です)をYOUTUBEとかからではなくて、自分のサーバーに入れたものを表示させたりしちゃったり

今回使用した動画と同じものはこちら

ホンダ アコードのイギリス版のCM
http://www.youtube.com/watch?v=azlvB5CauNU

この動画を今回Quick Time動画で自分のサーバでアップしております。
(実はホンダ公式チャンネルでアップロードされるより、ずいぶん前からこの動画を何故か入手していて、しかも*.mov形式動画だったという不思議…)

これで、アレな動画とかアップ出来ますよね(ぉい

なんか、多分レンタルブログでは出来ないようなこともできちゃったり…。

 便利ですね。

*********

今回お世話になったサイト様

WordPressの使い方を覚えたい 様
ビジュアルエディタを高度にカスタマイズする、プラグイン「TinyMCE Advanced」
http://crossinthenight.com/wordpress/1127/

「TinyMCE Advanced」をカスタマイズする
http://crossinthenight.com/wordpress/2057/

 TinyMCE Advanced日本語化ファイル

Lovelog 様 TinyMCE
Advanced3.9.9.2 日本語版配布
http://lovelog.eternal-tears.com/wordpress/wp-plugin-ja/tinymce-advanced3392-ja/

*********

日本語化にはちょっとした細工が必要になるようです。

これで、もうちょっと凝った感じの記事が書けるかな…?

 

【WordPress Plugin】WP Social Bookmarking Light


Blogを今風にしたい!

今どきのBlogはFacebookやTwitterへURLを送信出来るというボタンが付いている。
ソーシャルメディアシェアボタンというモノらしい。

WordPressの外観(Theme)を今までiBlogにしていたときは、Blogのページの一番下にFacebook、Twitterなどのシェアボタンがついていたのですが、ThemeをSerenityに替えたらボタンがない。

どうしようと思った時のPluginが

WP Social Bookmarking Light

さっそく導入することに。

見ていただくとわかりますが、無事にシェアボタンを導入することに成功。
しかも、豪華にトップと一番下に表示されました。
(やっぱり見た目でトップのみ表示に変えました(汗))

**********

設定についてお世話になったサイト様

NetaOne 様
WP Social Bookmarking Light – ソーシャルメディアの共有ボタンを一元管理できるWordPressプラグイン

http://netaone.com/wp/wp-social-bookmarking-light/

mixi checkの識別キー取得方法は
SEOのホワイトハットジャパン 様
WP Social Bookmarking Lightを導入しソーシャルボタンを設置する方法

http://whitehatseo.jp/wp-social-bookmarking-lightを導入しソーシャルボタンを設置する方法/#sec3

**********

選べるボタンが多いので、あんまり多くすると見た目がアレになりますよ。(←実験してみた)