ブログにパソコン対応の「LINEで送る」ボタンを設置する 

これまでブログに「LINEで送る」ボタンを設置していましたが、これはスマホのみ動作するもので、パソコンのブラウザからはボタンを押してもLINEのホームページが表示されるだけのものでした。

しかしネットで偶然見つけたサイトで、パソコンでの動作にも対応したボタンがリリースされていることを知り、新しいボタンに取り換えてみました。

ブログにパソコン対応の「LINEで送る」ボタンを設置する

ボタンを設置したいところへHTMLを追加するだけでOK。
詳しくはLINEのホームページへ。
LINE Developers - LINE it! - “LINE it!” button for websites

設置されたボタンを押すとウィンドウが立ち上がり、サイトの概要と同時に投稿したいコメントの入力欄が表示されます。概要はOGPを設定してあればそれらの画像や説明文が使用されるようです。
ブログにパソコン対応の「LINEで送る」ボタンを設置する

内容を確認したらトークへ投稿するかタイムラインへ投稿するかを選択するだけ。もちろんスマホも対応しています。

久しぶりのブログカスタマイズでした。

記事を参考にしたり興味を持たれた方は左のペンギンアイコンをクリックしてブログ管理人に拍手を送ってください!
今後の励みになりますのでよろしくお願いします!
ブログをWindows8のライブタイルに対応させてみた 

先日ウェブサーバのエラーログを見ていると「browserconfig.xml」というファイルにアクセスがあり、404エラーになっていることを確認しました。

このファイルについて調べてみると、Windows8のインターネットエクスプローラでサイトをピン留めするとbrowserconfig.xmlが読み込まれ、記載されている内容を基にスタート画面にライブタイルとして画像を表示するもののようです。

ということで、表示する画像やxmlファイルを作成し、当ブログをライブタイルに対応してみました。

ライブタイルオフ時 小サイズ
小サイズ

ライブタイルオフ時 普通サイズ
普通サイズ

ライブタイルオフ時 ワイドサイズ
ワイドサイズ

ライブタイルオフ時 大サイズ
大サイズ

さらに調べると、小サイズ以外は用意した画像やテキストを5通りまで順次表示させることができると分かったので、ブログの最新の5記事までのそれぞれのタイトルとOGPで設定した画像を表示するようにしてみました。

ライブタイルオン時 普通サイズ
普通サイズは画像のみを表示

ライブタイルオン時 ワイドサイズ
ワイドサイズは左側に画像を小さく表示、右側にタイトルを表示

ライブタイルオン時 大サイズ
大サイズは画像にタイトルをオーバーレイ表示

このブログをピン留めしてくれる人がいるか分からないけど・・・自己満足で終わりそうなカスタマイズな感じ

記事を参考にしたり興味を持たれた方は左のペンギンアイコンをクリックしてブログ管理人に拍手を送ってください!
今後の励みになりますのでよろしくお願いします!
MovableTypeをVer6.02へアップグレード 

当ブログで使用しているブログウェア MovableType を最新版のバージョン6.02へとアップグレードしました。

昨年10月のバージョン6公開後すぐにインストールしてプラグインの互換性を確認してみたところ、コメント時にツイッターアカウントでサインインするTwitCommentプラグインの動作がおかしいことを確認。ツイッターサーバとの認証時に「Mozilla::CAがなんたらかんたら・・・」というエラーが出て先に進めませんでした。

おそらくMozilla::CAというモジュールをインストールすればよいのだろうと考えSSHでサーバにログインしようとしましたが、何が原因か分かりませんがログインできずにインストール断念。そしてバージョン5に戻し運用していました。

先日改めてログインを試みたところ今回は成功し、ウェブで調べた情報を頼りにMozilla::CAをインストール。しかし、インストールは成功しているはずだけどウェブ上ではどうも認識していない様子。さらに調べたところ.htaccessに設定を加えるとよいとのことだったので実行してみたところ、ちゃんとウェブ上で認識してツイッターサーバとの認証にも成功したので、その後はバージョン6.02をインストールし直して運用しています。

