BlogTop > myown Archive

myown Archive

all of 10

すべてのページ

今月のいらんことしい(2022年 4月)

今月(2022年 4月)、サイトでカスタマイズした点をまとめたページです。

  • * テンプレートテーマ mt.Vicuna-HTML5 を lab に適用
  • * lab の Google Analytics を GA4タグに移行

MovableType向けテーマは、 HashiM 運営の mt.Vicuna 専用サイトにて配布されています。

https://mtvicuna.kita2.net/

mt.Vicuna-HTML5 ですと、Googleアナリティクス向けモジュールの読み込みが、</head> 付近にあったと思いますが、

GA側で指定されていますように、HAED 開始タグの直下にインクルードモジュールされた方が良いかと思われます。

(おそらく後で修正してくださるかと)

GA4 は、Google アナリティクス ユニバーサル アナリティクス 終了するとのアナウンスがありましたので対応しています。

https://support.google.com/analytics/answer/11583528

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2020年 12月)

今月(2020年12月)、本年最後のサイトでカスタマイズした点をまとめたページです。

  • labs.markdiary.com のvicuna HTML5テンプレートの パンくずリストの修正

パンくずリスト(topic_path)には、マイクロデータとして、data-vocabulary.org のスキーマが採用されていたのですが、Google のコンソール側でサポートが終了するといった警告が出ていましたので、schema.orgに移行しました。

参考:

構造化データを伝える方法として、JSON-LD という方法が割と楽に実装できるらしいのですが、そのために別にモジュールを作成したりなどする必要があり、今回は見送りHTMLを修正するようにしました。

しかしながら、 vicuna テンプレートの topic_pash は条件分岐が複雑なのでかなり苦労しました(何回もリッチリザルトのチェッカーに怒られてる)。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2020年 11月)

今月(2020年11月)、サイトのカスタマイズした点をまとめたページです

  • labs.markdiary.com を https ~ に変更

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2020年 10月)

今月(2020年10月)、サイトのカスタマイズした点をまとめたページです

  • Google Analytics 4 プロパティへ移行開始
  • ブログ記事のタグアンカーの文字の前にハッシュマークを付与

タグのハッシュマークは、SNS上でハッシュタグの共有が行われている傾向に合わせたものです。

Google Analytics は GA4としてリリースがありました。

改善点は幾らかあるのですが、個人としては、基本的なイベント計測が自動で行われるので、こちら側が計測用スクリプトを用意しなくて済むのは大きいと考えました。

副作用というか、GA4には今の時点で、データにアクセスできるようなAPIが用意されてないようでした。

したがって、これまでのタグを全て変えてしまいましたので、MovableType管理ページからのAPI経由の情報が取れなくなっています。(GA4では以前のプロパティを使わないようになってる)

iOSアプリからも参照できることから、あえてMovableTypeのダッシュボードでみる必要もそれほどなくなっているのは事実ではあります。

今月のカスタマイズは以上です。バックナンバーは以下です。

当ブログのカスタマイズ記録

今月のいらんことしい(2019年 7月)

  • Posted by: maRk
  • myown | net
  • はてなブックマークに追加

今月(2019年 7月)、ブログでカスタマイズした点をまとめたページです

  • Bookmarkページで、 YQLによるフィード取得ができなかったのでこの部分を削除

YQLはサービスそのものがなくなっていたので、ブックマークページのRSSから最新を取り込むことができなくなったので削除しました

今月のカスタマイズは以上です。バックナンバーは以下です。

当ブログのカスタマイズ記録

今月のいらんことしい(2019年 6月)

今月(2019年 6月)、サイト内でカスタマイズした点をまとめたページです

  • * はてなブックマークページのHTTPS化に伴い、リンク先スキームをhttps:に変更
  • * WordPress プラグインで、Twitter Blackbird Pie 不使用につき、使用した記事を編集
  • * MTGetVar テンプレートタグ(現在非推奨)をMTVarタグへ変更
  • * ActionStreams で「はてな」関係のストリームを削除

はてなブックマークのHTTPS変更は以下に情報があります。

基本、http始まりのリンクはリダイレクトされるらしいですが、修正することをおすすめする、としています。

Blackbird Pie はツイートの内容を簡単に埋め込むためのものですが、エディタでリンクをペーストするだけで事足りてしまうので使用しないことにしました。

MTGetVar は非推奨タグになっていたため、MTVarへ置換しました。

(MTVar の説明ページでは、今現在でmt:getvar のエイリアスという記述となっています。)

ActionStreams では、はてなブックマークへの情報取得に失敗してエラーがログに記録されており、調べてところフィードが、ほぼ死んでる状態にあったので、はてなの他サービスも終了しているものもありましたので、プラグインごと削除しました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2019年3月)

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

今月(2019年 3月)、本年最初のサイト内カスタマイズした点をまとめたページです

  • * テクノラティプロフィールへのリンク削除
  • * 全文配信同盟のリンク削除
  • * タグクラウドウィジェットの削除

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2018年12月)

今月(2018年12月)、本年最後のサイトでカスタマイズした点をまとめたページです

  • WordPress 5.0xへアップデート
  • WordPress oEmbed 対応
  • Movable Type oEmbedテンプレートの吐き出すJSONの author_url をHTTPSへ変更

oEmbed が機能していなかったので修正。

テーマの functions.php にwp_oembed_add_provider() を追記

以下に説明があります。(英語)

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2018年6月)

今月(2018年6月)、サイトでカスタマイズした点をまとめたページです

  • * XML-RPCのCGI停止

XML-RPC APIに対応したクライアントを現在使用していないため、停止(パーミッション変更)にしました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2018年5月)

今月(2018年5月)、サイトでカスタマイズした点をまとめたページです

  • WordPress で公開後1年以上経過の記事にメッセージを挿入
  • 検索ぺージが動いていなかったのを修正
  • target=_blank のあるリンクに rel=noopener を付与した

古い内容の記事に注意書きをするのに、「WP Posts Date Alert」というプラグインを使いました。

プラグインについては、以下のページに詳細があります。DL先も記載されています。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2018年4月)

今月(2018年4月)、サイトでカスタマイズした点をまとめたページです

  • はてなブログ (maRkの)の HTTPS設定
  • TypePad API キー 解除
  • Action Streams のページリンクを本ブログ外のディレクトリーのほうに変換

はてなブログ側で読み込んでいるファイルを、https://からのURLで読むように変更しました。

TypePad APIキーは、コメントで使う必要性がなくなってましたので、TypePad側から、登録済みキーを空欄にしてクリアしておきました。

今月のカスタマイズは以上です。バックナンバーは以下です。

メモ: Open in Chrome アドオンをインストール

  • Posted by: maRk
  • Mac | PC | myown
  • はてなブックマークに追加

Open in Chrome は、Firefox で開いているページを Google Chrome で表示する拡張機能です。このインストールのメモ

Firefox Quantum 以降、ページをGoogle Chrome で開くアドオンが使えなかったので、対応済みのアドオンを入れ直しました(当然ですが、Google Chrome はインストール済みという前提です)。

Firefox の アドオンページ (https://addons.mozilla.org/ja/firefox/) で Open in Chrome を検索すればあるかと思います。

現時点でのリンクは以下です。

「+ Firefox へ追加」 ボタン押下後、インストール許可でダウンロード・インストールします。

なお、これだけでは、インストールが完了しませんので、パッチをあてる必要があります(ページをChromeで開けない)。

ここでプラットフォームに応じたファイルを選びます。

自身の使用 PC は Mac なので Mac 向けファイルで説明します。

mac.zip というファイルをダウンロードして、unzip します。

展開後のフォルダーの場所は任意でいいかと思われますが、管理的都合で、自身のホーム配下に移動しました。

$  cd ~/mac
$  ./install.sh

で実行後に

>>> Application is ready to use <<<

と表示されれば完了です。

これでブラウザーで、コンテキストメニューを開き、Open Link in Chrome を選べば、Google Chrome が起動して、ページを開きます。

open_in_chrome_with_firefox.png

パッチのアンインストールですが、 /mac/フォルダー下の ./uninstall.sh を実行します。

コンテキストメニューで選択しても Chrome で開けなくなります。

今月のいらんことしい(2018年3月)

今月(2018年3月)、サイトでカスタマイズした点をまとめたページです

  • * Movable Type を 6.3.7 向けのパッチを適用
  • * サイトトップページの Feedly 登録ボタンのURLが違っていたのを修正

Movable Type 6.3.7 へのパッチが提供されていましたので、ダウンロードしてあてておきました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2018年2月)

  • Posted by: maRk
  • mt6 | myown
  • はてなブックマークに追加

今月(2018年2月)、今年最初のサイト内にカスタマイズした点をまとめたページです

  • グローバルナビゲーションの ActionStreams へのリンクを Tags(タグ一覧)へ変更
  • Movable Type を 6.3.7 へバージョンアップ

Movable Type はセキュリティアップデートが提供されていました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2017年12月)

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

今月(2017年12月)、今年最後のサイトでカスタマイズした点をまとめたページです

  • WordPress で使わないテーマを削除
  • ブログトップページで、はてなブックマーク人気エントリーのウィジェット削除

WordPress のテーマで使っていないテーマでも更新があるたびに通知が来るなど、鬱陶しいところがありますので、削除しました。

テーマから「詳細」へ行き削除。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2017年9月)

今月(2017年9月)、サイトにカスタマイズした点をまとめたページです

今月は、Coreserver 側で無料SSL (Let's Encrypt)の準備ができていたため、それに関する設定等です。

  • PHPのバージョン設定を全て 7系に
  • tsuredurebox.geo.jp に対してSSL設定
  • Movable Type の環境変数、SSLVerifyNoneを削除

以下にバリュードメイン(以下、VD)からのお知らせがあります。

マニュアルには、SSLサイトを「新規作成」する方法で説明されていますが、実際のところは既存サイトごとの設定の変更で、無料SSLの利用設定をすればいいようです。

今回は、お試しで VD提供のサブドメインのサイトでSSL設定をしてみました。

設定方法は、新コントロールパネルでの説明になりますが、サイト一覧から目的のサイトを選んで、「サイト設定の変更」を押下、SSLの設定のところで、「無料SSL」を選択してから反映させます。

WordPress側では、「設定」の一般で WordPressアドレス・サイトアドレスをそれぞれ https:// から始まるようにします。

VDのサブドメインで行ったため、http:からのリダイレクトは設定ずみのようで、.htaccessに記述しなくても問題ないようでした。

あとは、http:から始まるファイルのリンクを書き換えするなどです。(混在コンテンツとして、ブラウザで警告表示が出たり、表示ブロックがなされたりするので)

記事内では、検索系のプラグインを使って一気に書き換えるといった情報がWebでは幾つか見られます

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2017年8月)

今月(2017年8月)、ブログでカスタマイズした点をまとめたページです

  • Live Dwango Reader登録リンクを削除した
  • LDR Pocket 登録ボタンを削除した
  • その他フィード登録のモジュールのインクルードを解除

Live Dwango Reader 及び LDR Pocket のサービス終了のアナウンスが出ていましたので、登録リンク等を削除しました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2017年7月)

今月(2017年7月)、サイトでカスタマイズした点をまとめたページです

  • Movable Type を 6.3.5 へアップデート

v6.3.5が提供されていましたので適用しておきました。

なお、このバージョンにはパッチが提供されています。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2017年6月)

今月(2017年6月)、ブログのカスタマイズした点をまとめたページです

  • jQuery のバージョンをアップデート
  • jQuery Cookie を js.cookie.js へ
  • カテゴリーページの関連ツイート表示を削除

3.0.0 だった jQuery を 3.2.1へ上げました。

jQuery Cookie も古いバージョンだったし、動作してないことがあったので修正しました。

jQuery Cookie の時と使用方法が若干異なっているので注意します。

Cookies.set('name', 'value');

基本、Cookies.xxxx() といった形式に変わります。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2017年5月)

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

今月(2017年5月)、サイトでカスタマイズした点をまとめたページです

  • WordPress を 4.7.5 へアップデート
  • WordPress テーマを Twenty Seventeen へ変更

WP 4.7.5 はセキュリティアップデートとして提供されました。

Twenty Seventeen テーマは、ヘッダ部分にアイキャッチ画像を大きくとるテーマなのですが、「カスタマイズ」のところで簡単に非表示にすることもできます。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2017年3月)

今月(2017年3月)、ブログでカスタマイズした点をまとめたページです

  • Movable Typeを v6.3.3へアップデート

Movable Type 6.3.3は、主にクラウド版への対応がメインですが、そのほか、バグ修正・パッチ等々取り込まれているとのことです。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2017年2月)

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

今月(2017年2月)、サイトでカスタマイズした点をまとめたページです

  • WordPress を4.7.2へアップデート
  • はてなブックマークボタンのデザイン変更に伴い、表示するボタンデザインを変更

WordPressにセキュリティリリースがありましたので適用しました

「はてなブックマークボタン」は、デザインの変更がおこなわれました。

デフォルトでは、以前よりブックマーク数が見えにくいので、レイアウトをブックマーク数がボタン上部に別表示されるタイプに変えました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2017年1月)

今月(2017年1月)、今年最初のサイトでカスタマイズした点をまとめたページです

  • Movable Type 6.3.x 向けパッチ適用を差し戻し
  • AMPページに Analytics を設定

Movable Type にパッチが提供されていましたが、ダイナミックなページにエラーがでるようになっていたので差し戻ししました。原因は不明です。

AMPページの計測をするために、AMPページ向けアナリティクスを設定しました。

説明は以下にあります。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2016年12月)

今月(2016年12月)、今年最後のサイトでカスタマイズした点をまとめたページです

  • Movable Type 6.3.x 向けパッチを適用した
  • 記事ページの Evernote Clip it ボタンを外した

Movable Type にパッチが提供されていましたので、ダウンロードして適用しました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2016年11月)

今月(2016年11月)、ブログでカスタマイズした点をまとめたページです

  • 月別アーカイブインデックスページの修正

月別アーカイブインデックスを復活させて、サイドバーのリンクも戻しました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2016年10月)

今月(2016年10月)、ブログでカスタマイズした点をまとめたページです

  • - PHPカスタムテンプレートの修正

拡張子 .php のカスタムインデックステンプレートで、純粋なPHPのみのテンプレートがあるので、これらテンプレートの閉じタグ(?>)を入れないようにしました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2016年9月)

今月(2016年9月)、サイトのカスタマイズした点をまとめたページです

  • - Movable Type を6.3にアップデート
  • - PHPのバージョン変更
  • - テクノラティプロフィールのリンク削除
  • - 月別アーカイブページへのリンク削除

