読者です 読者をやめる 読者になる 読者になる

どんべーと呼ばれて早幾年

社会に踊らされ続けるゆとり世代から見える日常を自由気ままに書き連ねます。

センテンススプリングとか名言すぎるよ!

LINE流出で芸能界を賑わせてる例の不倫カップル

ベッキーとゲスの極み乙女の川谷との不倫問題に週刊文春が新たな爆弾を投下しましたね。もはや最近の芸能ニュースはベッキー不倫vsSMAP解散で一色な気がしますが。

またもや新たな名言を作り出した!

名言というより、もはや迷言なんですが、今回の想定で新たに生まれた名言は....

「ありがとう文春!」
「センテンススプリング」

の2つ!!

なんだよ!センテンススプリングってw
面白いすぎんだろww


離婚届を「卒論」とか言い出したり、メディアからしたら最高のカモになってしまってますよね。

2016年度の流行語大賞にどれか選ばれないかな?w
いずれにしても、ベッキーもゲス乙女もワード選びの才能がありますねー。
「卒論」
「ありがとう文春!」
「センテンススプリング」

SMAPも名言を発信してくれないだろうか\(^o^)/


おわり。

本日、バルス祭りですね #バルス #天空の城ラピュタ

【バルス速報】全国民に告ぐ! 『ラピュタ』 “バルス” の目安は開始から1時間55分5秒 / 金曜ロードショーだと23時20分すぎか

ラピュタの『バルス』で2億RTを目指せ?ツイッターの挑戦が面白すぎる

「タニタ VS バルス」タニタが負けたら社名を1日「バルス」にします

NTTデータ、ラピュタ「バルス祭り」のツイート全量をリアルタイム計測 実況中継も

さて、新年早々にお祭りじゃい!

はてなブログにオーバーレイのソーシャルボタンをスマホサイトに設置する方法【忍者おまとめボタン編】

はてなブログ はてなブログ-カスタマイズ

オーバーレイのソーシャルボタンって?

オーバーレイ

上記のアニメーションは今回ご紹介させていただく、忍者おまとめボタンさんより引用させていただきました。

オーバーレイを簡単にいうと、webコンテンツ上に覆いかさばるように表示させる方法のことで、オーバーレイのコンテンツの多くは画面スクロールに追従したり、縮小拡大などの動作をすることが多いです。

 

で、今回ご紹介させていただくのは、そのオーバーレイのソーシャルボタンをスマホサイトに設置する方法

 

・たまにwebサイトで見かけるけど、実際どうやって設置するのかがわからない。

・はてなブログ初心者だから不安。

・どうせ面倒なんでしょ?

いいえ、そんなことありません。

むしろ簡単すぎて、びっくりするほどです。

 

ちなみにうまく設置できるとこんな感じに仕上がります。

オーバーレイのソーシャルボタン_設置例

  

それでは、オーバーレイソーシャルボタンの作り方から説明していきましょう。

 

忍者おまとめボタンを使ったソーシャルボタンの作成方法

1.まずは忍者おまとめボタンで作成したいデザインを選択してください。

オーバーレイのソーシャルボタンの作り方_1

2.設置するwebサイトの種類を選んでください。

今回ははてなブログ用に作成するソーシャルボタンなので、「その他のブログ」を選択します。

オーバーレイのソーシャルボタンの作り方_2

3.ソーシャルボタンの設定をしてください。

スマートフォン表示:オーバーレイ

表示位置:下

表示方法:上スクロール時

アニメーション:スライドイン

画面下からの高さ:0px

を選択すると、ソーシャルボタン用のスクリプトコードが自動で生成されます。

※もちろん、サイト毎に適性があると思いますので、上記をカスタマイズしてご利用ください。

オーバーレイのソーシャルボタンの作り方_3

4.ボタンの種類を選ぶこともできます。

「オーバーレイボタンの編集」より、設置したいソーシャルボタンの種類・デザインを再調整することが可能です。

オーバーレイのソーシャルボタンの作り方_4

 

これでソーシャルボタンの作成は完了です。次にオーバーレイのソーシャルボタンの設置方法をご説明します。

 

はてなブログへのソーシャルボタンの設置方法

デザイン>スマートフォン>フッタに生成されたスクリプトコードを張り付ければ、設置完了です。

こちらはこのブログで設置しているものと同じパターンになりますが、上から表示させたい、アニメーションの変更したい等の要望がある方は、忍者おまとめボタンの管理画面より、コードの修正を行って張り替えればOKです。

f:id:DoNbeh_G:20151224021419p:plain

 

ね?びっくりするぐらい簡単ですよね?!

まだオーバーレイのソーシャルボタンの設置を検討しているはてなブロガーの方、忍者おまとめボタンを利用した方法はオススメですよー。

 

そいじゃあ!

 

 

▼他にもソーシャルボタン関連の記事書いてます。

はてなブログテーマを変更したので記事中のソーシャルボタンを変更してみたよ!

はてなブログ はてなブログ-カスタマイズ

お題「ストレス解消法」

ブログのテーマって、しばらく使っていると飽きません?

僕の場合はある一定の間隔で飽きがやってきますね。

 

で、やっちゃう。テーマの変更。

 

そうするとこれまで頑張ったカスタマイズとかも崩れてしまうので、一旦デフォルトに戻さないといけないんですよね。

 

めんどいけど、やっちゃう。テーマの変更。

 

ってわけで、これがストレス解消になっている感がある僕ですが、実はこの衝動的な破壊行為からの学びがあります。

毎回、崩して組み立ててを繰り返しているのでスピードも速くなるし、以前相性の悪さから諦めていたカスタマイズに手を出してみたりと、意外と面白いもんです。

 

そこで今回は、はてなブログのソーシャルボタンのカスタマイズ第三弾。

第一弾、第二弾はこちらを参照してください。 

 

はてなブログに新しく導入したテーマ

Material - テーマ ストア - はてなブログ

レスポンシブ対応のはてなブログ専用テーマで、マテリアルデザイン風のものです。

このテーマを選んだ理由は、

  • レスポンシブ対応である
  • 問い合わせ先がある(ウェブ学のすすめ
  • カスタマイズ例が存在している

の3点が揃っていたからかな?あとマテリアルデザインってとこ。

 

マテリアルデザインって知ってる?

個人的にマテリアルデザインを勉強する機会があって、その奥深さが好きになってしまったんですよね。マテリアルデザインの概要が下記。

マテリアルデザインは2014年6月にGoogleが発表したデザインの概念で、Gmail、Google Maps、Google Calendar、Google日本語入力などに導入されている。Android 5.0 LollipopではマテリアルUIの作成をサポートしており、Googleがマテリアルデザインというガイドラインを提示することにより、Androidのデザインが統一されてユーザーにとって使いやすくデザインとなる。

*1

 

ソーシャルボタンのカスタマイズ方法

 で、ここからが本題のソーシャルボタンのカスタマイズ方法なんだけど。

やはり良いテーマを選んでいたようで、全てこちらに書いてありました。

webgaku.hateblo.jp

 

ちなみに設置した後のイメージはこんな感じです。オンマウス時のアニメーションもあるので、ぜひ参考にしてみると良いかと。

f:id:DoNbeh_G:20151222165404p:plain

 

そいじゃあ!