MovableType6からはグーグルアナリティックスと連携できるということで設定してみました。
MovableTypeをVer6.02へアップグレード
ダッシュボード上にアナリティクスから得たブログのアクセス数がグラフで表示されるようになりました。このようにして確認できるのは便利かも。

記事を参考にしたり興味を持たれた方は左のペンギンアイコンをクリックしてブログ管理人に拍手を送ってください!
今後の励みになりますのでよろしくお願いします!
ブログをツイッターカードに対応させてみる 

当ブログをツイッターカード(TwitterCards)に対応させてみました。

Twitter Cards
ツイッターの呟きの中にツイッターカードに対応したサイトのURLが含まれている場合「概要を表示」が表示され・・・
Twitter Cards
「概要を表示」をクリックすると、サイトの概要や画像が表示されます。

設定方法はHTML内に画像の表示方法をMETAタグで記述、その他にサイト名や概要、画像URLもMETAタグで記述しますが、これらはOGPを設定してある場合は省略することが可能で、あとはツイッターに登録申請すれば利用可能となります。

設定後様子を見ていたのですが、一度「概要を表示」が表示された場合でもしばらくすると表示されなくなったり再び表示されたり・・・

何か設定ミスでもあるのでしょうか?

記事を参考にしたり興味を持たれた方は左のペンギンアイコンをクリックしてブログ管理人に拍手を送ってください!
今後の励みになりますのでよろしくお願いします!
ブログで画像付きコメントを投稿出来るようにしてみた 

小粋空間のCommentCustomFieldプラグインを使用して、ブログのコメント投稿を画像付きで出来るようにしてみました。

プラグインはコメントにテキストボックスやチェックボタンなどを追加するものですが、当ブログでは画像投稿機能だけを使用。

スパム対策のためmixiやTwitterなどのアカウントでサインインした場合のみコメント内容確認ページでファイル投稿フォームを表示し、そこから投稿出来るようにしています。

画像付きでコメント投稿

投稿した画像をクリックしたらLiteboxを使用して拡大表示するようにしました。

小粋空間
http://www.koikikukan.com/

記事を参考にしたり興味を持たれた方は左のペンギンアイコンをクリックしてブログ管理人に拍手を送ってください!
今後の励みになりますのでよろしくお願いします!
コメントのアバターをGravatarに対応させる 

当ブログのコメント入力者のアバターをGravatarに対応させました。

予めGravatarでメールアドレスと表示させたい画像を登録しアカウントを取得。

コメント時にメールアドレス入力欄へGravatarに登録したメールアドレスを入力することでアバターを表示するようにしました。

アバターをGravatarに対応

MovableTypeではプラグインで構築できるようですが、当ブログではPHPを利用して画像を出力するようにしてみました。

Gravatar
http://ja.gravatar.com/

記事を参考にしたり興味を持たれた方は左のペンギンアイコンをクリックしてブログ管理人に拍手を送ってください!
今後の励みになりますのでよろしくお願いします!
ブログに LINEで送る ボタンを設置 

当ブログにツイッターのツイートボタンやフェイスブックのいいね!ボタンなどをを設置して以来、それらのSNSを経由してのアクセスが少なからずあるのですが、最近自身がスマホでLINEを始めたのをきっかけに「LINEで送る」ボタンを設置してみました。

LINEで送るボタン

LINEをインストールしたスマホでボタンを押すと、友達やグループのトーク、または自分のホームにURLを投稿して内容を共有できるようになります。

LINEをインストールしていないスマホやパソコンのブラウザなどでボタンを押すとLINEのホームページに繋がるようなので、ユーザーエージェントで判別するなどしてスマホだけで表示するように工夫しなければいけませんね。

記事を参考にしたり興味を持たれた方は左のペンギンアイコンをクリックしてブログ管理人に拍手を送ってください!
今後の励みになりますのでよろしくお願いします!
1  2  3  4  5  6  7  >  >>
Photo Reader
Twitter & Facebook

Facebookページへ
ブログの更新はツイッターフェイスブックページでお知らせしています。Windows8以降のライブタイルにも対応しています。
Recent Comments
Ranking
Information
track word
Recent Entries
Categories
Monthly Archives
- このページの検索ワード -
loading