Movable Type 6.3 がリリースされました。PHP7対応と幾つかの追加機能・修正等が含まれています。

PHP 5,5系は Security fixes のサポートが切れているので、サーバの設定画面から切り替えを行いました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2016年8月)

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

今月(2016年8月)、サイトでカスタマイズした箇所をまとめたページです

  • WordPress 4.6 へアップデート

WPは4.6 がリリースされたので更新しておきました。

幾つかの機能追加があるようです。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2016年6月)

今月(2016年6月)、サイトのカスタマイズした点をまとめたページです

  • movabletype.jp がSSL化されたようなので、記事内のリンクを置換
  • ページ上でトグルを行うためのJS (toggle.js) が必要のない個別記事ページで読み込まれていたのを修正
  • Feed の登録リンクで、My Yahoo! への登録リンクを削除
  • jQueryのバージョンを 3.0 に変更した

RSSの My Yahoo! への登録は、My Yahoo! サービス終了とのお知らせがありましたので、外すことにしました。

jQuery は 3.0 が正式にリリースされました。

上記ページを参考に当サイトで部分的に書き換えをしておきました。

具体的には、$.ajax() 周りと、document-readyが、$(fn)の形式になるように等。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2016年5月)

今月(2016年5月)、サイトのカスタマイズした点をまとめたページです

  • - WordPress のプラグイン、 Ktai Style を削除
  • - WordPress の 4.5.2 セキュリティリリースを適用
  • - サイトの使用PHPバージョンの設定変更
  • - header要素に role = banner とある箇所の属性削除

Movable Type 、WordPress 運用のPHPバージョンをそれぞれあげました。

WordPress は、Plupload ライブラリに脆弱性があるとのことで、アップデートをおこないました。

role = banner はバリデータで、不要だと言われるので削除しました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2016年4月)

今月(2016年4月)、サイトのカスタマイズした点をまとめたページです

  • mixiCommenter プラグインを削除した
  • WordPress を4.5 にアップデート
  • 使わない WordPress テーマを削除
  • Bookmarks ページのブックマークリストを delicious から Hatena::Bookmarkに変更した

mixi の OpenIDサービスは提供を終えているため、システムから削除しました

(v6.2.4から同梱されず)

DISQUSコメントにとっくしてあって、MTのOpenIDの方は使っていない状態でしたが、削除することで、これまで mixi IDでコメントされた方についていた mixiアイコンが出なくなります。

参考:

WordPress テーマは未使用でもアップデートがあれば更新に出てくるので、使わないテーマは削除しました。(管理画面のテーマのところで可能)

Delicious ですが、オーナーが変わったり、サイト変更があったりなど、サービスとして不安定な状態が継続してるため、はてなブックマークの方でブックマークしたリストで掲載しています。

はてなブックマークのフィードを YQL(Yahoo! Query Language)へ渡し、JSONで返ったものを処理する形にしています。

YQL側でキャッシュされていることと、取得方法を一度覚えたら、ほとんど統一された形式で他のフィードの取得ができるなどのメリットがあります。

Movable Type ならば、Action Streamsプラグインのテンプレートタグで表示できたりしますが(はてなブックマーク用の Streams configが必要)、cronジョブ等で定期更新しないと反映のタイムラグが大きい、といったことがあります。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2016年3月)

今月(2016年3月)、サイトのカスタマイズした点をまとめたページです

  • Movable Type を 6.2.4 に
  • Movable Type 6向け修正パッチを適用
  • LiveDwango リーダーへの登録リンクを reader.livedwango.com サブドメインに変更した
  • 個別記事アーカイブをAMP対応させた

あまり Google Chrome で編集したりはしないのですが、Chrome での問題修正パッチが出ています。

AMP (Accelerated Mobile Pages) は、モバイル端末向けページを高速表示させるためのプロジェクトで、米グーグルと Twitter共同で立ち上げたものです。

Movable Type 関係では、以下のとおり

などでまとめられています。

てっとり早く対応するには、記事アーカイブテンプレートに AMP用のテンプレートを作成してマッピング設定して、記事内の禁止されている、タグ・属性群を削除・変換して運用することです(対応させるまでに手間がかかるのが現実なんですけれども)。

このブログで使っているもののベースのようなテンプレートです。 Google Analytics など AMP付随のモジュールを使っていません。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2016年2月)

今月(2016年2月)、本年最初のサイトでカスタマイズした点をまとめたページです

  • スタイルシートで、Mac IE5向けのCSSハックを削除した

Mac IE5は、現状まず、その環境の訪問者が皆無なので削除にしておきました。対応環境以外はコメント扱いなのでそのままでも実害はないのですが。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2015年12月)

今月(2015年12月)、今年最後のサイトでカスタマイズした点をまとめたページです

  • Movable Type を 6.2.2 にアップデート
  • サイトで使用する PHP のバージョンを変更した
  • 使用している WordPress を4.4 にアップデート

WordPress は 4.4から oEmbed プロバイダー機能がつくようになりました。他のWebサービスで、oEmbed 対応していれば、URL 張り付けだけで、記事埋め込み用 HTML を取得できます。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2015年11月)

今月(2015年11月)、サイトでカスタマイズしたものを記録したページです

  • Movable Type を 6.2 のパッチ適用
  • Pinterest アイコンが読み込めなかったのを修正

Movable Type 6.2 でエントリーのベースネームに関係する不具合修正パッチが配布されていたので、適用しておきました。

Pinterest でアイコンの場所が変わったか何かでしばらく読み込みできなかったようなので、こちら側の環境にアイコンを置くようにしました。

法人向けではありますが、以下のページでアイコンをダウンロードすると、各種サイズのアイコンが同梱されています。ガイドラインもあるので一応、目をとおしておいたほうがいいように思います。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2015年10月)

今月(2015年10月)、サイトでカスタマイズしたものを記録したページです

  • - Movable Type を 6.2 にアップデート
  • - SSL証明書の検証のアラートがでるのを環境変数で無効に
  • - Akismet の APIキーが有効期限切れとのことなので更新した

SL 証明書の検証ができません。

このメッセージを消すには、Mozilla::CA モジュールをインストールするか、mt-config.cgi に "SSLVerifyNone 1" を指定してください。

Mozilla::CA は自前でいれてはいたんだけど、パスをとおしてなかったんで警告がでてました。 とりあえずは 、環境変数に指定して、SSL 証明書の検証なしの設定にしておきました。

WordPress で設定などみたいたところ、Akismet のところで、有効期限切れといったアラートがでていました。

再度登録するのですが、実際のところは WordPress.com でサインインして、再び選びなおし(自分の場合はフリーのプラン。スライダーを左のほうにもっていくと課金が0になる)。

新しい API キーが発行されるとおもっていましたが、前に使用したものでした。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2015年9月)

今月(2015年9月)、サイトのカスタマイズを記録したページです

  • ダッシュボードウィジェットに今日のアクセス記事とページビューを表示するウィジェットを作成した

PHPで Analytics のデータを処理できるようになったので、Movable Type 管理画面に入った当日のアクセスの多い記事のリストを表示させるダッシュボードウィジェットを作成してみました。

これで、サイト情報のウィジェットとあわせれば、ちょっとした情報をみたいとき、Analytics にいくことなくチェックできる、ということになりました。

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2015年8月)

今月(2015年8月)、サイトのカスタマイズを記録したページです

  • Movable Typeのテンプレートタグのリファレンスリンクを補助するボタンで、リンク先を正規のURLに変更
  • Google Analytics からのアクセスランキング表示の取得をPHPにした
  • ダッシュボードにAnalytics でのリアルタイム訪問者数のウィジェットをいれた
  • 拡張子が.php などのカスタムインデックステンプレート編集で CodeMirrorが適用できるようにした

Analytics データのPHPでの取得方法は、以下のページを参照しましした。

ほとんどチュートリアルに沿っておこなうだけでした。要点だけまとめます。

  • API コンソールのクライアントIDの作成のところで、「サービスアカウント」を選択します
  • 秘密キーファイルがダウンロードされます。サーバーにアップロードして認証のときにつかいます
  • アナリティクスで、ユーザー管理にて、クライアントのユーザを追加します
  • 前掲のページにあるような取得データを表示するページをPHPで作成します(MTで管理する場合は、公開プロファイルは手動としておきます
  • そのページ内で $array = json_decode($json,true); とかして、JSONパースしてHTML出力になるようにしておきます
  • ブログテンプレートのインクルードでランキングページを取り込むようにします
  • Ranking.php は表示に若干時間かかるので、Cache Lite使うなどしてキャッシュさせておきます

Analytics API のリアルタイムの取得には以下を参考にしました。

出力用のPHPを用意して、JSONを読み取るダッシュボードウィジェットを作成するだけです。

編集の シンタックスハイライトのやりかたは以下にメモしてあります

realtime-active-user-widget.jpg

今月のカスタマイズは以上です。バックナンバーは以下です。

今月のいらんことしい(2015年7月)

今月(2015年7月)、サイトでカスタマイズした箇所をまとめたエントリです。

  • RSD (Really Simple Discovery)テンプレートへのリンクをHTMLヘッダから削除した
  • labs.markdiary.com の管理をMTOSから、個人無償版のほうへ移動した
  • スマートフォン向けページでページ上部のサイト内検索などをClose するボタンをつけた
  • 記事ページのTrackback表示に overflow : hidden をつけた

rsd.xml は、外部ツールへAPIの場所を伝えるものなのですが、実質使用していないこと、Data APIを使用したツールを使うと必要がないという理由から、link要素によるオートディスカバリーを削除することにしました。

MTOS の 製品ライフサイクルが 2015年9月30日をもって終了となることから、 MTOSで運用していた maRk labをこっちのほうに移動するとしました。

リポジトリのほうは存在するようですが、今後セキュリティパッチが提供されなくなることから、移行を検討せざるを得なくなりました。

ライセンス上から、ブログのバックアップ復元のためのアップグレードインストールができないので、記事をエクスポートして取り込むという方法で移動させました。

幸いなことに、記事数が少なかったので確認にそれ程手間はかかりませんでした。

テーマは、これを期にレスポンシブにも対応している、mt.Vicuna の HTML5 版を使ってみました。

おおまかな移行手順を書きます。

  • あらかじめ、 labs.markdiary.com/ 以下のバックアップをとる ( cp コマンドだとプロセスkillになるんで、サーバー提供のコピーツールを使いました )
  • 記事のエクスポートからブログの記事のエクスポートファイルをダウンロード
  • 先述のmt.Vicuna の HTML5 版のテーマを /themes/ にいれておく (ウェブサイトとして作成するときに、mt-static/以下に入れると選択ができないため)
  • 「ウェブサイトの作成」で新規ウェブサイトを作る
  • ウェブサイトURL(サブドメイン使用) http://labs.markdiary.com/
  • ウェブサイトパス /var/www/html/labs.markdiary.com
  • アーカイブをウェブサイトパスとは別のパスで公開する (以下上記のように任意のURLとパスを指定)
  • 記事のインポートで先ほどのエクスポートファイルを取り込む
  • 再構築前に、テンプレートをプレビューを使いながら編集
  • 状態の良いテンプレートから随時再構築していく

といった感じです。/blog/ ディレクトリを持たないサブドメイン型ブログ(サイト)ですので、そのままウェブサイトにブログを作らないで、そのまま記事を取り込んでいます(ウェブサイト下でブログ作成したものを、ブログURLをサイトトップにあげて作ると ブログID(blog_id)の1つが余計になってしまうので)。

Close ボタンは、mt.js 内に mtHide() があるので、これを onclick 属性に仕込んでおけば、jQuery を使わなくても簡単に特定要素の非表示ができます。

<div id="hideElem">text</div>
<div class="btn" onclick="mtHide('hideElem');">×</div>

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2015年6月)

今月(2015年6月)、サイトのカスタマイズした点をまとめたエントリです。

  • AccessRankingGA プラグインを、Google OAuth 2.0に対応できるように修正した
  • AccessRankingGA テンプレートタグの出力するページ(.json ファイル)の再構築方法を変更した
  • カテゴリー mt4 をサイドバーで表示しない
  • カテゴリー mt6 を新設
  • Trackback のCGI へポストに関する.htaccessの設定みなおし
  • 利用していないプラグインを plaginsディレクトリから削除

OAuth 対応は、以下に詳細ページを用意しました

特定カテゴリーのリストからの除外は、運用のしやすさから、カテゴリラベルでフィルターをかけるのが一般ですが、カテゴリーIDで指定すれば、あとからのラベル変更でも一意なものとして機能します。

mt4カテゴリーは、バージョン4は製品ライフサイクル終了からだいぶたっているので、カテゴリーリストから除外するとしました。

以下はカテゴリーID 1をリストから除外する例

<MTTopLevelCategories>
<mt:Unless tag="CategoryID" eq="1">
...
</mt:Unless>
</MTTopLevelCategories>

mt6のカテゴリーを追加しました。今のところ、タグにmt6を付けてあるものにカテゴリーを与えましたが、徐々に設定していく予定。

先日、以下の記事にて再構築ツールを紹介しましたが、

これにより、対象のファイルを MovableTypeのrun-periodic-task スクリプトから切り離してcron 実行できるようになりました。

AccessRankingGA(のテンプレートタグが生成するファイル) は www-rebuilder経由の再構築にするので、テンプレートの再構築オプションでは「手動」にしておきました。

具体的にプラグイン名は挙げませんが、不要となったプラグイン(長い間使ってなくかつ無効としていたもの・コア機能として統合されているものなど)を削除しました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

Feedly 購読者数の取得 2015年6月版

  • Posted by: maRk
  • myown | net
  • はてなブックマークに追加

Yahoo Pipes およびYQL経由でAjax による、Feedly の購読者数の取得が出来なくなったため、改修をおこないました。そのメモです。

これまで、以下のページにあるような方法で取得していたのですが、いつからか不明ですが、取得できないようになっていました。

先般、 Yahoo Pipes のほうで、Pipesの終了に向けてのアナウンスがありました。

とりあえず、このまま使っていても進展しないようなので、別の方法で取得するようにしました。

PHPによる取得

PHPの file_get_contents ファイルシステム関数を利用すれば、APIの返すソースを得ることができます。

基本的なものは以下のようなかんじに。

<?php
    $url = "http://example.com/feed/";     // 対象URL
    $json = @file_get_contents("http://cloud.feedly.com/v3/feeds/feed%2F".rawurlencode($url));    // データ取得
    $feedId = json_decode($json, true);    // JSONをデコードし配列へ
    $count = isset($feedId['subscribers']) ? $feedId['subscribers'] : 0;    // isset()で内容を調べ $count へ代入。登録されてないときは 0
    print  $count;

参考:

