ツール

【新機能追加】「ようつべタグぽん ver.2.0」で、動画タイトルを挿入できるようになりました

更新日:

先日、「YouTubeを埋め込んでも重くならないようにする方法」の手順を減らすツール「ようつべタグぽん」を公開しました。

YouTubeを埋め込んでも重くならないようにする方法の『コードを自動生成するツール』を作ったよ

これらの記事を見て思いました。 shiromatakumi.hatenablog.com 「凄くイイ!!」 「でも…手順多いなあ…」 横着者の私は「なんとかして手順を減らしたい!」と思いまして、「動画 ...

続きを見る

そして今回、「動画タイトルをサムネイル画像に表示させる機能」を追加した「ようつべタグぽん ver.2.0」が完成したので紹介します。

こんな感じです。

※ はてなブログカスタマイズです。ワードプレスではCSSを変えないとうまく表示されません。(再生は可能です)

スポンサーリンク

準備

この機能を使うには、シロマティさんが作成したCSSコードを少し改変したものを使う必要があります。

記事内にあるCSSコードを少しだけ改変したものがコチラです。(シロマティさんの許可は頂いています。シロマティさん、ありがとうございました!)

これを、「デザイン→カスタマイズ→デザインCSS」に貼り付けてください。(はてなブログの場合です。)

これで下準備は終わりです。

使い方

ようつべタグぽん ver.2.0」に移動して、サムネイルのサイズを選びます。(上のCSSコードは「320✕180」に合わせています。違うサイズを使う場合はCSSコードを変更して下さい。)
f:id:varevo:20160601192310p:plain

次に、ブログに貼り付けたいYouTube動画のURLを「動画URL」に貼り付けます。
f:id:varevo:20160601175637p:plain

表示させたいタイトルを記入します。(空欄のままだと「Click to Play」が表示されます。)
f:id:varevo:20160601175647p:plain

「タグを生成」をクリックします。
f:id:varevo:20160601175655p:plain

タグが生成されますので、「コピー」をクリックして、ブログ内の表示させたい場所に貼り付けます。
f:id:varevo:20160601175703p:plain

最後に、コチラのコードを記事の一番下に貼り付けて終了です。

 

長いタイトル

 

短いタイトル

 

タイトル無し

注意点

上にあるCSSコードは、「ようつべタグぽん ver.2.0」専用のコードです。

シロマティさんのオリジナルのCSSコードでは、ようつべタグぽん ver.2.0は使えませんのでご注意下さい。(ようつべタグぽん ver.1.0は引き続き使えます。)

最後に

当初「ようつべタグぽん」は、導入手順を減らす目的で作ったんですが、これでまた手順が増えてしまいました。笑

よかったら使ってくださいね!では。

おすすめ記事

1

今、人知れず借金に苦しむ方は何人ぐらいいるんでしょうか。 返せるめどが立たない 返済金が準備できない 元金が減っていかない 借金のせいで自分の将来が見えない クレジットカードの審査が通らない きっとこ ...

2

キターーーーーー!! ついにワイルド・スピード最新作「ワイルドスピード アイスブレイク(8)」の予告動画が解禁されました! 早速どうぞ! ※ 動画更新!!(4/17) まさかの展開!ドムがファミリーを ...

3

いやはや、現役ブラックリストの私が、まさかゴールドカードを手に入れる日が来るとは… 参考現役ブラックリストの私が審査に通ったクレジットカード 私は普段「ノーマルの楽天カード」を使ってたんですが、ゴール ...

4

2016年もあと少しで終わりですねぇ。ホントあっという間。 今日は、この一年で実際に「買って良かった」「使ってよかった」という商品・サービスを、「生活全般」「育児関連」「カメラ関連」「サービス関連」の ...

5

2017年4月6日より、当サイト経由でアフィンガー4を購入していただいた方にはオリジナル特典がつくようになりました。詳しくはを御覧ください。 こんにちは。AFFINGER4(アフィンガー4)使いのLi ...

-ツール

Copyright© BACKFLOW (バックフロウ) , 2017 AllRights Reserved.