ツール

【新機能追加】「ようつべタグぽん 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

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

3

当ブログでは過去に、人気のある音楽ストリーミングサービス(聴き放題サービス)を徹底解説してきました。 最近はますますサービス内容の横並び感が強くなってきていますが、やはりどのサービスにも特徴はあります ...

4

今日は、2016〜2017年で実際に「買って良かった」「使ってよかった」という商品・サービスを、「生活全般」「育児関連」「カメラ関連」「サービス関連」の4ジャンルに分けてまとめてみようと思います。 気 ...

5

一般人にはちょっと手の届かない感じのある『楽天プレミアムカード』ですが、実は『年会費10800円なんて簡単に取り返せるほどお得なカード』だということはあまり知られていません。 結論から言ってしまうと、 ...

-ツール

Copyright© BACKFLOW , 2017 All Rights Reserved.