ウチのとこみたいに増減がほとんどないようなら、キャッシュいれたほうが、あちらのサーバーにはやさしいとおもいます(使ってるページ自体がアスセス少ないとか言わない)。

PEAR の Cache_Lite パッケージを用いた例です。

都合で、コメントに説明をいれています。

<?php
    header("Content-Type: text/html; charset=UTF-8");   // text/plain でもいいような気もするけどとりあえず

    // チェックURL
    $url = "http://example.com/feed/";    // フィードURL

    require_once "Cache/Lite.php";    // Cache_Lite 呼び出し

    // キャッシュオプション

    $cacheOptions = array(
        'cacheDir' => '/var/www/tmp/cache/',  // キャッシュディレクトリを指定。適切なパーミッションをセットしておく
        'lifeTime' => '3600', //  キャッシュ期限  (1時間) 
    );

    // キャッシュID と キャッシュオブジェクト生成
    $id = "feedlysubscribers";
    $Cache_Lite = new Cache_Lite($cacheOptions);

    // データ取得
    if($count = $Cache_Lite->get($id)){  // 
        echo $count;
    } else {

        // キャッシュがないときに、フィード購読者数の取得にいく

        $json = @file_get_contents("http://cloud.feedly.com/v3/feeds/feed%2F". rawurlencode($url));
        $feedId = json_decode($json, true);
        $count = isset($feedId['subscribers']) ? $feedId['subscribers']: 0;

        echo $count;
    //  キャッシュ登録でこの条件が真になるようにする
        $Cache_Lite->save($count, $id);
    }

参考:

これを、 subs_count.php とでもして、サイトのどこかに置きます。

で、取り出す側は jQuery でテキストファイル読み込みなんかを使っていきます。

jQuery本体の呼び出しは済ませてあるものとします。

ファイル呼び出し

表示ページが PHP なときは、include するとかでいいかと。 以下は、jQueryで先ほどのPHPファイルを取り込みます。

テンプレート上の購読者数表示する場所に以下の要素をいれておきます。

<div id="feedly_subscribers"></div>

複数あるようなときは、class属性にしておき、以下の読み込むときのセレクターもそれにあうようにしておきます。

単に読むだけなので、.load() にしてますが、各種処理が必要な場合は .ajax() のほうにします。

<script>
$(document).ready(function (){
  $("#feedly_subscribers").load("//path/to/subs_count.php");
});
</script>

今月のいらんことしい(2015年5月)

今月(2015年5月)、ブログでカスタマイズした箇所をまとめたエントリです。

  • LDR Pocket をスマートフォン表示時に表示されるようにした
  • ウェブマスターツールの名称変更があったので、過去記事にその旨を追記した

以下のページを参照しました。

※ご注意:LDR Pocketはスマートフォン向けサービスのため、「LDR Pocket に登録するボタン」もスマートフォン向けページに掲載いただくようお願いいたします。

Google ウェブマスターツールのGoogle Search Console への名称変更は、2015/5/20 付け記事により告知されています。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

Perl Istack sp ptr 関係のエラー

  • Posted by: maRk
  • mt6 | myown
  • はてなブックマークに追加

ローカル環境の Perl にエラーが出て困っていたのでメモしておきます。

perl のエラーで Movable Type 管理画面が表示されないため、ログをみたところ、以下のようなものが記録されていた。

dyld: lazy symbol binding failed: Symbol not found: _Perl_Istack_sp_ptr, referer: http://localhost/MT6X/
Referenced from: $HOME/perl5/lib/perl5/darwin-thread-multi-2level/auto/Imager/Imager.bundle, referer: http://localhost/MT606/
[Fri Apr 17 23:52:21 2015] [error] [client ::1] Expected in: flat namespace, referer: http://localhost/MT6X/

(ユーザーのフォルダは $HOMEで置き換えてます。MTのフォルダ実際ははバージョンごとの任意の名称。どのバージョンの管理画面でもエラーで止まります)

macports を selfupdate した後、perl5 を upgrade このときに $ which perl でパスがなくなったので、インストールしなおし。 というところまでが、現象前での作業。

この Imager は、ユーザーのフォルダのほうに入れているものです。

いろいろ試したのですが効果のあったものだけ記しておきます。検索すると、環境変数を設定してあげる、というものなどあるのですが、環境変数の設定では改善されませんでした。

.bundle のつくバンドルがこの問題に該当するようで、これらを@INCの外に退避させると、管理画面が表示されるようになりました。

根本的な原因と正確な対処法は今のところ不明です。

なお Imager は、cpanm で入れた Imager を一旦削除 (App-pmuninstall 使用) してから、cpan のほうでインストールしなおしで使えるようになりました。

今月のいらんことしい(2015年4月)

今月(2015年4月)、サイトでカスタマイズした点をまとめたエントリです。

  • サイトルートのみ、Analytics トラッキングコードを外した
  • FCブログ閉鎖にともない、過去記事からリンクを外すなど
  • Movable Type を 6.1.1 へアップデート

昨年より一部話題になっていた、Google Analytics でのリファラスパムの件ですが、スパムが後を絶たないため、トップページだけ外すということにしました。

これに至る理由は

  • 対策に時間をとられるのはばかばかしい
  • ランディングページでトップページは極端に少ない

ということからです。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2015年3月)

今月(2015年3月)、ブログのカスタマイズした点をまとめたエントリです。

  • シングルカラムのページに Media Queries と viewport を指定した
  • MTInclude タグのモジュールテンプレート階層化の見直し
  • 「ブローク」サービスはとっくに終了していたので、サイドバーから削除。ShortNoteプロフィールリンクを追加
  • PHPのバージョンを、ここと tsuredurebox.geo.jp とでサーバー管理画面の設定よりバージョンアップ
  • Vicuna CMS のサイトへのリンクを解除
  • Actionstreams テンプレートに noindex, nofollow METAタグを付与

Movable Type 6.0.4 より、PHP 5.5 への対応が済んでいるのがわかったので使用するPHPのバージョンをあげました。CoreServer では管理画面のPHP設定の項目からドメインごとで切り替えることができました。

Vicuna CMS および、 mt.Vicuna へのリンクは、リンク先が存在しなくなり、別の第三者がドメイン取得されているようなので、この時点でリンクウェア(造語)としての意味を持たなくなったということで、リンクを解除ということで対応しました。

ちなみに、Movable Type向けテンプレートは、 HashiM氏により、mt.Vicuna HTML5 theme として管理されているようです。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2015年2月)

今月(2015年2月)、ブログでカスタマイズした箇所をまとめたエントリです。

  • カスタマイズ記録(今月のいらんことしい、バックナンバー)ページでテンプレートタグでやっていたのを、DATA APIで読み込むように変更
  • Fancybox の JS、CSS 等更新
  • ブログの一部記事、oEmbed 配信に対応
  • HTTP ヘッダ X-UA-Compatible: chrome=1 削除してなかったページを更新
  • Movable Type用DataAPI Disablerプラグイン 導入でDATA API 使用ブログを制限(6.1導入後削除)
  • Movable Type のバージョンを6.1に、MTOSバージョンを5.2.12へ
  • Action Streams 更新フィードで、title要素 に二重引用符(エンコードしたもの含む)があると、パースできないケースがあったので削除するように置換した

Movable Type DATA API を使ってみることにしました。

使用箇所は、カスタマイズ記録ページのリスト表示と、oEmbed プロバイダ用のAPI

oEmbed については、以下が詳しいです。

以下に実際の動作をまとめておきました。対応するエディタで記事URLをペーストすると読み込みにいってrich形式でかえします。

Movable Type|MTOS のバージョンアップをおこないました。

<mt:ActionStreams replace="&quot","" replace="&#34;","">

(なぜか、regex_replaceで複数指定するとうまくいかなかった)

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2015年1月)

今月(2015年1月)、今年最初のブログのカスタマイズした箇所をまとめたエントリです。

  • コード掲載ページに SyntaxHighlighter を導入
  • XML-RPC cgiの実行権限を解除
  • サイトのルートへの Analytics スニペットを出力しないようにした
  • 個別記事ページにもアクセスランキングを表示するようにした
  • サイトトップのトラッキングスニペットのカスタマイズ

記事内にコードのある場合に SyntaxHighlighter による表示になるようにしました。

カスタムフィールドに以下のように設定

システムオブジェクト
  記事
名前
  SyntaxHighlighter
説明
  SyntaxHighlighterを使用する
種類
  チェックボックス
オプション
  なし
必須
  チェックを外す
規定値
  SyntaxHighlighterを使用する
ベースネーム
  cfsyntaxhighlighter
テンプレートタグ
  cfSyntaxHighlighter

作成された、mt:cfSyntaxHighlighter タグを使って、テンプレートに SyntaxHighlighter (ver.3系)を読み込むように組みます。

<mt:If tag="cfSyntaxHighlighter">
SyntaxHighlighter を呼び出すコードを入れる。
</mt:If>

スクリプト部分は、フッター側に、スタイルシートは、head要素内に設置しています。

カスタマイズしたサイトトップのGoogle Analytics コードは、ShortNote に記載したとおりです。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2014年12月)

今月(2014年12月)、今年最後のブログのカスタマイズした箇所をまとめたエントリです。

  • Action streams ブログテーマをセットしなおしした
  • 一部ページに、テンプレートの種類を示す、data-page-type属性を付与。setvars の設定を可視化するとした
  • フッタの subscribe で livedoor reader の表記を Live Dwango Reader へ書き換え
  • Movable Type バージョンアップ。6.0.6 および、MTOS 5.2.11
  • トラックバックのリストのページのマークアップを変更

Movable Type のセキュリティアップデートのアナウンスは以下より。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2014年10月)

今月(2014年10月)、ブログのカスタマイズした箇所を記したエントリです。

  • 記事投稿時Ping送信先でYahoo!ブログ検索を登録から外した
  • Movable Type を 6.0.5 にバージョンアップ

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2014年9月)

今月(2014年9月)、ブログのカスタマイズした箇所を記したエントリです。

  • Movable Type 6.0.4 にアップデートした
  • Blog Ajax 検索専用ページで、form のクエリによるページ読み込みを廃止

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2014年8月)

今月(2014年8月)、ブログのカスタマイズした箇所を記したエントリです。

  • labs にTwitter ウィジェットをいれた

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2014年7月)

今月(2014年7月)、ブログでカスタマイズした箇所をまとめたエントリです。

  • FancyBox プラグインをバージョンアップ
  • CoreServer 、PHP/Apache バージョンアップメンテナンスに伴い、WordPressでのPHPのCGI版による動作を解除

FancyBox は以下からダウンロード。

トラブルをさけるために、展開後のフォルダ階層をオリジナルと同じにしてアップロードします。

FancyBox 用のモジュールテンプレートを更新して、FancyBox を適用している記事をフィルタして再構築。

サムネイル(50x50pix)使用する表示のときオーバーレイが真っ黒になるので、デフォルトの状態に修正しました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2014年6月)

今月(2014年6月)、サイトのカスタマイズした箇所をまとめたエントリです。
  • webアーカイブページの公開設定をスタティックから手動へ
  • 上位サイトで META Description を設定
  • Google Chrome frame 用のヘッダ出力を停止した
  • 「あとで読む」ボタン撤去と Pocketボタンの場所を移動
  • Pocketボタンをカテゴリーアーカイブページに設置

テンプレートタグによる、meta Description の方法は以前もやった記憶があるんですが、おさらいとして。

ちなみに、テンプレート向けのカスタムフィールド使えば、もう少し楽に設定出来るかもしれないです。(ローカルがgithubから持ってきた movabletype で動かしてるために、カスタムフィールドが使えないという事情でテンプレートタグによる書き方になってます)

インデックステンプレートでは、こんなかんじで変数セットしておきます

(SetVarsはテンプレートの先頭部分に置きます。改行区切りで複数の変数指定を一括しておこなえますが、ここでは対象のものしか記述しておきません)

<mt:SetVars>
metadesc=hogehoge
</mt:SetVars>

ウェブページ/ブログのエントリーアーカイブテンプレートの SetVars には、以下のようにしておきます。

no_generate モディファイアによって、概要のフィールドが空のとき何も出力しないようにしています。

metadesc=<$mt:EntryExcerpt no_generate="1" remove_html="1"$>

HEAD要素の内容にあたる箇所には以下のようにしておきます。

<mt:if name="metadesc" ne="">
<meta name="description" content="<mt:getvar name="metadesc" remove_html="1">" />
</mt:if>

ウェブページのテンプレートで no_generate を指定しましたので、概要フィールドが空の場合に出力しないという条件が可能となってます。

no_generate指定なしで概要フィールドの有無はこだわらないならば、<mt:if name="metadesc">だけの条件でよくなります。

Chrome Frame for IE は開発が終了していることと、このエージェントによるアクセスがほとんどないためサポートしないことにしました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2014年5月)

今月(2014年5月)、サイトのカスタマイズした箇所をまとめたエントリです。

  • Google Analytics スニペットをglobalのほうに変更した
  • run-periodic-tasks の warning 問題

このブログのほうもグローバルのトラッキングコードに差し替えしました。特に問題となる部分はありません。

クリックイベントトラッキングを analytics へ送る方法がanalytics.js 用に用意されているので、これも差し替えるようにしました。

具体的には、

_gaq.push() メソッドを使用していたのは、ga('send', 'event' ,,, といった形になります。

詳しくは、公式の イベント トラッキング - ウェブ トラッキング(analytics.js) に記載されています。

Movable Type 6 のアップデートしたあとに、cron による処理で Unrecognized escape K passed through の警告がでるようになってきたので、ちょっとツールのほうに手を入れることにしました。

\シーケンスなんですが、以下のドキュメントを参照したところ、Perlバージョン 5.10からの機能とあります。

また、6.0.3 〜 で run-periodic-tasks に修正が加えられた件については以下にて確認できました。

借りているサーバーのバージョンが5.8系のために、これ(\Kによる置換)を使わないようにするか、以前のバージョンに差し戻すかなのですが、ここはとりあえず \K を使わないようにするようにしました。(今の時点で動作検証まではしていません)

追記 2014/05/27:Cron Daemon のエラーメッセージはかえってこなくなったみたい。MITに変わったからコード示さなくてよくなったとおもうんで掲載はしません。推奨環境で運用するのがたぶん正解だと思います。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2014年4月)

今月(2014年4月)、サイトでカスタマイズした点をまとめたエントリです。

