YouTube Player API で動画を制御する | バシャログ。
どうもお久しぶりです fujihara です。 春一番が吹き荒れ街も暖かくなってきましたね。 季節の変わり目って布団の量が難しくて風邪を引きやすいと私は 思っているので皆さんもお気をつけ下さい。 本日はYouTube Player API で動画を制御します。 目的 業務で YouTube を連続で再生させたいという依頼があり使用しました。 (詳細は省きます) コード 以下Googleのサンプルコードです。** 参考 ** iframe 組み込みの YouTube Player API リファレンス <div id="player"></div> <script> var tag = document.createElement('script'); tag.src = "https://www.youtube.com/iframe_api"; var firstScriptTag = d
displayプロパティを使ってレスポンシブウェブデザインのtableレイアウトを変化させてみる | バシャログ。
こんにちは。まだ何一つ夏を感じていないmackyです。 今日は、RWDでdisplayプロパティを使ってtableレイアウトのデザインを変化させる方法をまとめてみました。 RWDでテーブルレイアウトを定義リスト風に変化させてみよう tableタグのdisplayの値はデフォルトではtable、thとtdタグはtable-cellとなっていますが、この値をblockやlist-itemなど他の値に変えてみます。 (1) (2) (1)の状態から(2)の状態へデザインを変化させます。 メディアクエリ―を使ってブレイクポイント（480px）を設定し、その中に上書きするCSSを書いていきます。 今回はこんな感じです。 HTML <table border="1" cellpadding="5" cellspacing="0"> <tr> <th>項目A</th> <td>この文章はダミーです。</
【CSS3】Animate.cssを使って簡単にアニメーションを実装する。 | バシャログ。
fukasawaです。こんにちは。 クナイプのグーテナハトが安眠に良いと聞いたので試してみたのですが、風呂場中にタイカレーのようなスパイシーな香りが広がりました。安眠…？ Animate.cssは要素にclassをつけるだけで、簡単にいろいろな種類のCSS3アニメーションを実装してくれる便利なスタイルシートです。多くのブログで既に紹介されているものではあるのですが、バシャログではまだ誰も書いていないようなのでここぞとばかりに書いてみます。 公式サイト（デモ&ダウンロード） http://daneden.github.io/animate.css/ GitHub(使い方など) https://github.com/daneden/animate.css ※CSS3アニメーションに対応しているブラウザで動作します。 簡単な使い方 animate.min.cssを読み込みます。 <head> <
【WordPress】記事や固定ページを期間限定で非公開にできるプラグイン「Post Expirator」 | バシャログ。
日曜日にUEFAチャンピオンズリーグの決勝を観戦し、今週は失意のどん底･･･なアレッティ、Latinです。 今回も便利なWordPressプラグインをご紹介。 「需要なさそうで割とあったりする要件」の一つに、「記事を自動的に非公開にしたい！」という案件がたまーにあったりします。 そういう時は、「Post Expirator」が便利！ プラグイン「Post Expirator」をインストール プラグインをインストール。 Post Expirator（wordpress.org） 設定方法 初期設定をしてみます。 まず「期間の初期値」ですが、ここで値を設定しておくと、記事投稿時の設定に自動的に反映してくれます。 例えば、「+5 minute」などと設定しておくと、記事作成時間から起算して「5分後に公開終了」というように、期限設定を反映してくれるようになります。 もちろん記事ごとに個別で設定を変
【Google Analytics】毎回ググって面倒なイベントトラッキングの使い方をまとめてみよう | バシャログ。
ソチってどっち？Latinです。今回は Google Analytics のイベントトラッキングの使い方についてです。コレ、毎回ググってる気がするんですよね･･･。なのでここらでまとめておこうと思います。 従来のクラシックアナリティクス（非同期型）とユニバーサルアナリティクス 従来のクラシック（非同期型）とユニバーサルアナリティクス版で実装の方法が若干違ってきますが、呼び出すメソッドが異なるだけで内容に大きな違いはありません。 今現在利用中のアナリティクスが従来型なのかユニバーサルアナリティクスなのかは、Google Analytics 画面の「アナリティクス設定→トラッキング情報」で確認できます。 また、実装されたトラッキングコードでも確認が可能です。 従来の非同期型のトラッキングコード例 _gaq.push(['_setAccount', 'UA-1234567-1']); ユニバーサ
【WordPress】シンプルで使える！営業日カレンダープラグイン Biz Calender | バシャログ。
7年後はおっさんの Latin です。 東京オリンピック開催決定しましたね！ プレゼンの内容も良かったと思うのですが、「コンパクトなオリンピック」という一貫した企画が良かったのではないかと個人的には思っています。 日本らしい素晴らしい企画ですよね。 さて、今回はシンプルな WordPress カレンダープラグインをご紹介。 Simple is Best なカレンダープラグイン「Biz Calender」 WordPressのカレンダープラグインは結構あるにはあるのですが、割とリッチなUIのものが多く、機能盛りだくさんだったりします。 しかし、「単純に営業日表示だけできれば良いのに･･･」なんてケースも多いですよね。 Biz Calender プラグインは･･･ ご覧の通りシンプル。 「一時停止マーク」はページ送りをリセットするUIになっています。 CSSも同梱されていますので、見た目の変更
[WordPress]サムネイル画像を再生成してくれるプラグイン Regenerate Thumbnails | バシャログ。
こんにちは Latin です。WordPressのプラグイン「Regenerate Thumbnails」のご紹介。先日、実案件ですごく便利なプラグインだな～と感じたのでメモ。 WordPress の functions.php にオリジナルサイズのサムネイルを、いくつか生成する処理をいれているのですが、途中の仕様変更でサムネイルサイズが変わる事に･･･。 通常、サムネイル生成は「画像をアップロード」した際に走る処理の為、アップロードし直さなければなりませんが、すでに数百件のデータが入っている場合、そんな訳にもいきません。 既に数百件の記事が投稿されている。（画像が数百枚） サムネイル生成の処理は「画像アップロード時」に走る為、再アップロード作業が必要。 プラグインでなんかいいのないかな～と思っていたら、 ちょうど LIGさんのブログでまさに「要件バッチリ」なプラグインを紹介されていました
[WordPress]パーマリンクの変更方法とパターンの考察 | バシャログ。
こんにちは Latin です。 バシャログ。には、WordPressの記事が少ないな～と感じてたので今後増やして行きたいと思っています。 今回はWordPressの基礎的な分野でもあるパーマリンク設定について簡単にまとめてみます。 例として、「果物」のカテゴリーに「リンゴ」の記事を投稿すると仮定します。 【デフォルトパーマリンク】 http://example.com/?p=1 カテゴリーや投稿スラッグなどの識別要素がなく、記事の投稿IDのみになっていますね。 せっかくなのでSEOに有効なパーマリンクに書き換えます。 【パーマリンク設定変更画面】 サイドメニューの「設定」→「パーマリンク設定」で設定画面を開きます。 「カスタム構造」にチェックをして、パーマリンクタグを任意のものに書き換えます。 【利用可能なパーマリンク構造タグ】 %year% 投稿年・4桁 （例）2004 %monthnu
商用可！アイコン,イラスト素材検索・配布サイトまとめ【海外編】 | バシャログ。
お布団から出るのがだんだん辛くなって来ました seki です。 今回は私が普段利用している、無料＆商用でも使える、素材を配布、または検索できるサイトをご紹介します。ブックマークしておくと、いざという時大変便利。かなり有名所なので、これ知ってる！というのも多々あるかと思いますが、お付き合いくださいね。 引出しに入れておきたい海外の無料素材検索サイト 商用利用可である事がサイト内で判断しやすいサイトのみを集めてみました。 ※念のため、ご利用の前に各サイトの素材ページにあるライセンスを確認の上、ご利用下さい。 【all-silhouettes】 商用可のシルエットベクターデータを配布しています。 有料サイトも顔負けな種類と量、質の良さ。欲しい素材を見つけたら、広告ゾーンをスクロールで抜けた所にある[Download free …]の地味なボタンからダウンロードできます。 http://all-s
Raphael.jsを勉強したいのでいろんなサイトまとめ | バシャログ。
ちょうど金環日食の時だけ曇り空だったminamiです。皆さんはちゃんと見られましたか？ Webサイトでベクターデータを扱うのにとっても強力なRaphael.jsというライブラリがあります。何年か前からあるのですが、なぜか最近興味が出てきたので勉強できるサイトを調べました。 Rapahel.jsはJavaScript用のグラフィックライブラリで、比較的簡単な記述でSVGで扱うことができます。SVG非対応のIEの場合はVMLで表示してくれるのがミソで、IE6であっても同じ見た目を確保することができます！また、マウスイベントに関連付けたアニメーションも作ることができます。 ライブラリ自体は多少容量が重いのですが、他のライブラリに依存していないのでこれ単体で済んでしまうというのも強みではないでしょうか。ちょっといじっただけで値によって変化するグラフなんかも描くことができます。 棒グラフのサンプル
引き続き、ソーシャルボタン設置のソースコードサンプルあれこれ。 | バシャログ。
みなさん、今年も残り40日くらいだそうですよ。 年末の大掃除が終わるか今から心配なhakoishiです。 さて、今回は前回に引き続き、ソーシャルボタン設置のソースサンプルをご紹介。 今回は、「google+」「mixiチェック」「mixiイイネ！」「evernote」の4つです。 ※前回のエントリーはこちらから。「はてなブックマーク」「twitter」「facebook」「addthis」を取り上げています。 ソーシャルボタン設置のソースコードサンプルあれこれ。 google+ <g:plusone href="http://c-brains.jp/blog/wsg/"></g:plusone> sizeでサイズ、countでカウンターの有無を指定します。特に指定しない場合はカウンター有り、サイズは標準になります。 以下、サンプル。（※識別キーがダミーだと表示されないので、ボタンは画像にし
ソーシャルボタン設置のソースコードサンプルあれこれ。 | バシャログ。
今日は2011/11/11、やたら「1」の並ぶ日付です。 11時11分にスクリーンショット撮り損ねてちょっとorzなhakoishiです。 いっそその時間に更新までしてしまいたかった！後の祭り。 さて、今回はソーシャルボタン設置のソースサンプルをいくつかご紹介。 今回取り上げるサービスは、「はてなブックマーク」「twitter」「facebook」「addthis」の4つです。 (2011/11/22)その2、アップしました。「google+」「mixiチェック」「mixiイイネ！」「evernote」編です。 引き続き、ソーシャルボタン設置のソースコードサンプルあれこれ。 はてなブックマーク <a href="【URL】" class="hatena-bookmark-button" data-hatena-bookmark-title="【サイト名】" data-hatena-book
cssで縦方向中央に配置する方法（5つのケース＋1） | バシャログ。
iPhone 4Sが発売間近。 買おうか迷って一旦諦めたはずがまた迷い始めました、hakoishiです。 Siriに甘い言葉をささやきたい。英語できないけど。 さて、コーディングで縦中央にオブジェクトを配置したいことって少なくないですよね。 しかしながら、cssはそういうのちょっと苦手。 「ほら、あの時使ったアレだよアレ！」と過去のソースを掘り起こしてみても、状況が違ってて使えないケースも多かったり。 というわけで今回は、cssで縦中央配置するためのtipsを5つのパターンに分けてまとめました。 case1：画像の場合 上下方向中央を始点として画像を配置し、画像の縦サイズの1/2だけネガティブマージンで上に移動。 サンプル html <p class="case01"> <img src="http://dummyimage.com/100x100/000/fff.gif&text=img
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【WordPress】お問い合わせ内容も管理画面で管理できてトレビア〜ンなフォームプラグインinquiry form creator | バシャログ。