本文中の「ウェブマスターツール」ですが、名称変更があり(http://goo.gl/tjQxT4)、Google Search Console となりました。

  • sitemap.xml でフォルダの出力にフィルタ
  • MTOS 5.2.10 、Movable Type 6.0.3 へアップデート

sitemap.xml はGoogle 等に送信するものとして作成していますが、ウェブマスターツールで警告がでるので、問題となるフォルダを出力しないようにしてみました。

対象フォルダが、フォルダメニューの一覧にあることを確認します。

次に、サイトマップテンプレートのMTPagesタグの folder モディファイアに NOT をつけることで、指定フォルダ以外の出力となります。

<MTPages folder="NOT exceptfolder">

前掲ページにおいて、アップデート後の必要な作業として、テンプレートのリフレッシュを行なう、とあります。

当方は同梱テーマではないので、手動による変更をおこないました。その他いくつかの問題が修正されているようです。

メモ書きですが、更新作業の際に、CGIエラーがでてしまいました。

これはCGIへのリソース制限にかかってしまったみたいです。FTPクライアントとターミナルと同時でおこなってたからなのかも。

特にサーバー管理画面からの負荷とかプロセスとかはこちらでは確認ができませんでした。

制限解除までに時間がかかってしまったので、次回気をつけようと思います。

参考:

  • 記事閲覧 (ユーザーフォーラム:CGI/PHP/DB関連 - VALUE-DOMAIN.com)

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

  • 当ブログのカスタマイズ記録

Venue 11 pro 購入

  • Posted by: maRk
  • PC | myown
  • はてなブックマークに追加

DellのタブレットVenue 11 proを買いましたので、そのレポートです

(やったことなど、その都度 Evernote に書き溜めて構成したので、少々読みづらいかもしれません)

XPのサポート終了を受けての購入です。

CPUがアップグレードに対応できなくて Windows 7 すら入れられなかったし、ノートパソコンのヒンジが外れてて、外への持ち出しもかなわない状態だったので。

venue-11-pro-01.jpg

うわさの化粧箱(?)入り。おもっていたよりは、高級感をはなかったような

venue-11-pro-02.jpg

蓋をあけたところです。

venue-11-pro-03.jpg

venue-11-pro-04.jpg

Core i5 4210Y 1.50GHz SSD 128GB メモリ4GB といった構成であります。

dell-keyboard.jpg

キーボードに充電用のケーブルを差してみたところです。 タブレットとドッキング中はタブレット側にケーブルを差すことになるみたい。

追記:正確にいうと、ドッキング時にタブレットに電源接続していて、タブレットのバッテリーが100%であり、キーボードが満充電でない場合は、キーボード側が充電されているという状態になります。

Continue reading

今月のいらんことしい(2014年3月)

今月(2014年3月)、サイトでカスタマイズした点をまとめたエントリです。

本文中の「ウェブマスターツール」ですが、名称変更があり(http://goo.gl/tjQxT4)、Google Search Console となりました。

  • ブログの microformats 見直し

microformats は vicuna テンプレートには microformats のサポートはありましたが、完全でないらしく、Google ウェブマスターツールの構造化テストツールでみるとエラーがおこっていました。

具体的には、author 、updated がないというものです。

これらの対処として、last updated の記述もメタ情報のラインに含めるようにしました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

Google Analyticsの検索クエリレポートのキーワードクラウド表示機能について

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

Analytics のレポートページの検索クエリで、キーワードをクラウド表示する機能がありました

ganalytics-keyword-cloud.jpg

検索キーワードからの流入のレポートは、(not provided) が多くなったこともあり、マスターツールズと連携させた上で、「検索エンジン最適化」から確認というのをやっています。

そのレポートの表示方法に、キーワード クラウドといったものがあることをこの前見つけたのでメモしておきます。

(※ 当記事作成時点での確認によるものです。その後の仕様変更により、同じ動作にならない場合があります)

検索エンジン最適化のメニュー下の検索クエリというレポートを出しておきます。

上に示したキャプチャで四角に囲ったボタンが、キーワード クラウド(日本語表示の場合、ツールチップにでてくる)です。

切り替えると、文字通りのクラウド表示です。印象としては、注目するキーワードが視覚的にわかりやすいように見えます。

現時点では、ドロップダウンメニューで、表示回数、クリック数、平均掲載順位、CTR という項目で切り替えすることができるようになっていました。

今月のいらんことしい(2014年2月)

今月(2014年2月)、サイトでカスタマイズした点をまとめたエントリです。

  • はてなブログのAction Streams (プロフィール)の追加
  • labs のほうで Google Analytics のユニバーサルのほうに切り替えした

Action Streams は最近触ってなかったので登録のしかたも忘れていたりしますが、はてなブログのフィードは Atom のほう (*/feed)を設定ファイルには典型的なAtom feed なので atom : 1 を記述しておけばいいです。

Analytics のユニバーサルの件は、設定のトラッキング情報で、トラッキングコードがユニバーサルに切り替わってましたので、そのまま以前の非同期のコードと全て差し替えるだけで利用可能のようでした(この時点公開時点ではまだこのブログサイト内では以前のトラッキングコードです)。

イベントトラッキングについて、特定の要素にイベント付与する方法がこれまでと違うので下記を参考に直しました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2014年1月)

今月(2014年1月)、サイトでカスタマイズした点をまとめたエントリです。

  • Movable Type 6.0.2 へアップデート

ver. 6 で見つかったいくつかの問題の修正版で、セキュリティに関するものは含まれていないとのことです。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

メモ:Firefox の開発ツールでCookie の確認・編集

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

Firefox で現在のページのCookie の確認をしたかったので、方法をメモしておきます。

追記: Firefox Quantum において、下記方法では、「unsafe CPOW usage forbidden」により確認できません。(https://developer.mozilla.org/en-US/Firefox/Multiprocess_Firefox/Cross_Process_Object_Wrappers) 単にCookie を見るだけでしたら、「ページ情報」の、「セキュリティ」タブを使用します。

今までは、ページの情報から、セキュリティタブのプライバシーと履歴のところからCookieの表示をおこなっていたんですが、開発ツールからできないものかと探していましたところ、 cookie list というコマンドがみつかりました。

操作は任意のページを開き、開発ツールを表示してから、 cookie listと打ち込んでenter/return です(補完があるので、途中まで入力してtabキー/ returnでもokです)。

firefox-tools-cookie01.jpg

cookie が存在する場合は以下になります。

firefox-tools-cookie02.jpg

削除したい場合、 削除の文字をクリック、開発ツールバーのところで enter / return。

今月のいらんことしい(2013年12月)

今月(2013年12月)、サイトでカスタマイズした点をまとめたエントリ。2013年最後の回です。

  • WPTouch プラグインを完全に削除
  • WordPress を 3.8 アップデート

3.8でWordPress 管理画面がレスポンシブになり、スマートフォンなどからの見やすさが向上しているようです。

さて、今年の振り返りとして、これまでのまとめからピックアップしてみようとおもいます。

2月

  • Movable Type を4.x から 5.x にアップグレード
  • Tag archive ページにて、記事内に画像のあるときサムネイル表示

3月

  • MT-Akismet プラグイン をMTOS 5に

(ちなみに、このブログでも入れてあります)

5月

  • sitemap.xml のカスタムインデックステンプレートの作成
  • AccessRankingGA を導入

6月

  • トラックバックの受け入れを開始

7月

  • Bing Web マスターツール利用開始、登録

10月

  • Movable Type 6.0 および Movable Type 5.2.8 へアップデート
  • Movable Type 6.0の新機能、Google Analytics 連携を設定

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2013年11月)

今月(2013年11月)、サイトのカスタマイズした点をまとめたエントリです。

  • Movable Type  6.0.1 および、MTOS 5.2.9 にアップデート

[重要] 6.0.1、5.2.9 セキュリティアップデートの提供を開始 | Movable Type

(全くカスタマイズと違う内容になってしまいましたが)ちなみに www.movabletype.jp 上の Movable Type ダウンロードバナーのリンク先は、個人無償版ダウンロードのページとなっていました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2013年10月)

今月(2013年10月)、ブログのカスタマイズした点をまとめたエントリです。

  • mt.js の非同期ロード
  • Movable Type 6.0 および Movable Type 5.2.8 へアップデート
  • Movable Type 6.0の新機能、Google Analytics 連携を設定
  • Google Analytics 連携の関係で同名のプラグインが使えないのでプラグイン名から全部修正
  • Movable Type ロゴマークの入れ替え

なお、mt.js は cookie などログイン認証、コメントに関わるものがはいっていますので、(自分はコメントを外部のサーヴィスでおこなってますけれども)これを行なったことにより、一部機能に上手く動作しないかもしれません。

<script>
(function(){
  var mtjs, d=document, node;
  mtjs = d.createElement('script');
  mtjs.src = '<$mt:Link template="javascript"$>';
  mtjs.type = 'text/javascript';
  node = d.getElementsByTagName('script')[0];
  node.parentNode.insertBefore(mtjs, node);
})();
</script>

Movable Type 6 (v6.0) は2013年10月17日(日本時間) より出荷開始されました。これとともに、5.2.8、5.16 セキュリティアップデートも提供されています。

6.0 はセキュリティアップデートも含まれているということでアップデートすることにしました。

Google Analytics 連携機能 は少し説明がややこしいのでリンクにて。以下に SixApart によるドキュメントがあります。

(※ 今の時点で Google APIs Console にアクセスすると、Cloud Console を試すアラートがでていますが、上記ページでは、これまでのコンソールの画面での説明になっています)

Google Analytics 連携はプラグインとしての同梱でしたので、同名の plugin が働かないため、手持ちのもの(配布してない)をプラグイン名、id、key、提供するタグ名のすべてを変更しました。

Google Analytics連携の設定が済むと、サイト情報ウィジェットで、日ごとのアクセス数が表示できるようになります。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2013年 9月)

今月(2013年 9月)、サイトでカスタマイズした箇所をまとめたエントリです。

  • テンプレートのシャドウの撤去および背景画像の削除
  • 見出し要素の背景画像の削除

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2013年 8月)

今月(2013年 8月)、サイトでカスタマイズした箇所をまとめたエントリです。

  • Vicuna テンプレートのCSSリセットを YUI 3.11.0
  • Status ページを更新(Feedly 購読者数取得)
  • sitemap.xml に 画像URL

Feedly の購読者数取得は、サイトのFeedly購読者数を確認するためのブックマークレット | 代助のブログ にてまとめられていました。

YQL(Yahoo! Query Language)を利用することでJSONPより得られるとのことです。

従って、Feedly の購読者数取得は以下のようになりました( use jQuery)。

<div id="feedly_subscribers"></div>
$(document).ready(function (){
  var feedly = "http://cloud.feedly.com/v3/feeds/feed%2F";
  var rss = "http://www.markdiary.com/blog/atom.xml";
  var target =feedly + encodeURIComponent(rss);
  var yql = 'http://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent('select * from json where url="' + target + '"') + '&format=json&callback=?';
$.getJSON( yql, function(data){
  $("#feedly_subscribers").append("<p>" + data.query.results.json['subscribers'] + "</p>");
  })
});

sitemap.xml についてですが、Google ウェブマスターツール のヘルプページ(https://support.google.com/webmasters/answer/183668)には、画像・動画が1つあるページの例としてサンプルが公開されていました。

image:image 要素を追加するには、まず、名前空間を urlset に追加してあげます。( xmlns:image="http://www.google.com/schemas/sitemap-image/1.1")

image:image 要素は、url 要素下に入れることになっています。

以下は、ウェブページの部分を抜粋してみたものです。(提示用のインデントですので、そのままコピーで使用すると、他の要素のインデントとあわなくなります)

<MTIfArchiveTypeEnabled archive_type="Page"><MTPages lastn="0">
  <url>
    <loc><$MTPagePermalink encode_xml="1"$></loc>
    <lastmod><$MTPageModifiedDate format="%Y-%m-%dT%H:%M:%S"$><$MTBlogTimezone$></lastmod>

<!-- 以下が追加する部分 -->
<mt:EntryAssets type="image" lastn="1">
    <image:image>
      <image:loc><mt:AssetURL></image:loc>
    </image:image>
</mt:EntryAssets>
<!-- 追加ここまで -->
  </url>
</MTPages>
</MTIfArchiveTypeEnabled>

エントリー内で、アイテムとして挿入した以外のメディアファイルのURLを得るのに、該当部分を正規表現とかで抽出しないといけなくなるので、諦めて上のようなものに落ち着きました(MTElse で細工とかできるんだけど、エントリーに置いてないような画像URLを送信しても仕方ないので)。

完成したら、ウェブマスターツールにいって、サイトマップのところで、「サイトマップの追加/テスト」より、生成されたサイトマップテンプレートをテストしてエラーがでていないことを確認しておきます(ここで、サイトマップ自体送信することが可能ですが、自分はチェックのみしかおこなっていません)。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2013年 7月)

今月(2013年 7月)、カスタマイズした点をまとめたエントリです。

  • テンプレートのインデントを変更した
  • Movable Type を 5.2.7 へアップデート
  • MTCanonicalLink を採用
  • X-Content-Type-Options: nosniff 付与
  • Feedly 登録ページへのリンクを追加
  • About ページの更新
  • Bing Web マスターツール利用開始、登録
  • Movable Type に関する過去の Tips系記事を未公開にした
  • つれづれぼっくす(tsuredurebox.geo.jp)でVoxプログ時代にクロスポストを行なっていた記事を削除した
  • YouTube アカウントを切り替えしたので、アップロード動画へのリンク先を変更されたものと差し替え

Movable Type は、5.2.6 よりスマートフォンオプションが同梱(※ Movable Type Professional , Movable Type Advanced が対象)されることになりましたので、アップデートすることにしました(主にスマートフォン等からの管理画面が影響します)。

インデントは vicuna デフォルトでタブ文字を採用していたものでしたが、半角スペースへと変更をしました(基本としては半角スペース2くらい(?)のつもり。テンプレートがごちゃごちゃしてきたのでうまくいっていない部分もあったりします)。

Google リーダーが終了となりましたので、 Feedly へ登録するページへのリンクをフッターに追加しました。

Feedly ボタン作成ページ(http://www.feedly.com/factory.html)を参考にすると、テキストリンクでも出来ることが分かりました。

MT関連記事の未公開(表面上は削除)ですが、何処かからの削除要請があったわけでなくて自主的なものです。

今後も内容など検討した上、削除を決定する記事があるとおもいます。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2013年 6月)

今月(2013年 6月)、カスタマイズした点をまとめたエントリです。

  • 不要になったCSS セレクターの削除
  • サイト内検索ボックスを撤去(一部アーカイブページは除く)
  • Google Reader への登録リンクを削除
  • 手動公開のテンプレート、更新していないウェブページなどを再構築
  • トラックバックの受け入れを開始した

サイト内検索はあまりにも使われていないということで取り外すことにしました。記事ページ、トップページなどで表示されなくしました。

長らく停止していたトラックバックを受け付けることにしました(ブログ開始当初は設定いれてたのですよ、 設定を確認したページの trackback ID がはじめの番号からスタートしてなかったので)。とはいえ、過去の記事について一括変更はプラグインを使うなどする必要があるのでおこなっていません。トラックバック受信の必要があると判断したら都度設定するようにします(かもしれません)。

参考までに、トラックバック設定のメモとして、以下に書いてます。

http://tsuredurebox.geo.jp/post/mtos-trackback-customize/

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

Firefox でよく使っているショートカットキーまとめ

  • Posted by: maRk
  • PC | myown
  • はてなブックマークに追加

自分がよく使うショートカットキーをまとめというかメモとしておいておきます。

Firefox のヴァージョンは今の時点は 21.0 (for Mac)

ただし、キーの組み合わせは既に体得しているという前提で掲載はしませんので。

  • Firefox を終了
  • アドオンマネージャ
  • (アクティブの)タブを閉じる
  • 新規タブ
  • 環境設定
  • 検索
  • アドオンバー トグル
  • 開発ツールバー トグル
  • はてなブックマークFirefox拡張の「はてなブックマークに追加」

それほど多くは使っていません(覚えきれない)。ほかの操作はマウスジェスチャー(アドオン導入済)と組み合わせという形です。

最後に、ショートカットキーをカスタマイズするアドオンを紹介しておきます。導入すると、環境設定のパネルに Shortcuts のタブが追加されキーの登録が可能になります(デフォルトを変更できるので、この記事でキーを示さなかった理由だったりします)。

今月のいらんことしい(2013年 5月)

今月(2013年 5月)、カスタマイズした点をまとめたエントリです。

  • 404 ページの作り直し
  • sitemap.xml のカスタムインデックステンプレートの作成
  • AccessRankingGA を導入してみた
  • HTML5 なテンプレートで html5.jpでなく、 html5shiv.js のほうを使用するように変更
  • Pocket ボタンを置いてみた
  • MyBlogLogのメタタグの撤去
  • labs.markdiary.com のMTOS をv5.2 から v5.2.3 にアップデート

404 エラーページですが、Movable Type 5.2 への切り替えでトップページの階層も管理できるようになっため、そのようにテンプレートを作り直ししました。

この場合のテンプレートですが、ウェブサイトのカスタムインデックスのほうで作成しました。ウェブページアーカイブのほうで作成すると、アーカイブ系でループさせようとすると、除外しないといけないようなことがあるなど扱いに面倒であると判断したものによります。

sitemap.xml も同様にしてインデックステンプレートで作成しています。

AccessRankingGA は、Google Analytics のAPI経由でレポート情報を得てランキングとして表示するMovable Type用プラグインです。

WEBデザイン BLOG の @cool_ni_ikou さんより提供されています。(https://github.com/coolniikou/mt-plugin-AccessRankingGA

とりあえず気をつけたい点として以下の項目をあげておきます。

  • プラグイン設定の プロファイル ID というのは、特定のプロパティ下に作られているプロファイルのIDであるということで、Google Analytics トラッキングコードを設置するときのものとは違うということ
  • Google アカウントの 2段階認証プロセスを利用している場合、アプリケーション固有のパスワードを使う。ローカルでテストする場合もローカル用でアプリケーション固有パスワードを生成しておくということ

本来ならば、jQuery などでJSONファイルを扱うのですが、敢えてPHPにて JSON 処理をしています。

Pocket ボタンは、特定の要素を見つけてはdata-* 属性を追加する形での設置です。要するに、HTML5採用していれば特に必要のない処理です。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

メモ:phpMyAdminでプロパティアイコンの表示を設定する

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

phpMyAdminの操作などのアイコン表示されている部分の表示方法のコンフィギュレーションについてのメモ

Coreserver.jp のデータベースの管理ページからphpMyAdminを自動インストールしたあと、アイコンと説明の文字が表示される状態になっていました

phpmyadmin-config-PropertiesIconic01.jpg

このままでもいいのですが、横にスペースをとるのでウィンドウサイズを広げないと横スクロールが発生して少し使いにくくなります。

これを下のようにしたい、というときの設定です。

phpmyadmin-config-PropertiesIconic02.jpg

まず、config.inc.php をエディタで開きます。

以下の設定を追記あるいは、変更します。

// Tabs display settings
$cfg['PropertiesIconic']      = TRUE;

コメントの部分を転載しますと、

// Use icons instead of text for the table display of a database (TRUE|FALSE|'both')

ドキュメント(Documentation.html#config [ phpmyadmin 配下にあるHTMLドキュメント ])より

$cfg['PropertiesIconic'] stringIf set to TRUE, will display icons instead of text for db and table properties links (like 'Browse', 'Select', 'Insert', ...).

Can be set to 'both' if you want icons AND text.

When set to FALSE, will only show text.

まとめますと

  • TRUE アイコン表示
  • FALSE テキストのみ
  • both アイコン + テキスト

確認したヴァージョンは、3.5.1 、3.5.2。 以上です。

今月のいらんことしい(2013年 4月)

今月(2013年 4月)、カスタマイズした点をまとめたエントリです。

  • Atom feed に LINEで送る のリンクを追加
  • FOAF とXSLT を Movable Type で作成上書き
  • Disqus コメントのコメント数表示を、メインインデックス・アーカイブページに導入
  • ActionStreams プラグインのプロフィールイベントリスト、利用サービスリストのテンプレート修正とCSSを5.x 用に修正
  • ウェブページにTwitterボタン のリンク共有ボタンを設置した

LINE で送るリンクの設置方法については、以下のページを参照しました。

なお、ガイドラインの、 4. 利用条件の(2)(* 便宜上の番号です。規約改訂で変更の場合もありうるという意味です) では、「専用アイコン」の利用の命令がなされていますが、設置者が専用アイコンの代わりに、「LINEで送る」「LINE」というテキスト文字の利用が許可されています。

以上ふまえて、テキスト形式にて、フィードにLINEで送るというリンクを設置いたしました。

オワコン[感]?な FOAF (Friend of a Friend)ですが、しばらく放置してたので更新してみることにしました。

Movable Type が様々な形式のファイルを出力するツールであることを知ってる人は知っているとおもうのですが、 rdf XSL も出力できます。XSLTスタイルシートは以前に使ったものをそのままで、Generator がMovable Type になったため、Powered by Movable Type のリンクを出力するように追加しました。

ActionStreams はGitHubから、2.3~ を持ってきたのですけど、5.x 系だと表示されるテーブルがえらい崩れてるので、テンプレートからなおしてみることにしました。この際なのでいっておくと、もう 5.x系用に fork されていてもいいとおもうんですよね。。

自分の修正点の覚えとして簡略したもので示しておきます(細かく書いてもいいのだけど雑多になるし)。主に Firefox で使っている状態にあわせているので、他のブラウザではどうなっているかまでは分かりませんのであしからず。

スタイルシート action-streams.css

position: static; は無効にしておかないと、リンクをクリック出来ない箇所がでてくるのでコメントにしてしおく。

list_profileevent.tmpl で、table 要素の部分

  • button 要素に class => button ( 5.xのスタイルに合わせる必要がなければそのままで )
  • チェックボックスのところは class => cb col
  • th 要素に class => col head
  • th.primary-col は th.primary へ変更する

fixed_style_actionstreams.jpg

Twitterボタンはdata-* をdata-* をもたない文書型向けに改造。

Twitterボタンは、 Twitter / Twitterボタン から作成。

ボタン部は id 付与のため以下に。

<div id="tweetbtn_" style="display:inline;"><a href="https://twitter.com/share" class="twitter-share-button">Tweet</a></div>

スクリプト本体が読み込まれる前に、data-* を追加する。

<script type="text/javascript">
  void function(){var twID = document.getElementById("tweetbtn_")||false;
  if(!twID){return;}else{
  // ボタンのコード中の、data-* の内容をsetAttribute に置き換え
  twID.firstChild.setAttribute("data-url","<$mt:PagePermalink$>"); // ページのパーマリンク。URL統一のため
  twID.firstChild.setAttribute("data-size","large");  // ボタンサイズを大で選んだとき
  twID.firstChild.setAttribute("data-dnt","true");  // カスタマイズされたTwitterからのオプトアウトを true にしたとき 
  }
}();
</script>

bodyの終了タグ前付近にスクリプト本体をそのままで。

<script type="text/javascript">!function(d,s,id){...省略...</script>
</body>

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

Firefoxの開発ツールバーの export に関して

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

Firefox開発ツールバーのコマンドの export html は、ページのHTMLのスナップを別タブで表示できます。

※この記事では、 Firefox 20.0 ( for Mac) での動作をもとに書いています。

New Firefox Command Line helps you develop faster Mozilla Hacks - the Web developer blog の説明より

The "export html" command opens a new tab with an HTML snapshot of the current state of the page.

help-export-firefox.jpg

Ajax feed サンプルのような動的ページのスナップでソースを確認するなどのときにいいのかもしれません。

対象とするページを開いた状態で、開発ツールバーを表示して ( 自分はCustomizable Shortcutsというアドオンをいれてショートカットで開けるように設定しています )、使用する時は、export html と入力してenter です。

新規タブで、表示されたページのソースがみられます。ロケーションバーにはdata:text/plain;charset=utf8, のあとエンコードされたソースが入る形式のようです。

このページを、command +S(ファイル - 別名でページを保存) で保存することもできます。

export-page-snapshot.jpg

この件とは別に(おまけで)、選択したテキストを新規ページで開くブックマークレットを作ってみました。

おもにWebページ上で提示されたコードをコピーしてファイル保存するのに使うのを目的としています。

置き場

Google Analytics ヘルプページを親ウィンドウで開くリンクを追加するGMスクリプト

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

Google Analytics を使っていて、サポートページが子ウィンドウで開かれて読みにくいとき、親ウィンドウでみるためのリンクを追加するGreasemonkeyスクリプトを作ってみました。

たまに、スクロールが無効になっていて全文表示できずに、不便なページがでることがあるので(Firefox で閲覧時)。

主に左サイドバーのヘルプセンター内のリンクをクリックしたときに、子ウィンドウでの表示になるようです。

適用すると、子ウィンドウの上部に「Open with Parent Window」のリンクがついて、クリックすると親ウィンドウで表示され子ウィンドウは閉じます。

// ==UserScript==
// @name        GA Help Parent Window Open
// @namespace   http://labs.markdiary.com/
// @include     https://support.google.com/analytics/*
// @version     1.0
// @license     MIT License
// ==/UserScript==

setTimeout ( function(){
  var id = document.getElementById("gm_open_parent_window");
  if(window.opener.closed){
    id.parentNode.removeChild(id);
  } else {
    link_();
  }
}, 200);

function link_(){
  var a = document.createElement("a");
  a.id="gm_open_parent_window";
  a.appendChild( document.createTextNode("Open with Parent Window"));
  a.href = "#";
  a.addEventListener( "click", open_ ,false );
  document.body.insertBefore( a, document.body.firstChild );
}

function open_(){
  if(window.opener){
  window.opener.location=location.href;
  window.close();
  }
}
;

repository

今月のいらんことしい(2013年 3月)

今月(2013年 3月)、サイト内でカスタマイズした点をまとめたエントリです。

  • はてなブックマーク、エントリーページへのリンクURL をはてな内と同一のものにした
  • DISQUS コメントのコードをファンクションタグ化
  • MT-Akismet プラグイン をMTOS 5に入れた
  • Mac カテゴリーを追加
  • CMSHead プラグイン導入で モバイル 向けCSSを追記

はてなブックマークのエントリーページのURLについては、 エントリーページの URL 変更について - はてなブックマーク日記 - 機能変更、お知らせなど を参照します。

コメントのあるページへは、はてな側でリダイレクト処理されるのでどちらでもいい話ではあるのですが、出力が調整できるならばこちら側でやってもいいでしょう、という理由ではてな側と URL を合わせることにしました。

方法は、replace="foo","bar" あたりを使い、http://の部分を取り除けばいいのですが、あえてグローバルフィルターにしておこなっています。理由は、xx="foo","bar" の形式のモディファイアの見た感じが好みでないからです。

MT-Akismet(Akismet development - libraries and plugins より入手可能) ですが、labs.markdiary.com においてはトラックバックを受け付ける設定のため使用することにしました。

あまり取りあげられていないようですが、typepad.com で TypePad Anti-Spam をとりやめ、Impermium に変更するといったアナウンスが先月にありました(参照:Retiring Typepad Anti-Spam and Switching to Impermium - Everything Typepad)。

これ以上の情報を入手できていないので、今後の TypePad Anti-Spam について(APIとか)はよくわかりません。キー取得のための、TypePad AntiSpam へのリンクは everything.typepad.com へリダイレクトとなっていることから、新規にAPIキー取得はできないというのが現状です。

さて、MT-Akismet は旧ヴァージョンのころのプラグインであるため、5.x系ではシステムのプラグイン設定ページで警告が表示されます(指示通りに書き換えれば警告は出ないのですが、出ないようにする方法は割愛)。

CMSHeadプラグイン は、小粋空間にて配布されている、head要素内に任意のコードを追記することを可能にするプラグインです。

設定したのは以下のようなものです。

<meta name="viewport" content="width=320">
<style>
@media only screen and (max-device-width: 320px) {
    body{
        font-size:110%;
    }
    .top-menu-link :hover{background-color:yellow;}
    #menu .toggle-button{width: 40px;}
}
</style>

適用後のキャプチャは撮りませんが、左サイドバーメニューをタップしやすくするというものです。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2013年 2月)

今月(2013年 2月)、サイト内の管理上の変更、カスタマイズした点をまとめたエントリです。

  1. Movable Type を4.x から 5.x にアップグレード
  2. MovableType カテゴリーページに Twitter 検索のタイムラインのウィジェット設置
  3. Tag archive ページにて、記事内に画像のあるときサムネイル表示
  4. Hatena Bookmark Button の Retinaディスプレイ対応版が表示できるようにした
  5. Twitter ウィジェットを Join the conversation 表示のものを新しいウィジェットに変更
  6. mt.config の DBSocket を明示的に指定

アップデート関連の記事について

Twitter 検索タイムラインウィジェット作成までの手順は下記のとおりです(*2013年2月時点 仕様変更等で名称など変わるかもしれません)。

  1. Twitter にログインします
  2. Twitter 検索のページで任意の(検索保存ずみでないもの)キーワードをいれます
  3. 結果が表示されたら、ギヤアイコンをクリックして、「この検索をサイトに埋め込む」をクリックします
  4. 使用するドメインに設置するドメインをいれます。複数の場合は,(カンマ)で区切ります
  5. ウィジェットを作成でウェジェット設置のコードが表示されます
  6. 作成後の編集は、Twitter アカウントの設定の項目のウィジェットのところからおこなえます。フォーム内で指定できるものを変更していきます。「変更を保存」で右のプレビューに反映されます。
<mt:CategoryLabel setvar="catLabel"> <mt:Ignore>カテゴリラベルを変数セット</mt:Ignore>
<mt:If name="catLabel" like="使用するページのカテゴリラベル">
<div id="twWidget_time_line">
__ Twitter ウィジェットのスニペット __
</div></mt:If>

記事内に画像のあるやなしやの改造について

<li class="textBody">
<mt:EntryAssets type="image" lastn="1"><img src="<$MTAssetThumbnailURL height="64" square="1"$>" alt="<$mt:AssetLabel escape="html"$>" width="64" height="64" /> </mt:EntryAssets><$MTEntryExcerpt escape="html"$>
</li>

Hatena Bookmark Button の Retina 対応画像のバージョンですが、 data-* 属性をきちんとしていしてあげていないと昔のほうの画像ででてくるようなので、無理やり data-* 属性をセットするようにして動作させました (頑にHTML5 にしない)。

// require jQuery
$(document).ready(function(){
    $(".hatena-bookmark-button").attr('data-hatena-bookmark-layout','standard-balloon');
})
// attr() の第2引数は、ボタンのタイプ (はてなブックマークボタン作成のページを参照)setTimeout (function(){
 var h = document.getElementsByTagName("head")[0] || document.documentElement;
 var script = document.createElement("script");
 script.src = 'http://b.st-hatena.com/js/bookmark_button.js';
 script.type = 'text/javascript';
 script.async = 'true';
 h.appendChild(script);
} ,800);
// はてなブックマークボタンの画像リンクの a 要素には class="hatena-bookmark-button"を付与しておきます

環境変数 DBSocket の設定は、Can't connect to local MySQL server through socket '/tmp/mysql.sock'が出ることがあったためです。

エラーについては、「Can't connect to local MySQL server through socket」エラーについて が参考になりました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

5.2.3へアップグレードした時の設定とトラブルシューティングまとめ

  • Posted by: maRk
  • mt5 | myown
  • はてなブックマークに追加

Movable Type を4.2x系より、5.2.3 にアップグレードしたときにおこったトラブルの解決と各設置をまとめたものです

設定について

Movable Type(以下 MT) 4.x 系から 5.x 系に移行した際の確認事項からまとめていきます。

*作業内容をことごとく詳細にメモをとっていたわけではなく、思いあたったものだけを記載してますので、一部抜け落ちているかもしれません。

アップグレードが完了してもすぐに全体を再構築しないこと。再構築をかけないかぎりは静的なページの表示に変化はありません(当然のことながらダイナミックで動いている部分には変更が反映されることがあります。

従ってテンプレートの確認の優先順位としてはスタティックなページより、ダイナミックなページのテンプレートのほうを先におこなうほうがよいといえます)。

1. サイトの構成とパスはあっているか?

MT4.xからMT5.x にしたときにブログが存在する場合、自動でサイトが判別されて、その配下にブログがおさめられるという仕様になっています(あとからでも移動なども可能です)。

以下確認事項を列挙します

  • ユーザーダッシュボードを開いたときに、下のほうのウィジェットに「ウェブサイト」のタブにあるURLがドメインのトップなどになっているか
  • ブログのタブに、MT4.x で作成したブログ群が並んでいるか
  • ウェブサイト管理ページの設定>全般のところのパスに正確な値が入っているか
  • ウェブサイト管理ページの設定でウェブサイトのURLはあっているか(www. ありかなしかなど MTWebSiteURLに反映されるので)
  • ブログ管理ページの設定>全般のところのパスおよび公開設定は旧環境と同じ値が入っているか
  • 各管理ページのタイムゾーンの設定はあっているか

変更をおこなったら、保存をクリックします。反映には再構築ですが、ほかの確認がすんでから全体の再構築時でかまわないとおもいます。

2. プラグインが認識されていないものはないか?

MT4.x で使えていたものが、MT.5x で使用できない、もしくはシステムのプラグイン一覧のところに警告表示のあるものはないか、などをチェックしておきます。

動作しないか、または動作に不安があるプラグインについては、アップグレード後の確認の段階ではシステムのプラグインリストより個別にプラグインの使用を停止するか削除しておくほうがいいでしょう。

MT5.x系でのプラグイン動作の確認情報

  1. 小粋空間: Movable Type プラグイン一覧(MT5対応)
  2. 拙作プラグインのMovable Type 5.2対応状況 - The blog of H.Fujimoto
  3. MT5・プラグインの皆さん動いてますか - WolaWola (続編は前掲の『小粋空間』のページ上に全てリンクされています)

3. テンプレートの状態

  • アップグレード後にテンプレートが文字化けしていたりしないか
  • ダイナミックパブリッシングに設定しているテンプレートは正常に動作しているか
  • グローバルテンプレートなど初期化はおこなったか

トラブルに関して

  • a. 5.2.3 設置完了後に YAML のエラーで管理画面に入れない
  • b. サイトのテンプレートで文字化け
  • c. ダイナミックパブリッシングにしているテンプレートが404 で返る
  • d. PubSubHubbub プラグインで ping が動作していない

a. ですが、 YAML モジュールがMT5が YAML::Syck を標準にしていることで、書式において厳密になっているのが主な原因といえます。

対処方法は、問題のおこるプラグインを削除してしまう、あるいは、YAML::Syckに怒られないように.yamlファイルを修正するか、 YAML::Tiny を使うように、mt-config.cgi に書き込むなどです。

インストール時は、修正とかすると時間がかかってしまうので、一時的にmt-config.cgi に YAMLModule YAML::Tiny を書き加えました。

インストールが完了して一通り確認作業が終わった時点で、問題のおこっているプラグインの.yaml ファイルの修正にとりかかりました。というのも、標準にYAML::Syck が採用されたのはおそらくパフォーマンスに関係してるとおもわれ(確かベンチとったかたが記事をあげていたような)、面倒でも YAML::Syck の環境にしたかったので。ローカルのほうのMTOSもYAML::Syck になってますし。

エラーをおこしているプラグインの具体的な名前をあげると、 CommunityActionStreams とか Motion 。 CommunityActionStreams はGitHub 上のものに差し替えると大丈夫そうです。

.yaml の修正ですが、[_1] <a href= ... > のようなコードは、シングルクォーテーションを使って囲うことでエラーは回避できます。 あと、インデントにタブが使われているものもエラーですので、それらは半角スペースに、それとインデントの位置があっているかもチェックしておきます。

まあ、どちらもほとんど使わないようになってきたので削除してしまったほうが早かったかもしれません。

b. の文字化けについて

これは、Movable Type 5.x の変更点、注意事項、および既知の問題 : Movable Type 5 ドキュメント に書かれている、「データベースがMySQL 5.x で、UTF-8を利用している場合は、mt-config.cgiに"SQLSetNames 0"を指定してください。」の文面どおりにおこなったらなりました。

---- 同じような現象は、Google検索をかけてみるといくつかみられました。サーバーの環境などにもよるものらしいですが、当方の環境も当りだったということのようです。

具体的には、テンプレート名やサイトのタイトルなど複数の箇所で文字化けがおこります。環境変数を削除すれば、ほとんど解消します。しかしながら、これまでにデータベースになく新たにセットされたテーマで文字化けはそのままでした。

そこで、グローバルテンプレートについてはテンプレートの初期化を、サイトのテーマについては、再適用で文字化けは解消しました。

d. PubSubHubbub ですが、GitHub 上の https://github.com/miyagawa/MT-PubSubHubbub 最新版に差し替えて使用しています。

ところが、そのままで使うと、ping が送信されないので当然リーダーのサービスにも反映されていませんでした。

以前のヴァージョンもそういえば、テンプレートが標準でないときに動作してなかったことを思い出して修正をおこないました。

Plugin.pm の11行は、

  • if ($tmpl && $tmpl->identifier eq 'feed_recent')

となっています。このブログだと、template_identifier がNULL のため、以下に修正(改変?)しました。

  •   if ($tmpl && $tmpl->name eq 'Atom')$tmple->name

テンプレート名が 'Atom'のものを対象とする

(注: これは自分が修正したときのものです。1回既存のテンプレートをテーマとしてエクスポートし、既存のフィードのテンプレートはテーマの configuration で identifier => 'feed_recent' にして、最適用させるかidentifier にfeed_recent 登録済なテーマに入れ替えるのが望ましい方法です)

いまのところ以上です。なにか気づいたことがあったら追記します。

今月のいらんことしい(2013年 1月)

今月(2013年 1月)、サイトでカスタマイズした点をまとめたエントリです。

  • Vicuna テンプレートの枠にbox shadow を適用

このブログ(Vicuna テンプレート使用)にbox shadow をつけてみました。

Vicuna の場合、ヘッダーとフッター、コンテンツと分けられて構成されています。

影のために外枠でラッピングするのもなんですので、今ある要素のままでスタイルを適用したいとおもいます。

そのためには、それぞれ3つの要素ごとにbox shadow をかける必要がでてきます。

これをやると、影の広がりの距離の関係で、水平方向の影が要素の上下で重なって不自然な影のつきかたになってしまいます。

そこで、影の位置をそれぞれずらすことによって(なるべく)不自然につながらないようにみせています。

div#header には

  • box-shadow: 0px -6px 10px 4px rgba(0, 0, 0, 0.6);

div#content には

  • box-shadow: 0px 0px 10px 4px rgba(0, 0, 0, 0.6);

div#footer には

  • box-shadow: 0px 6px 10px 4px rgba(0, 0, 0, 0.6);

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

NASA のイメージ壁紙がよさそうだった件

  • Posted by: maRk
  • Mac | myown
  • はてなブックマークに追加

NASA のサイトからイメージをダウンロードして壁紙にしています。

完全に趣味な世界であるのですが、よさげなので(割と月並みですが)紹介してみます。

デスクトップはこのような感じに

macdesktop01.jpg

Launchpad を利用したときは以下のような感じです。

macdesktop02.jpg

壁紙を得るためのページについて

自分が気づいてから、ほんの数日後に NASA のサイトがリニューアルされていて、少々とまどっているのですが、画像アーカイブとして以下のページがあります(ということで、再度リニューアルがおこなわれて内容が違っていたらすみません)

適当に画像を選択して、Download Image のところで自分のコンピュータのディスプレイのサイズに近いものか、あるいはフルサイズのものでダウンロードします。

また、ニュース記事内にも画像があります。以下がアーカイブページです(ページ分割されているのでリンク先は1ページ目です)。

記事ページには Pin it ボタンが設置されているので、Pinteresrt アカウントをもっているひとは、Pin it してボードに保存しておくのが個人的におすすめです。

画像の壁紙の設定は、 Mac OSX だと、ブラウザで画像のみ表示したページで右クリックメニューより、「イメージをデスクトップピクチャとして使用」(利用ブラウザで文言が異なります)で設定されます。

個人的な設定方法は、Macの自分のアカウントのピクチャーフォルダ内に、壁紙用のフォルダを作成して、そこへ画像をダウンロードします。

macwallpaper.jpg

システム環境設定の「デスクトップとスクリーンセーバ」で [ + ] ボタンを押して壁紙用フォルダを追加してから画像を選択します。

mac-config-desktop-screensaver.jpg

アクセス解析による振り返り (2012)

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

2012年のまとめ記事で、アクセス解析をもとにふりかえってみます

解析は、Google Analytics によります

期間は、2012年1月1日から2012年12月29日 15:00 時点

モバイルトラフィックを除いたブラウザ上位5

  1. Internet Explorer 22.60%
  2. Chrome 19.67%
  3. Firefox 19.09%
  4. Safari 5.41%
  5. Opera 1.30%

ここのサイトではモバイルとPCからのアクセスを共通のIDで管理しているので、モバイルのブラウザがどうしても多くなります。そこでモバイルからの流入を除外してみると、やはりIEは多かったという結果に。しかしながら、Chrome Firefox と差はそれほどなく、戦国時代と呼ばれるものそのまま反映されたような結果となりました。

モバイルトラフィックで多かったブラウザ 上位5

  1. Safari
  2. Android Browser
  3. Safari (in-app)
  4. Chrome
  5. Mozilla Compatible Agent

モバイルトラフィックで多いデバイス上位5

  1. Apple iPhone
  2. Apple iPad
  3. (not set)
  4. Apple iPod
  5. Apple iPod Touch

Apple つよし、といった感じですがこれはコンテンツによるものと考えてますので、あまり参考にはならないかと。

イベントアクション(外部リンク参照ほか)の多かった記事のタイトル上位5

  1. Lightbox効果をFancyboxにスイッチ
  2. 普段使ってるフライパンで作るだし巻きたまご
  3. CyberduckのWindows版ダウンロードしてみました
  4. vLetterの筆記体
  5. Photoshop Elements 10体験版をダウンロードしてみた

本年は、スマートフォン、タブレット端末など話題になっているためか、これらデバイスからのアクセスにも注目した年でありました。結果としてですが、モバイルデバイスに関連した記事があればそれなりのアクセスがあるという、当たり前なレポートがでてきています。

今年(2012)のブログ記事はこれをもって終了です。それでは

おまけ

当該期間の Windows のヴァージョン

  1. 7 53.22%
  2. XP 34.65%
  3. Vista 11.16%
  4. NT 0.34%
  5. Server 2003 0.33%

今月のいらんことしい(2012年12月)

今月(2012年12月)、今年最後のサイトでカスタマイズした点をまとめたエントリです。

本文中の「ウェブマスターツール」ですが、名称変更があり(http://goo.gl/tjQxT4)、Google Search Console となりました。

  • CSSファイルの読み込みを mt/mt-static 外に移動し、そちらから読み込みように変更した
  • Action Streams でTwitterからのアクション取得を停止

CSSファイルの読み込みですが robot.txt によってCSSファイルを置いているディレクトリを ブロック(Disallow)している場合にGoogle インスタンスプレビューでCSSファイルを読み込めずにCSSが適用されない形でプレビューされることへの対処です(この件はGoogle ウェブマスターツールのLabs内のインスタントプレービューの機能より、確認することができました)。

Twitter のタイムラインフィードですが、'http://twitter.com/statuses/user_timeline/{{ident}}.atom' は以前より取得不可でしたので(Twitter側は2013.3 以降JSONのみ提供を決めており、Action StreamsプラグインがJSONにも対応してないといけないので対処は見送りに。Githubにあるstreams.yamlは、ざっとみたところ scraper 使ってるけど、これがスクレイピングにあたるのか微妙なので) Twitterのストリーム設定で取得しないようにチェックを外すとしました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

GaregeBandで録音してiPhone用着信音を作成するまで (デバイス転送編)

  • Posted by: maRk
  • PC | myown
  • はてなブックマークに追加

GarageBand からiPhone の着信音を作りまでの最後の回です。作成した着信音をデバイスに転送します。

これまでの過程は以下です

GaregeBand から iTunes へ着信音を送信する

GaregeBand を起動して、プロジェクトを開きます

メニューの「共有」から、iTunes に着信音を送信を選びます

Make_iPhone_Ringtone-11.jpg

送信が完了しますと、iTunes が起動していない場合は iTunes が自動でたちあがり、以下のように着信音のリストを示すようになります。

Make_iPhone_Ringtone-12.jpg

ちなみに、iTunes 11 での表示は以下のようになっています

Make_iPhone_Ringtone-14.jpg

で、デバイスを選択し着信音のラベルを選択します。(キャプチャは iPod touch で iOS バージョンは6.0.1で行なったものです)

Make_iPhone_Ringtone-13.jpg

追記:(2017.9.14)

iTunes 12.7 では、App Storeが削除されたため着信音の同期はiOSデバイスから管理するようになりました。

デバイスをPCに接続して、サイドバーの iPhoneの「着信音」に手動でファイルをドラッグするやりかたになるようです。詳細は以下。(9/14現在英語)

Use tones on your iPhone, iPad, or iPod touch - Apple サポート

以下は、iTunes 11 の場合です

Make_iPhone_Ringtone-15.jpg

適用 をクリックすると同期がはじまり、デバイスに転送されます

設定のサウンド>新着メールのところで、転送された曲をタップして選択します。(このとき音がながれます)

Make_iPhone_Ringtone-16.jpg

以上で、設定は終了です。メールを起動させて新着メール受信時に選択した音が流れます。

以下は今回録音したサンプル音(mp3)です。

GaregeBandで録音してiPhone用着信音を作成するまで (録音編集編)

  • Posted by: maRk
  • Mac | PC | myown
  • はてなブックマークに追加

GarageBand からiPhone の着信音を作りまでのメモです。楽器で演奏しGaregeBandで録音してみます。

前回は以下です。

楽器を接続して録音可能の状態までやりましたので、実際に演奏して録音したいとおもいます。

GaregeBand を起動します

作成済のプロジェクトを選択します

GarageBand のチューナーの機能を利用して調弦してみます。操作は合わせたい弦を弾くだけです。

Make_iPhone_Ringtone-05.jpg

下の録音ボタン(赤丸のボタン)をクリックで録音が開始されます。

Make_iPhone_Ringtone-06.jpg

無音部分はあとからでもカットできますので、気にせずに弾いていきます。

なお、iPhone 用の着信音は通常、最長40秒という制限があるそうですので、最初のフレーズのみ弾いています。弾き終えたら、停止ボタンを押します。これも無音部分はあとからカットしますので、止めるのに慌てることはありません。

Make_iPhone_Ringtone-07.jpg

録音終了させると上の画像のように紫のカラーのループとなります。 曲の長さにあわせて上の黄色い部分ドラッグでそろえることによって、数テイク録音するのがやりやすくなります。ループが終了したら始めのほうから次の録音が始ります。一発で上手く弾けない自分にはありがたい機能です。

Make_iPhone_Ringtone-08.jpg

上の画像のようにテイクのメニューを表示させて、それぞれのテイクを切り替えることができます。このなかで気に入ったテイクを採用していらないものは削除していきます。

着信音にするループを決定したら、音のない部分をトリミングしていきます。下の画像のようにループの端をドラッグにより詰めていきます。

Make_iPhone_Ringtone-09.jpg

単一のトラックだけでは音の厚みが足りないきがするので、複数トラックにしてみます。手っ取り早いのは既存のトラックを複製してユニゾンにしてしまいます。

Make_iPhone_Ringtone-10.jpg

コンプレッサーにAccoustic Guitar Clarify、 コーラスにSmooth Chorus を加えた音源としてみました。

なお、リアル音源トラックはソフトウェア音源トラックに変更ができないことになっています。

以上、だいぶ端折りましたが録音の実際でした。あと GarageBand 終了前に変更を保存するのを忘れずに。

次回、iTunes に着信音として書き出し、iPhone 用着信音として使うまでをやります。

追記:2015/01/10

GarageBand 10.x の場合の操作を以下に用意しておきました。

GaregeBandで録音してiPhone用着信音を作成するまで (準備編)

  • Posted by: maRk
  • Mac | PC | myown
  • はてなブックマークに追加

GarageBand からiPhone の着信音を作りまでをやってみました。

お断りですが、当方が GarageBand の操作にそれほど精通していません。ここはこうしたほうがいいよ、といった部分は多多あるかと思います。

下書きに時間を割いているばかりで、なかなか記事が表に出てこない、というオチになりそうなので、数回にわたっての記事にしようと思います。(次の記事まで間隔が空いてしまいそうな予感はしますが)

必要な機材など

  • Mac および GrageBand インストール済である状態
  • 演奏する楽器( 今回はエレアコを使用。アコースティックギター・クラシックギターでライン入力から録音したい場合はピックアップが必要です )
  • 楽器とMacの接続ケーブル(Macに接続のときミニプラグにする必要あり。あとはUSBタイプのものなど) 、あればギターアンプなども

録音までの準備

  • 楽器とMacを接続してみます
  • GarageBand でも入力の設定はできるようなのですが、システム環境設定のサウンドのところで、接続した楽器で音を出し(ギター側のアンプ等はスイッチを入れた状態にします)、入力/ライン入力(ライン入力というところをクリックして反転表示させます)という項目にて、入力レベルの調整を試みます(自分の場合、ギターアンプかませていないので入力音量を最大にしないと音量がえられませんでした)
  • ここで音がきていない、などの場合は接続を確認するとか(誤ってヘッドフォンのところにさしていないかなど)、ギター側のアンプの電源がきているか(エレアコの場合、バッテリーがあるかどうか)

新規プロジェクトの作成

  • GarageBand を起動します
  • 新規で作成する方法はいくつかあるのですが、自分は iPhone着信音 の Voice を選択して作成しています
Make_iPhone_Ringtone-01.jpg Make_iPhone_Ringtone-02.jpg

テンポ、キーなどはあとからでも編集できるのでとりあえずはファイル名だけ適当なもので指定しておきます(拡張子は.band のままで)。

Make_iPhone_Ringtone-03.jpg

Voice用のトラックがあらかじめ用意されています。ここをループに使ってもいいのですけれども、一旦全て削除してしまいます。

下部にある、[ + ] ボタンを押下します。

Make_iPhone_Ringtone-04.jpg

リアル音源を選択しました。 詳細設定も任意でおこないます。 エレアコ側の出力がモノラルのタイプなので、内蔵入力はモノラルの設定にしてあります。

次回、楽器演奏を録音していきます。

今月のいらんことしい(2012年11月)

今月(2012年11月)、サイトでカスタマイズなどをした箇所をまとめたエントリです。

  • Google Analytics のサイトの速度レポート用のコードを削除した
  • トップページ / において、MTOS運用サイトの新着記事情報も追加
  • レスポンスヘッダで文字コード出力するようにした
  • 関連記事の見出しは Other entries you might get interested をやめて、Similarity Content とした

Google Analytics のヘルプの「サイトの速度について」に、"ページ速度の測定はトラッキング コードで自動的に有効になり、改めて設定を行うことなく、サマリー レポートとページ速度レポートにデータが表示されます。"とありますので、これまでつけていたトラッキングコードの関数(_trackPageLoadTime)は削除しました。

なお、これをやるとサンプルとなるサンプリング レートがこれまでより引き下がるとのことで、サイトの速度レポートでサンプルとなった数は減少しました。

PHPにしているページはテンプレート上に追記の形で以下の通りです。

  • header('Content-Type: text/html; charset=UTF-8');

Similar content だとMTはじめた頃のカスタマイズを思うので、Similarityのほうにしてみました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2012年10月)

今月(2012年10月)、サイトでカスタマイズをおこなった点をまとめたエントリです。

Firefox をヴァージョン16 へアップデートして以降、カテゴリが選択できずに、新規記事作成でカテゴリをつけた記事として投稿できない、といった不具合がおこっていました。以下に修正のパッチファイルとして提供されています。なお次のリリースでパッケージとして提供されるようです(参照)。

4.38用のもので適用しています。(FileMergeで確認したところ、指摘されていた変更による影響のあった個所 〈modest の「Firefox 16 サイト互換性に関わる修正のまとめ」10/15 追記分に詳細があります〉の修正でしたのでとりあえず近いヴァージョンという判断で適用しています。もちろん、ヴァージョン違いによる適用で、動作保証されないという認識で)将来を見据えると4.x 系のMovable Type は可能であればversion 5のほうに移行しておいたほうがいいと考えています(----とここで書いていても説得力がありませんけれども)。

Twenty Twelveテーマは、WordPress 3.5 ベータ1 発表時のボーナスとして紹介されていたものです(記事)。これにともない、スマートフォン向け表示の WPtouch の使用をやめることとしました(以上tsuredurebox.geo.jp内の変更点です)。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2012年9月)

今月(2012年 9月)、サイト内でカスタマイズをおこなった箇所をまとめた記事です。

  • Twitter widget を Embedded Timelines に切り替えた
  • はてなスターの追加ボタン画像の変更

以下、Embedded Timelines の設置メモです。

Twitterにログインしておき、以下の場所にいきます。

まだ移行していない状態だと何も出ていないので[新規作成]をクリック。

あとはフォームに必要事項を入力して貼付け用コードを得るだけです。

注意点として、同じウィジェットを複数サイトで使い回したい場合、ドメインのところは貼付けたいサイトのURLをドメイン単位でカンマ区切りで入力します。

*設置ページと設定ドメインがあっていないと設置しても表示されません。

詳細は、https://dev.twitter.com/docs/embedded-timelines のページにあるとのことです

はてなスターの画像の変えかたは、もっとカスタマイズをしよう - はてなスター日記 にあるとおりです。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

今月のいらんことしい(2012年7月)

今月(2012年7月)、サイト内のカスタマイズ、変更をおこなった点を纏めたエントリーです。

  • Movable Type 4 のロゴを復帰
  • Fastladder への登録リンクを削除

ロゴマークについては、しばらく表示をやめていたのですが再び使うことにしました。Movable Type 4系とMovable Type 5系の記事が混在してますので、このブログではヴァージョンが4であるというのを明示したいためです。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

メモ:BitbucketにあるリポジトリのソースをJSONPで取得し表示する

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

Bitbucket上のソースコードをJSONPを使った表示を行なうというものです。

以下が参考リンクです。

上記ページによりますと、

The URL format for viewing a file's content is:
https://api.bitbucket.org/1.0/repositories/[username]/[repository-name]/src/tip/[path-to-file]

という形式になるとのことです。

username がBitbucket のアカウント、repository-name はリポジトリ名ということになります

SyntaxHighlighter の auto loader を使うと、レンダリングのタイミングが難しいようでしたのでうまくないやり方になっています。

なお、もともと Bitbucket の各リポジトリのソースページには embed のためのコードを表示するリンクがあります。

ブログ記事等に貼るのであればこのembeed 用コードでも十分です。ただし、クリックした場所かあるいはタイミングによって、そのまま貼付け用のコードそのものがブラウザから読みこまれて表示されてしまう場合があります。

その場合はもう一度クリックをやり直すなどすればいいのですが、スニペットの書式だけ以下にメモしておきます。

<script src="https://bitbucket.org/{アカウント}/{リポジトリ名}/src/{ハッシュID}/{ファイルまでのパス}?embed=t"></script>

メモ:Mac:Time Machineからの復元後おこっていたこと

  • Posted by: maRk
  • Mac | PC | myown
  • はてなブックマークに追加

自分の環境のOS X Lion でTime Machine をつかって復元を試みたあとのアプリケーションでおこっていたことをメモしておきます。

環境
  • MacBook Pro (15-inch, Early 2011)
  • OS : バージョン 10.7.4
  • Time Machine 用ディスク:G-DRIVE Mini

先般、Thunderbolt ソフトウェア・アップデート 1.2 のインストール後の再起動時にカーネルパニックになるという不具合に出くわしまして、その際に Time Machine 復元をしました。(件の対処については次を参照。但しこの問題については Apple で対応しており、アップデート版としてアップデート 1.2.1をリリースしています。:http://support.apple.com/kb/TS4303?viewlocale=ja_JP )

と、ここまでの経緯は置いておき、本題にいくとします。(----と勿体ぶるほど大袈裟なものでもなくて、単にこちらが Mac の作法を知らなかっただけかもです)

復元後に確認している状態について

以上です。もし何かあったら追加するかもしれません。

今月のいらんことしい(2012年6月)

今月(2012年6月)、サイト内のカスタマイズ、変更をおこなった点を纏めたエントリーです。

  • ブログの説明を変更
  • XML宣言をはずした
  • new DISQUS 2012 をアクティベーション
  • タグ一覧ページの各タグのリンクカラーで、ステータスの区別を色の濃さによる違いへと変更した

ブログの説明(BlogDescription)を「週末はコピペコーダー」に変更しました。特に意味はなく、はてなのプロフィールの説明でつかっているのと同じものでそのままです。

XML宣言ですが、ウェブページ(Movable Typeのシステム上での名称)においては、既に宣言をつけない形で以前から公開していました。これを記事ページ等にもXML宣言なしに切り替えをおこないました。

Disqus が新しい feature を公開されていましたので使えるようにしてみました。

設定が済むと、コメントで使用していたフォームが新しいものに切り替わっています。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

メモ:GoogleAnalytics:モバイルからのトラフィックを除外するカスタムセグメント

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

Google Analytics のアドバンス セグメントの設定で、モバイル以外のレポートとしてフィルターをかける時のメモ

* Analyticsの新しいほうの画面を前提としています。動作については、現行のヴァージョン上で確認していますが、Analytics 自体、仕様が変わってきますので以下の情報のとおりになっていないことがあります。

モバイルだけのアクセス状況を確認したい、というときはアドバンス セグメントのデフォルトのセグメントから「モバイルトラフィック」にチェックすればいいです。

では、その逆でモバイルは除いたものでフィルターするときは__

カスタム セグメントをつかう

2013/10/15追記:以下は、旧インターフェースによる説明となります。新しいほうでは、「⌄」をクリックし、メニューを表示させてからおこないます。

「アドバンス セグメント」をクリック

アドバンス セグメントの設定画面が表示されたら、「+新しいカスタムセグメント」をクリック

analytics_segment.jpg

左から、『除外』『オペレーティングシステム』『正規表現一致』『* 正規表現』

『* 正規表現』のところは、以下のもの

Android|iOS|(not set)|iPod|iPad|BlackBerry|iPhone|Playstation|Nintendo

最近、Appleのデバイスに対して、オペレーティングシステムの表示を、「iPad」 とかでなくて、「iOS」 として認識するようになっていたので、IOSを追加してあります。しかしながら、過去のレポートにiPhone、 iPod などが残っているので、これらも除外対象としておきます。

セグメントをテストして、確認できたらセグメントを保存して、再びアドバンス セグメントより作成した、カスタム セグメントにチェックをいれます。

レポートのセカンダリディメンションで、オペレーティングシステムを選択し、除外設定されたオペレーティングシステム名がテーブル上の「訪問数」が「0」となっていることが確認できたら成功です。

今月のいらんことしい(2012年5月)

今月(2012年5月)、サイト内でカスタマイズした箇所をまとめたエントリです

  • あわせて読みたいブログパーツを撤去
  • CSS ファイルの修正
  • WordPress のSocial Media Widgetプラグインをいれてみた
  • MTOS 、5.14 へアップデート
  • MTOS で使用中のDisqus プラグインの 「disqus_post_message」の出力を変更した

「あわせて読みたい」のブログパーツですが、表示に変化がおこっていない状態なので普通に画像を貼っているのと違いが無いという理由で外すことにしました。

Social Media Widget はウィジェットに各ソーシャルメディアのアカウントとアイコンを一括設定して、follow usなウィジェットとして利用できるといったプラグイン。

つれづれぼっくす にて導入してみました。

表示のサポート的なもので、ソーシャルメディアアカウントが少ない場合は自前でウィジェット作ってもそんなに時間的なものは変わらないのかな、----と使ってみた感想です。

利用中のMTOSを5.13 -> 5.14 にしました。

Disqus プラグインで、disqus_message が記事全文そっくり出力しているのに加えて、二重引用符に対し、バックスラッシュのエスケープ文字(と改行コード)を差し込む(<div "id="disqus_post_message">"></div>内に収められる内容)といった問題がありました。但し、この要素自体はdisplay:noneによって隠されています。

ということで、応急の対応として以下のように変更をおこないました。text をみないようにして、 excerptのほうを呼び出すように変更しました。

対象ファイル
  • /disqus/lib/DisqusCommentSystem/Tags.pm
変更箇所

116行目付近。

    #    my $text = encode_php($entry-&gt;text, 'qq');
    my $text = encode_php($entry-&gt;excerpt, 'qq');

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

当ブログのカスタマイズ記録

widget.jsファイル、複数ツイートのときは1回読み込みすればいいみたい

  • Posted by: maRk
  • myown | net
  • はてなブックマークに追加

Twitterのツイートをサイトに埋め込みするときの埋め込み用HTMLコード内のwidget.js は1回のみ読み込んであればいいようです。

まあ知っている人には分かりきった話ではあるのですが、わざわざ検証しました、ということでサンプルページを作ってみました。

* 検証のためだけで人様のツイートを使うのもあれなので、自分の面白くもなんともないツイートになってます。widget.jsを置く箇所は、通常、ツイート(blockquote.twitter-tweet)の一番最後におきます。

今月のいらんことしい(2012年4月)

今月(2012年4月)サイト内でカスタマイズした箇所をまとめたエントリです

  • Tag Archives (タグアーカイブ)のタイトルの表示形式を変更
  • はてな ふるふるブックマーク機能を削除
  • WordPress の404ページにもGoogle のリンクヘルプ導入
  • FancyBox ライブラリをヴァージョン 2.x系に変更
  • サイト内検索がサイドバーメニューで上位に表示されるように変更した
  • Googleカスタム検索ページのカスタマイズ
  • Disqus コメントのpadding がなくなっていたのを修正

Tag Archives テンプレートにおいては、

  • Tag Archives : タグネーム « ブログ名

という形式でしたが以下のように階層に変更

  • タグネーム « Tag Archives « ブログ名

WordPressのテーマには、今使っているテーマだと、ランダムリンクとタグ一覧がでるようになっていますが、Google検索のヒントから探すことも出来るように設置してみました。

404 ページのカスタマイズ - ウェブマスター ツール ヘルプ

設置はテーマ編集で404テンプレートを編集(当該テンプレートファイルに対して一時的にパーミッションを書込み可能にしておく必要があります)。上のリンク先にスニペットがでるのでブログトップURLをいれればOK

利用中のFancyBoxのヴァージョンを2に移行しました

FancyBox(ヴァージョン2以降) は 以下から

設置方法は説明ページにあるとおり。

ダウンロードファイルを任意のスクリプト用のディレクトリにアップロード

jQury 1.7.x を読み込む

jquery.fancybox.css、jquery.fancybox.pack.js をそれぞれ読み込む。

折角なので、Thumbnail Helper という機能も使ってみる事にしました。

Optionally add button and/or thumbnail helpers というコメント以下のコードで、今回はthumbnail helpers のほうだけ使用することにしたので、jquery.fancybox-thumbs.cssとjquery.fancybox-thumbs.js を読み込むようにしました。

Thumbnail Helpers を使う場合は、特定のclassを割り当て、jQueryのコードをThumbnail Helpers対応のコードを読み込む必要があります。

この機能は、モーダル表示中に下部にサムネイル画像が表示されてそのサムネイルをクリックすることでも画像を表示させることができるというものです(このエントリにて動作を確認できます)。

そして記事毎で「使う」・「使わない」を選択しておきたいので、MTIFタグによる振り分けを行うことにしました。

条件分岐が以前のものより複雑になるため、fancybox用のモジュールを新たに新設して、モジュール内で分岐処理した後にinclude で取り込むという形であります。

Googleカスタム検索では、テーマを「シャイニー」から「デフォルト スタイル」(Google検索結果風)へと変更。ラベルによる絞り込み機能も追加してみました。これらは、管理画面からの操作で可能です。テーマ変更後は新たにコード取得しなおして検索ページを編集し更新する必要があります。

Disqus コメントの端のの余白が無い状態は以下を追加で対処しました。

  • .comments-open-content { padding:2.5em; }

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

ホームベーカリーでホットケーキ粉の蒸しパンレシピ

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

ホットケーキミックス粉を使って、蒸しパンをホームベーカリーで作りましたので、写真つきで行程を紹介

必要な機器・材料

  • ホームベーカリー (機種は、Panasonic SD-BMS102 )
  • クッキングスケール(はかり)
  • 裏ごし器 か 粉をふるう道具
  • ホットケーキミックス 100グラム
  • ベーキングパウダー 2グラム
  • 食塩不使用バター 5mm 厚に切る
  • 卵 Mサイズで半分
  • ラム酒入りレーズン(ケーキ材料のコーナーなどにおいてあります)
  • ぬるま湯 100ml 35度 40度くらいまで

完成例:

  • 完成した蒸しパン

Continue reading

メモ:自分のはてなフォトライフの新着画像をPipesでバッジ作成

  • Posted by: maRk
  • myown | net
  • はてなブックマークに追加

Yahoo!Pipesを利用して、はてなフォトライフのフィールドからバッジ作成までをやってみました

用意するもの

  • Yahoo! Pipesアカウント(米国Yahoo!アカウント)
  • はてなフォトライフのアカウントとフィードURL

手順

フォトライフからRSSを得ます。ページのヘッダ部分に小さなRSSアイコンがあるのでそのURLがフォトライフのRSSのアドレスとなります

Pipesに入って、Create a pipe

以下ほんの一例です。任意で必要なエレメント等を追加します。

Fetch Feed をドラッグしてfotolifeのRSSをいれる

Create RSS をドラッグ。以下を設定して、Fetch Feed に結合する

  • Title item.title
  • Description item.title
  • Link item.link
  • PubDate item.pubDate
  • Author item.author
  • GUID item.pubDate
  • media:content そのまま
  • media:thumbnail そのまま

Rename モジュールをドラッグ

以下のようなマッピングをおこない、Create RSSモジュールに結合してPipe Output

  • item.hatena:imageurlmedium Rename media:thumbnail.url
  • iitem.hatena:imageurl Rename media:content.url

hatena:imageurlmedium はより小さいサムネイルが必要な場合は、

  • hatena:imageurlsmall

を指定できる。

作成したPipeのキャプチャです

create-pipes-hatena_fotolife.jpg

Pipes Output を実行して以下の要素を調べ問題がないようならば、Saveします

media:thumbnail
  • url ここがフォトライフのサムネイル画像のリンクになっているか
media:content
  • url ここがフォトライフ画像のURLになっているか
  • link  フォトライフのページリンク( 例 http://f.hatena.ne.jp/{USER}/12345678901234)

完成したら、View Resultsで確かめ、Get as a Badge より必要なコードを取得して任意の箇所にはりつけをします。

今回作成したものは以下にあります。

Pluploadのローカルテストの自分用ノート

Pluploadでのメモ。アップロード先のディレクトリについてなど

以下は正しい情報でない可能性が高く個人のメモ以上のものはありませんのであしからずです。

上記サイトのダウンロードよりGPLv2ライセンスのものを一式もらってくる

今の時点では、Version 1.5.2 (2012-01-06)

examplesフォルダのcusom.html とか、jqueryフォルダ内のhtmlファイルをブラウザで開く(php動作下)。

アップロードしたファイルは、MAMPの環境だと、MAMP/temp/php/. に入っている

これをテストフォルダにするには、upload.phpファイルを開き、以下の行をコメントにする

  • $targetDir = ini_get("Directive") . DIRECTORY_SEPARATOR . "plupload";

ちなみに、upload_tmp_dir はphp.iniのupload_tmp_dir = に記述されている場所にあたる。

MAMPだと、スタートページを開いて、phpinfoタブからupload_tmp_dir ディレクティブを調べれば確認できる

そして、$targetDir = 'uploads'; のコメント(//) を外すと、upload.phpが入っているのと同じ階層にuploadsフォルダが作られる

ローカルの場合ではセーフモードなしなので、本番サーヴァの場合にセーフモード対策も考慮しないといけないことになるかもしれない(5.3系ので試してるからそこまで考えてないけど)。

jqueryフォルダ内のページで、queue widget の HTML5 runtime などが動かなかったので、以下の対処。

upload.php というファイルが読み込めないことがエラーの原因なので、// General settings のurl: を正しいパスに書き換えればよいとおもわれる。

自分の場合はupload.php をjqueryフォルダ内にコピーしておこないました。

今月のいらんことしい(2012年3月)

今月(2012年3月)サイトでカスタマイズした箇所をまとめたエントリです

  • コメントをDisqusに切り替え
  • Disqus導入に伴い、コメント数カウント表示を廃止
  • サイト内検索をGoogle カスタム検索に置き換え
  • Internal linkへのrel=nofollowの削除

Disqus導入については以下に記事にしています

単に設置するだけならば、それほどに時間のかからない Disqus ですが、カスタム設定とかしようとおもうと、結構時間をとったりします(Helpページが英文のみというのもあって)。

disqus_identifier という変数名のセットがあって、そこにユーニークなIDを入れることになっているのですが、説明をみてもよくわからない部分があったので、WordPressのプラグインが出すコードを参考にすると以下のようなパターンなようでした。

  • var disqus_identifier = エントリID エントリーパーマリンク

よって、これに値するMTタグは以下のようにしてみることにしました。

ウェブページに「webpageの接頭辞+ページベース名」を入れることにして、エントリーページはエントリーID+パーマリンクという形です。

<MTIfCommentsActive>
<$mt:EntryClassLabel setvar="entrytype"$>
・・・・・
var disqus_identifier = <mt:If name="entrytype" eq="ウェブページ">'webpage:<$mt:PageBasename encode_js="1"$>'<MTElse>'<$MTEntryID$> <$mt:EntryPermalink$>'</mt:If>;

*(注)上のコードは一部抜粋のため、そのままペーストして使うと正常に出力されない場合がありあます。

内部リンクに対するnofollow指定の解除ですが、検索結果ページでパンくずリストか反映されていたりするなど、重要度が低くなってきたので内部リンクへのnofollow は解除していくということとしました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

DISQUSへコメントのインポートが完了した

  • Posted by: maRk
  • myown
  • はてなブックマークに追加

DISQUSのインポートツールによるMovableTypeからのコメントのインポートが完了しましたので手順メモです。

用意するもの:

  • Disqusアカウント
  • Movable Type (ver. 4.x 以降)
  • WXRファイル出力用のインデックステンプレート

作業の流れ:

  1. WXRファイルを出力するテンプレートを作成する(*)
  2. テンプレートをブログのインデックステンプレートとして作成し、XMLファイルとして構築する
  3. 出力されたファイルをダウンロードして内容を確認 (ブラウザで開いてパースエラーがないかなど)
  4. Disqusでインポートの対象となるサイトを選択→ Tools → Import → Generic (WXR)
  5. Upload your WXR XML file にローカルにあるファイルを指定してアップロード
  6. アップロード後メッセージが表示される。コメントの取り込みが24時間以内に完了する旨が記されているのでしばらくまつ
  7. 完了のメッセージが表示される

アップロード後以下のようなメッセージがDisqusの管理画面に表示されています。

import_has_been_ successfully.jpg

一日ほど経過後に完了のメッセージが表示されていました。この時点ですでに管理画面にはインポート済のコメントが表示されていて、記事ページにも反映されていました。

import_completed.jpg

Emailが記載されていなかったコメント投稿者ですが、Disqusのほうのメールアドレスで登録されてしまうようです(仕様と思われる)。EmailアドレスがDisqus上でひも付けされている場合にはアイコンが表示されるようになっているもようです。

* 検索してみると、既に作成されているかたのエントリが見つかるのですが、自分で納得いく部分がなかったので作成してみました。

出来上がったインデックステンプレートは以下のページにサンプルとして公開してあります。

作成については、Disqus公式のMovable Type用プラグイン同梱のWXRのテンプレートのファイルと WordPress で作ってるブログでエクスポートしたファイルを参考にしています。

まあこのファイル使うと、ブログ記事をWordPressにごっそり移行とかできたりもするのですが、なんというか、ファイル単位でテンプレートタグで出力できるのもMovableTypeの機能性ですよね。

MTの卒業制作としてWXRを自力で組むっていうのはどうでしょうか、とふと思いました。

Index of all entries

BlogTop > myown Archive

Feeds
Elsewhere

Action Streams

logo

Comment powered by DISQUS

Return to page top