www.ni4.jp

カテゴリ:Webの記事一覧

【MovableType.net】テーブルのレスポンシブ対応を選択できるカスタムブロックを作ってみた

ども、どもども。
MovableType.net大好き、西山です。

相変わらずMovableType.netのブロックエディタを研究している日々。
今回は「テーブル(表)のレスポンシブ対応」を考えてみました。

ブロックエディタに限らず、いわゆるWYSIWYGエディタを使用すると、テーブルのレスポンシブ対応って面倒ですよね。
すべて同じ対応・表示方法なら困らないですが、いくつかパターンを用意しようと思うと、WYSIWYGエディタだけでは実現できないことも多いです。(htmlソースに手を加えなきゃならない)
HTMLに明るい方であればそれでも良いのですが、そのような知識がない方でも同じように使えると便利です。

MovableType.netで実現するそれ以外の方法として思いつくのは、それぞれのパターン別にカスタムブロックを用意する方法ですね。
ブロックエディタを使用する前提で考えると、そのパターンは多くて2〜3種類かと思うので、私も最初はそれで考えていました。
MovableType.netのカスタムブロックは、任意のブロック(ex. div.hoge)でそのブロックを囲むことができたり、カスタムブロックそのものに任意のclassを設定できたりするので十分に対応できます。

ただそんな中、シックス・アパートさんの記事「ソースコードを表示するブロックの作り方」を見ていて、これと同じようにどのパターンでテーブルをレスポンシブ対応するか、パターンを選択できるメニューを表示して、テーブルのカスタムブロックを1つにまとめることができたら解決できるなと考えました。

というわけで、今回は私がやってみたカスタムブロックを紹介しようと思います。

続きを読む:
【MovableType.net】テーブルのレスポンシブ対応を選択できるカスタムブロックを作ってみた

【MovableType.net】カスタムブロックはいくつまで作れるのか、そしてショートカットにはいくつまで登録できるのか

ども、どもども。
MovableType.net大好き、西山です。

MovableType.netのブロックエディタ、特にカスタムブロックがすごく便利だと思っていろいろとテストしている中で、ふと気になったことが…

カスタムブロックって、いくつまで作れるんだろう?
そして、そのショートカットはいくつまで登録できるのだろう?

あれ…気になりませんか?
私は気になりました(笑)

というわけで、公式サイトのマニュアルを見る限り特に制限は書いていないので、実際に試してみることに。

続きを読む:
【MovableType.net】カスタムブロックはいくつまで作れるのか、そしてショートカットにはいくつまで登録できるのか

【MovableType.net】ブロックエディタの表示設定を変えて使いやすくしてみた

ども、どもども。
MovableType.net大好き、西山です。

先日の記事では、MovableType.netのブロックエディタの見た目を「カスタムブロック」と「カスタムスクリプト」で調整してみたことを書きました。

その後もいろいろと「より使いやすく、実際の出力と同じ見た目にしたい」と思い、試しているところです。

そんな中、今日は「ブロックエディタの表示設定を変更してより使いやすいエディタ」にしてみようと思います。
ごくごく簡単な設定だけのことではありますが、エディタが使いやすくなりました。

続きを読む:
【MovableType.net】ブロックエディタの表示設定を変えて使いやすくしてみた

【MovableType.net】YouTube動画埋め込み時のブロックエディタの見た目をカスタムスクリプトで解決してみた

ども、どもども。
しばらくご無沙汰しておりました、西山です。

以前、Movable Typeのブログ記事に埋め込むYouTube動画をレスポンシブ対応するという記事を書いたことがあります。
この方法は今現在もこのブログでも使っていて、こんな感じでレスポンシブ対応しています。

いい感じ。

ただこのブログでも利用しているMovableType.netなどでは、リッチテキスト形式を利用している場合、埋め込んだYouTube動画が記事編集画面では以下のような感じで表示されてしまうんですよね…。

エディタ画面

せっかくのリッチテキスト形式(実際に表示されるページとほぼ同じ見た目にできる)なのに、これはすごく残念。

でも大丈夫!
今年6月にMovableType.netでリリースされたブロックエディタを使用すると、記事編集画面でもきちんとプレビューできるようになります。

記事編集画面を表示側と同じCSSで装飾できるエディタCSSと組み合わせれば、ほんとに「見たまま」の編集ができるようになるので、この記事ではブロックエディタとカスタムブロック、カスタムスクリプトを使用して「記事編集画面でも実際の画面と同じように見えるYouTube動画の埋め込み方法」をまとめてみようと思います。

なお、レスポンシブ対応については事前にこの記事と同じように実施している前提となっていますので、そちらもあわせてご覧ください。

続きを読む:
【MovableType.net】YouTube動画埋め込み時のブロックエディタの見た目をカスタムスクリプトで解決してみた

45日間のリモートワーク生活をやってみた

Photo by Andrew Neel on Unsplash

ども、どもども。

2020年5月31日、新型コロナウィルス感染症の拡大防止のための緊急事態宣言が解除され、まだまだ予断は許さないものの、日常が少しづつ戻ってきました。

北海道で2度めの緊急事態宣言が始まる少し前、北海道・札幌市の緊急共同宣言をうけ、弊社では4月14日から5月6日までのリモートワーク推奨期間へと入りました。
その後、全国的な緊急事態宣言が5月7日以降も延長されることになり、弊社でも5月31日までこれを続けることになります。

弊社ではもともとメンバーの複数名がWork From Home(WFH/自宅勤務)中心で活動していたこと、他のメンバーにも週に2回の自宅勤務を可能とする体制があったこと、ワタシ自身が創業後10年近く自宅事務所であったこともあり、各メンバーへのヒアリングでも「普段どおりに仕事ができている」と、特に混乱なく移行することができました。

というわけでこのブログ記事では、この45日間ほどを振り返り、ワタシあるいは弊社が取り組んできたWFHの感想や今後の改善点、仕事環境や利用しているツールなどをまとめてみようと思います!

続きを読む:
45日間のリモートワーク生活をやってみた

MovableType.netで記事(ウェブページ)を関連付けしてみた

ども、どもども

本ブログでも利用しているMovableType.net、新たな機能が追加されました。

これまでソフトウェア版のMovable TypeではMTAppjQueryを利用して実装していた同機能、これがMovableType.netでも利用できるようになったのは良いニュース。
この機能の具体的な利用例は以下でも紹介されています。

というわけで早速試してみました!

続きを読む:
MovableType.netで記事(ウェブページ)を関連付けしてみた

ブログ記事の目次をJavaScriptで自動生成してみた

ども、どもども。

先日、ブログデザインをリニューアルしたときから記事の中に目次をつけたいと思っていたので、この週末にやってみました。

当初、JavaScriptでゼロからチャレンジしてみようと思っていたのですが、調べてみるとjQueryのプラグインなどもすでにあったので、今回はそちらを利用することに。

今回使用したのはこちら。
なんと、2014年の記事!(小粋空間さん、いつもお世話になっております)

ブログ記事の目次については賛否両論ありますが、ワタシもここ最近になってnoteを読むことが増えたり技術系のブログを読んでいるときに「目次って便利だな」と思うようになった感じです。

利用方法は配布元サイトにも書いてありますが、今回設置した手順をまとめておこうと思います。

続きを読む:
ブログ記事の目次をJavaScriptで自動生成してみた

コロナ禍を乗り切る Survive The Corona キャンペーンへの想い

今、日本全国で話題になっているコロナ禍、政府から出された緊急事態宣言も5月末までの延長が決まり、さまざまなメディアでも連日報じられ、その影響は計り知れない状況と思います。
不要不急の外出を控えるなど日常生活にも多大な影響が及んでおりますが、特に事業者の皆さまにとっては甚大な影響が出ているものと思います。

そのような中、弊社にもなにかできることはないかと考えた結果、4月21日から5月末までを予定したネットショップ構築支援キャンペーン「Survive The Corona」を実施することになりました。

このキャンペーンでは以下のサービスを提供いたします。

  1. 弊社製品 SKELETON CARTを利用し、短期間・低予算でネットショップを構築
  2. ライセンス費用(30,000円税別)を6ヶ月間据え置き、後払いにて対応
  3. 必要に応じて、ドメイン・サーバー等の手配を無償にて代行
  4. 構築・設置作業等を無償にて代行
  5. クレジットカード決済導入を無償にて代行
  6. 契約期間6ヶ月後は弊社との契約続行に関わらず自身での継続運営が可能

キャンペーン詳細については上記の特設ページをご覧いただくこととして、今日はなぜこのキャンペーンを始めようと思ったのか、どのように利用してもらいたいか、そしてこのキャンペーンへの想いを書き起こしておこうと思います。

続きを読む:
コロナ禍を乗り切る Survive The Corona キャンペーンへの想い

Stripeのチームメンバーでアカウントを共有する

スクリーンショット 2020-04-23 0.00.40.png

ども、どもども。
ここ最近、弊社ではクライアントのウェブサイトでクレジットカード決済を導入する際、Stripeを導入することが多いです。
弊社では自社製品 SKELETON CART を開発・販売していますが、それにこの決済サービスを組み込んだ新バージョンも近々リリースする予定です。

さて、そんなStripeですが、クライアントさんからの依頼で導入する際、ちょっと面倒なことがあります。
このサービスでは、アカウントのサインインに2段階認証を利用することが前提になっていて、1つのアカウント(メールアドレスとパスワード)をクライアントさんと開発者(弊社)で共有することが難しいのです。
普通に考えたら、パスワードを共有するなんてのは好ましくないのはわかりますが、では導入の初期設定時はどうしたら良いんだろう?と考えていました。

ちなみに、公式サイトのサポートにはその方法が書かれているのですが、ウェブ上には具体的にその部分を説明した記事などがなかったので、今日はその部分について解説したいと思います。

続きを読む:
Stripeのチームメンバーでアカウントを共有する

WherebyとZoomを比較検討してみた

whereby.png

ども、どもども。

ここ最近は新型コロナウィルス COVID-19 の影響で、リモートワーク(telework / work from home)を推奨する流れが一般的になってきていますね。
弊社でも数年前からSkypeやAppear.in(現:Whereby)、Googleハングアウトを使用したオンラインミーティングを取り入れていましたが、メンバーの1人が日常的に在宅勤務だったこともあり、昨年10月からは他のメンバーも在宅勤務できるように社内制度を整えつついました。
そんな中で今回の流れとなり、弊社クライアントさんとオンラインミーティングを実施することも今後増えそうなので、このタイミングで使用するツールもちゃんと検討したいなと思っていました。

弊社ではWherebyを使用することが多かったのですが、ここ最近はZoom 一択!という声も多く聞くようになり、この機会に比較検討してみることに。

参考: 無料Web会議システム4社を比較【Zoom・Whereby・Skype・Googleハングアウト】 - Hashikake [ハシカケ]

結論から書くと、弊社ではこれからもWherebyを使っていこうと思いました。

WherebyとZoomの主な比較ポイント

ワタシが主に比較したのは以下の点。

  • 参加者の負担(アカウント作成など)
  • 参加人数など無料版での制限

続きを読む:
WherebyとZoomを比較検討してみた

[まとめ]DashBoard Utilityの詳細解説!

こんにちは。
この記事は、Movable Type Advent Calendar 2019の13日目の記事です。
一つ前の記事は、宮永さんの DockerでMovable Type for AWSを驚くほど簡単に無料SSL化する です。

---

今年もAdvent Calendarの季節がやってまいりました。
2012年からスタートして、今年で8回目、私も毎年参加しています。

2016年にはMovableType.netで複数のウェブサイトを開発・運営する際に便利に使えるMovableType.net DashBoard Utility(Chrome拡張機能/無償)を公開し、そこから4年、少しづつバージョンアップをしてきました。

2019年12月11日現在、25名の方にご利用いただいております。
多いのか、少ないのか、微妙な数字ですが(苦笑)

今年の夏にリリースされた「サイトサーチ」にも、もちろん対応しています。
https://movabletype.net/sitesearch/

さて、そんな感じで機能追加をしてきたこのエクステンションですが、現在では以下のような機能を持っています。

  1. 各ウェブサイト/フォームのパネルが開閉式になり、高さが極端に狭められる
  2. 新しくウェブサイトを作るためのリンクが最上部へ移動する
  3. 新しく作成したウェブサイトが最上部に追加される
  4. ウェブサイトの順序を任意に変えられる
  5. パネルの開閉、ウェブサイトの順序をCookieに保存できる(1年/変更の都度延長)
  6. ダッシュボードから直接、ウェブサイト/ブログのテンプレート編集画面へ移動できる
  7. ファイルマネージャ内で画像のサムネイルを表示する
  8. MT.netフォーム、サーチサービスにも対応

私がセミナーなどに登壇する際、このエクステンションもご紹介することが多いのですが、一つ一つの機能を紹介する機会もなく、弊社のスタッフでさえ「え、そんな機能があったのですか!(標準機能だと思ってた)」なんて事があるので、今日はそれら機能についてスクリーンショットを混ぜながら、まとめてご紹介しようと思います!

続きを読む:
[まとめ]DashBoard Utilityの詳細解説!

JP_Stripes 札幌Vol.3を開催したよ!

ども、どもども。
昨日、第3回目となるStripeユーザーコミュニティ「JP_Stripes 札幌」を開催しました。
先月末に開催されたJPSC2019のre:Cap版と題して、スピーカー5名で実施。
いつにもまして振れ幅の大きいユニークなイベントになりました。

しかも開催したのはさっぽろ創世スクエアにあるHTBさんの会議室。
イベント前には局内見学ツアーも開催され、残念ながら私は参加できなかったのだけれど、イベント本編には20名以上の参加者が集まり、大いに盛り上がりました!

イベント本編

IMG_1054.jpeg

1つ目のセッションは、小島さんの「JP_Stripesキックオフ &Stripeアップデート」
初めて参加した人にもわかりやすいStripeの紹介と、最新情報まとめ。
Terminal、早く使ってみたいなぁ。

IMG_1074.jpeg

2つ目のセッションは私から。
昨年7月、今年3月と続いた話の完結編(?)
セッション終了後、質問も多くいただき、反響が良くてよかった!

当日のスライドはこちら(過去のまとめみたいな感じです)

続きを読む:
JP_Stripes 札幌Vol.3を開催したよ!

JP_Stripes Connect 2019にスピーカーとして参加してきました!

design_stripe_1_1.jpg

ども、どもども。西山です。
前回のブログ記事更新からはや3ヵ月、ご無沙汰しておりました。
弊社(ジャクスタポジション)はウェブサイト・システムの構築をメインとしていて、年末から3月いっぱいくらいまではいわゆる繁忙期というやつでうんぬんと言い訳しなくてもいいですね(笑)
とにかくブログ記事から遠ざかってしまってました(汗)

この間もいろいろとあったわけですが、今回は3月21日(木・祝日)に大阪で開催されたイベント「JP_Stripes Connect 2019」の参加レポートを残しておこうと思います。

続きを読む:
JP_Stripes Connect 2019にスピーカーとして参加してきました!

MovableType.net Dashboard Utility ver0.4.50リリース!

ども、どもども。西山です。
今年も残すところあと2週間ちょっととなりましたね。
1年があっという間です...。

というわけでこの記事は、Movable Type Advent Calendar 2018の12日目の記事になります。

またかと思われる方もいるかも知れませんが、今年もMovableType.net Dashboard Utilityをバージョンアップさせましたよ!(3年連続!)
今年11月、MovableType.netの新サービス「MovableType.net フォーム」がリリースされていた際も少しバージョンアップしていたのですが、その際は特にリリースなどを書かなかったので、今回まとめてご紹介しちゃいます!

MovableType.net Dashboard Utilityはウェブブラウザ「Chrome」の拡張機能で、MovableType.netで複数(それも割と多く)のウェブサイトを管理されている方にぴったりなエクステンションです。
Chromeストアから無料でダウンロードできるので、気になる方はぜひ使ってみてくださいね。

続きを読む:
MovableType.net Dashboard Utility ver0.4.50リリース!

MTDDC Meetup TOKYO 2018に参加してきました!

IMG_4218.jpg

ども、どもども。
1週間前になりますが、MTDDC Meetup TOKYO 2018に参加してきました!

全5会場、30ほどのセッションが用意された一大イベントで、参加者は270名ほどだったようです。
会場となったのは、Yahoo!Japanセミナールーム。
なんどかYahoo!LODGEには行ったことがありましたが、セミナールームも非常にキレイで設備もよく、気持ちよく参加することができました。

続きを読む:
MTDDC Meetup TOKYO 2018に参加してきました!

【Movable Type】ブログ記事へのYoutube 動画埋め込みをレスポンシブ対応してみる

ども、どもども。
今日はMovable Typeの記事の中に含まれるYouTube動画をレスポンシブ対応する方法について、書いてみようと思います。

mt_x_youtube.jpg

ご存知の方も多いと思いますが、弊社(ウェブサイト制作会社)ではMovable Typeをプラットフォームにしてウェブサイトを構築することが多いです。
クライアントはMovable Typeを使用してブログ記事を書いたり、自社商品などの紹介ページを作成したりするわけです。

そんなウェブサイト、今はスマートフォンなどに対応する「レスポンシブ」対応を行うのが一般的になっているわけですが、先日、あるクライアントから「商品紹介に複数のYouTube動画を掲載したい」という相談を受けました。
YouTube動画を掲載することはなんら問題ないのですが、レスポンシブ対応するとなるとちょっと考えなければなりません。

  1. YouTubeの埋め込みコードに対応するCSSを追加してレスポンシブ対応する
  2. 1記事(1ウェブページ)に1つの動画を掲載できるようカスタムフィールドを用意する
    複数のYouTube動画を載せたい場合は、その分のカスタムフィールドを用意するか、あるいはプラグイン(MTAppjQueryなど)を使用して、任意の数のカスタムフィールドを追加できるようにカスタマイズする
  3. テンプレート上でそのカスタムフィールドの出力部分を任意のブロック(例:<div class="youtbe">iframeのコード</div>)で囲み、レスポンシブ用のCSSが適用されるようにする

ワタシが勉強不足かもしれませんが、一般的にはこんな感じかなと思います。
ただ、今回相談をいただいたクライアントが利用する予定だったのはMovableType.netというサービスで、カスタムフィールドを規定数用意しておくことは可能ながら、プラグインを利用して任意の数を掲載できるようにすることはできませんでした。

よって、無制限にYouTube動画を掲載できるようにするためには、ブログ記事本文欄にYouTubeの埋め込みコード(iframe)をコピペで貼り付けていく必要があります。
ただ、そうなるとYouTube埋め込みコードを設置するたびにそのHTMLソースコードを編集して、iframeを<div class="youtube">〜</div>などで囲むようにしなければなりません。

我々のように慣れている人にとってもこれはちょっと面倒。
そこで今回はJavaScriptを使用してそれを自動化する方法を取りました。
非常に簡単な方法ではあるのですが、そのような解説をしているブログ記事等が見当たらなかったので、この記事を残して置こうと思ったわけです。

では、さっそく進めていきましょうー

続きを読む:
【Movable Type】ブログ記事へのYoutube 動画埋め込みをレスポンシブ対応してみる

話題の決済サービス Stripe を使ってみた

ども、どもども。
ここ数年、話題の決済サービスStripeを使ってみました。

スクリーンショット 2018-09-09 15.56.56.png

これまで、クレジットカード決済代行サービスはいくつか利用してきましたが、ちょっとした「かゆいところ」がありました。

  • 決済手数料の問題(月額維持費的なものも含む)
  • 購入者アカウント登録の必要性
  • アカウント審査時間(利用開始までの時間)の問題
  • ダウンロード販売への対応可否(ドキュメント不足あるいは難読問題含む)
  • テスト環境の利用しやすさ
  • 別ウィンドウ問題( https://www.ni4.jp/2018/02/post_97.html

これらを一挙に解決できそうなサービスがStripeでした。
決済手数料などを他の決済サービスと比較した結果などは他のブログ記事さんでも紹介されているのでそちらにお任せします(笑)
アカウント登録も無料ですし、利用開始までの流れなども特にマニュアルなどなくてもサクサクと進められると思うので、まずは触ってみると良いんじゃないでしょうか。
最初、私も英語のドキュメントがとっつきにくいと思ったのですが、わかりやすい英語でしたし、難しいところはGoogle翻訳などを使用してもクリアできる感じだったので大丈夫と思います。

というわけでこのブログでは、プログラマーではない私の目線で「うまく行ったところ/うまく行かなかったところ」など、これまでの経緯をまとめてみようと思います。

続きを読む:
話題の決済サービス Stripe を使ってみた

MTDDC Meetup HOKKAIDO 2018、やりきった!

ども、どもども、西山です。

もうすっかり時間が経ってしまいましたが、2018年6月9日(土)にMTDDC Meetup HOKKAIDO 2018を開催しました!
私はMT蝦夷(Movable Type ユーザーグループ 北海道)の主宰として、2013年に続き実行委員長を務めさせていただきました。

DSC_2722.JPG

当日は一般参加者・関係者を含め、210名ほどの方々が集まり、盛大に開催することができました。
いろんな場所で、もう何度も感謝を伝えてきましたが、あえてもう1度、ありがとうございました!

ブログ書くまでがMTDDCというわけで、終了後やっと時間が作れたのでブログ更新です!
前回のブログ更新からもう3ヶ月も経ってたんですね...いやはや(汗)

今まで経験したことのない規模での企画

実行委員会を立ち上げたのが2017年10月19日(木)のこと。
集まったのは、株式会社HAMWORKSのハムさん、関口さん、株式会社インセンブルの濱内さん、そして弊社(株式会社ジャクスタポジション)から私と淺田の5名。
ここからすべてが始まったのですが、ここ札幌ではこれまでにないイベントにしたいという私のワガママをみんなが叶えてくれました。

前回の2013年開催時以降、東京方面との繋がりも増え、東京のセミナーイベントなどにたびたび足を運ぶようになって思っていた事がありました。
それは「北海道にいるとなかなか最新情報を得られる機会がない」ということ。
弊社のように比較的参加できる環境であればよいのですが、会社さんによってはなかなかそうも行かないという事情を聞くたびにすこし残念な気持ちになっていました。

そこで今回、最初に実行委員会で伝えたのが「東京のセミナーに行くのが難しいのであれば、そのスピーカーたちを北海道に集めてしまえばいいじゃん」というもの。
札幌での開催なら、普段東京へ行けない人たちだって参加しやすくなるし、そんなイベントに触れることができれば、もしかしたらもっと積極的に東京などへ情報収集に行こうと思えるんじゃないだろうか、そうすれば結果的に北海道の業界がまた1つ良い方向へ向かえるんじゃないだろうか、ということでした。
そんなわけで、「行けないなら呼べばいい」をコンセプトに今回のイベントを企画したのでした。

ハムさんの協力を得て、ほんとに豪華なスピーカー陣を揃えることができた今回。
集客目標を200名として、ここ札幌では過去最大級のウェブ系イベントにしよう!とスタートしたのでした。

続きを読む:
MTDDC Meetup HOKKAIDO 2018、やりきった!

MT東京-45でセッションを担当してきました!

ども、どもども。
去る3月10日、渋谷のロフトワークCOOOP10で開催された「【MT東京-45】進化するMovableType.net事例特集&なかなか聞けないお金事情」にて、セッションを担当してきました。

DSC02487.jpg

数ヶ月前になりますが、MT東京の藤さんにイベント登壇依頼をいただき、今回のテーマがMovableType.netで、ワタシも普段からよく利用しているサービスだったこともあってもちろん承諾。
どんな内容がいいですかねーって感じで相談している中で、「おそらくMovableType.netを利用してウェブサイト構築を請け負っている制作会社さんの参加が多くなるだろう」「他の制作会社がどんな感じ(費用感・利用ケース)で請け負っているのか知りたいのでは」ということにクローズアップして構成しようという話になりました。

続きを読む:
MT東京-45でセッションを担当してきました!

常時SSL化後に消えてしまったFacebookの「いいね!」数を元に戻す方法:Movable Typeテンプレート版

20180225.jpg

ども、どもども。

ここ1〜2年くらいで、さまざまな理由からウェブサイトのURLを常時SSL化することが増えてきました。
すでに数ヶ月も前になりますが、この個人ブログも2017年5月にSSL化を実施したところです。

ブログに限らず、ウェブサイトをSSL化するのは「URLを変更する」ことを意味するわけですが、通常は301リダイレクトなどを設置していれば、特にそれまでと変わらずブログを運営していくことができます。
ただ、ひとつだけ変わってしまうのが、URLに紐づくサービス...例えばFacebookの「いいね!数」であったり、はてなブックマークの「ブックマーク数」だったりします。
それらサービスではSSL化することで別のURLと認識されてしまい、それまでの数値がリセットされてしまうんですね。

はてなブックマーク数の例

あまり多くのブックマーク数ではないのですが、参考まで(汗)

常時SSL導入前のはてなブックマーク数:7ユーザー

常時SSL導入後のはてなブックマーク数:1ユーザー

私のブログでは、はてなブックマーク数を掲載していなかったのでそれほど気にならなかったのですが、Facebookのいいね!数についてはSSL化したことでリセットされてしまったのがすごくもったいない気がしていました。
とは言え、SSL化を実施してしまった後に気がついたので、個人ブログだし良い勉強になったってことで気にしない気にしない...と思うようにしていました。

...いや、だめだ、気になる(汗)

SSL化後もFacebookいいね!数を引き継ぐ方法はあるわけだし、このまま見過ごすのは...なんだかやっぱりもったいない!
というわけで、SSL導入から9ヶ月ほど経った後にこの施策を実施することにしたのです。

続きを読む:
常時SSL化後に消えてしまったFacebookの「いいね!」数を元に戻す方法:Movable Typeテンプレート版

.htaccessで特定のIPアドレス以外をメンテナンスページへ302リダイレクトさせてみた

ogp.jpg

ども、どもども。
ウェブサイトの公開時、あるいはメンテナンス時に自分のIPアドレス以外をメンテンスページへリダイレクトさせて、その間にゆっくりと作業を進めたい。
この仕事をやっているとわりとよくある話だと思います。

これを実現するためのhtaccessによるメンテナンス表示(IPアドレスでのアクセス制限)は以下になります。

ErrorDocument 503 /maintenance/index.html #表示させるメンテナンスページ

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteCond %{REQUEST_URI} !=/maintenance/ #アクセスを許可したいディレクトリ
  RewriteCond %{REMOTE_ADDR} !=000.000.00.00 #アクセスを許可したいIPアドレス
  RewriteRule ^.*$ - [R=503,L]
</IfModule>

<IfModule mod_headers.c>
  Header set Retry-After "Fri, 13 February 2018 09:00:00 GMT" #メンテナンス終了予定時刻を設定
</IfModule>

これで、自分(のIPアドレス)以外がアクセスを試みた際、メンテナンスページが表示されます。
503エラーで表示させるためどのURLへのアクセスであっても同じ内容(メンテナンス)が表示され、そのサービス(サーバー)が一時的に利用できない状態であることを意味するため、例えばGoogleボットなどが訪れても最後に書いてあるRetry-Afterを拾ってメンテナンスが終わる頃に再訪問してくれるという感じになります。( 参照:Wikipedia HTTP 503

こちらの方法がいわゆるお作法に基づく正解なのですが、今回の場合はちょっと事情が違いました。

今回構築したのはいわゆるLP(ランディングページ)だったので、HTML+フォームのページ以外には表示するコンテンツが無く、ドキュメントルートにindex.phpだけを設置、テンプレートHTML類も公開ディレクトリ以外に設置していました。
また、今回が初公開となることからすでにindex.htmlを設置し、その中で公開日についてアナウンスしていました。そのため今回のメンテナンス作業(公開作業)はBASIC認証などを用いるのではなく、公開日をアナウンスしているindex.htmlをルートに設置したまま実施しなければならない状況でした。

例えば、index.htmlとindex.phpがルートにある状況なら、通常、https://www.example.com/ にアクセスした際はindex.htmlが優先表示されます(Apacheの設定による)し、また今回はフォームの画面遷移URLがすべて https://www.example.com/#confirm のような感じで遷移するように構築していたため、ルートにindex.htmlを置いてメンテナンスすることはできませんでした。(index.html#confirmなどになってしまう)

それで上記のhtaccessによるメンテナンス表示をしようとしたのですが、今回はここで問題が生じました。
503エラーだとURLが変化しないため、実体がある/maitenance/index.htmlにはアクセスできるのですが、https://www.example.com/ へアクセスした時は、htaccessで実体のないファイルへのアクセスを遮断していたためか500エラーになってしまいました。

でもこのまま作業が進められないのは困ってしまいます。
そこで、これ以外の方法でなんとか自分以外のアクセスをメンテナンスページへ誘導する方法を考えることにしました。

続きを読む:
.htaccessで特定のIPアドレス以外をメンテナンスページへ302リダイレクトさせてみた

クロネコWebコレクト利用時に「お支払い手続きエラー」になる原因とその対策がわかった。

HIRAyamatoneko_TP_V.jpg

ども、どもども。

弊社ではSKELETON CARTという自社開発のショッピングカートシステムを販売しています。
もちろん販売しているだけじゃなくって、複数の自社クライアントのECサイトにも導入しているのですが、たまにそのクライアントから「お客さん(購入者)がクレジットカード決済できなかったらしい」と連絡を受けることがありました。

ところが、何度確認しても特に問題が見つけられず、これまで原因特定には至っていませんでした。
本当であればそのお客さんに、エラーになってしまったその状況をもっと色々聞ければいいのですがそうも行かず...。
悶々としていたところ、あるクライアントから有力情報(スクリーンショット)が届きました。

続きを読む:
クロネコWebコレクト利用時に「お支払い手続きエラー」になる原因とその対策がわかった。

MovableType.net Dashboard Utilityのバージョンアップ

ども、どもども、西山です。
この記事はMovable Type Advent Calendar 2017の13日目の記事です。
昨年のこの企画で、MovableType.netのダッシュボードを使いやすくするChromeエクステンションを公開しました。

それから1年、今年はこのエクステンションをぷちバージョンアップし、version 0.3.0をリリースしました!
MovableType.netをご利用の方、特にウェブサイト制作会社さんなど、クライアントのウェブサイトを多数管理している方にご利用いただきたいエクステンションです。

続きを読む:
MovableType.net Dashboard Utilityのバージョンアップ

札幌ウェブ屋だらけの忘年会 Vol.5

ども、どもども、西山です。
前回のブログ記事公開からはや2ヶ月...その間もいろいろあったのですが、なかなかブログ記事を書けずにいました。
お仕事いっぱいいただけて嬉しい限りです。

さて、そんな最近ですが、一昨日の12月1日(金)にここ数年恒例となった「札幌ウェブ屋だらけの忘年会」を開催しました。
今年で5回目の開催で、今回も多くの方に集まっていただきましたー!

一昨年に第3回を30名以上で開催するも、初めての大人数(それまでは10〜20名ほど)での開催を甘く見ていた幹事4名。
当日は大混乱の中での開催となりました...
それを反省して開催した昨年の第4回、原点回帰と銘打って少人数開催するも、今度は「行きたかったのに募集人数少なすぎ!」という大変多くの反響を...(汗)
そこで今回は再び40名規模での開催となりました。

続きを読む:
札幌ウェブ屋だらけの忘年会 Vol.5

CMSMix Sapporo Vol.1に参加してきた。

ども、どもども。
先週土曜日にCMSMix Sapporo Vol.1が開催され、そちらに参加してきました。
今日はそちらのレポートを。

CMSMix Sapporoは、今から1年と少し前、札幌に5つのCMSコミュニティが集まって開催されたイベントの名前です。
弊社(ジャクスタポジション)の主催で、a-blog cms、concrete5、Drupal、Movable Type、WordPressの各コミュティがセッションを行うセミナーイベントでした。

この時は50名近くの参加者にお集まりいただき大変盛況となりました。
その後、Drupalさっぽろの白根さんと、a-sapの口田さんから「合同勉強会」のお誘いをいただき、その名称としてCMSMix Sapporoを利用することになったのです。

イベントは基本的に「もくもく会」のスタイルとして、参加者が自由にやりたいことをやるという緩い感じではありますが、毎回各CMSをテーマに掲げ、他のCMSコミュニティの人もテーマに沿った「普段とは違うCMSをやってみる」というイベントにしました。
当日は20名以上の方にお集まりいただき、これまた予想よりもずっと盛況なイベントになりました。

IMG_0488.jpg

さらにこの日は、テーマにもなっていたa-blog cmsの生みの親、アップルップル 山本さんにもご参加いただきました。
名古屋から日帰りで参加いただけるとは、いやはやありがたい限りです。
また、会場の片隅で直接ハンズオンを行うなど、ある意味すごく贅沢なもくもく会になったのでした。

続きを読む:
CMSMix Sapporo Vol.1に参加してきた。

instafeed.jsとAPIを使用してウェブサイトにInstagramの画像を表示させてみた

スクリーンショット 2017-05-10 16.07.21.png

ども、どもども。
非常に今更感がありますが、ちょっと必要な事情があってinstafeed.jsを使ってみました。
ただ、ウェブ上に載っている情報にバージョン差異と思われるばらつきがあって、ちょっと時間がかかったので記事にまとめておこうと思います。
(ブログ記事に日付が入ってないってのが結構あって...まぁそれはまた別の話)

この記事は2017年5月10日の時点で書いています。
本日の目次はこちら

  1. Instagramにアクセスして、API取得用クライアントを作る
  2. InstagramのユーザーIDを取得する
  3. アクセストークンを取得する
  4. instafeed.jsを使用してウェブサイトに埋め込む

では早速参りましょうー。

続きを読む:
instafeed.jsとAPIを使用してウェブサイトにInstagramの画像を表示させてみた

MTLive Sapporo を開催しましたー!

ども、どもども、西山です。
去る4月22日(土)、コワーキングスペース カンテさんでMTLive Sapporoを開催してきましたー。

IMG_0320.jpg

MTLive Sapporo とは

それまでMTCafeSapporoとして開催してきたMovable Typeユーザーオフ会のことです。
Movable Type(以降MT)を利用しているユーザーさん、ウェブ系開発者さんなどが集まり、情報交換したりもくもくと作業をしたりという「みんなで集まってMovable Typeを楽しむ会」という感じのイベントです。
主宰はMT蝦夷(Movable Typeユーザーグループ北海道)で、30〜40名のセミナーイベントを開催することもありますが、不定期でこのような小規模イベントも開催しています。
2016年は様々な都合で開催できなかったのですが、2015年8月以来およそ1年半ぶりの開催となりました。
名称については、ここ数年、東京で開催されている同イベントが名称をCafeからLiveに変更したこともあり、今回の復活にあわせ北海道でもLiveの名称を使用することにしました。

コワーキングスペース カンテさんについて

IMG_0167.jpg

今回、会場となったのは昨年10月にオープンしたコワーキングスペース カンテさん。
英会話教室やカフェ、本屋さんなどが併設されたおしゃれスペースであるばかりでなく、札幌駅からも近く、IT/Web業の方に限らず多くのお客さんが連日訪れているコワーキングスペースです。
運営の方に友人がいて、MTLive Sapporoの会場を探している旨を相談したところ、快く受け入れてくれました。
これまでIT/Web系のイベントは開かれたことがなかったらしく、「なかなか新鮮な光景で楽しいです(笑)」と言っていただけたので、たぶん今後もこちらを利用させて頂くことになりそうな、そんな快適空間でした!(参加者からの評判もすこぶる良かったです!)

続きを読む:
MTLive Sapporo を開催しましたー!

Movable Type 7リリースと同時に発表されたMTの新ライセンス体系についてシックス・アパートさんに聞いてみた。

ども、どもども。

私が経営するジャクスタポジションは、シックス・アパート株式会社さんのPro Netに加盟しており、ウェブサイト構築時の多くでMovable Type及び関連製品を導入しています。

そんなMovable Typeですが、先日(4月3日)、ソフトウェア版の次期メジャーバージョンアップとなるMT7とそれに伴い改定されるライセンス体系についてリリースがありました。

このリリースを読んで、弊社クライアントさんや開発パートナーさんから質問が寄せられたり、Twitter上などでもライセンス体系に関する話題が出ていたので、シックス・アパートさんにメールで問い合わせてみました。
ブログ記事への掲載許可をいただきましたので、こちらにそれを転載させていただきます。

※4月7日、質問とその回答を2件追加しました。

続きを読む:
Movable Type 7リリースと同時に発表されたMTの新ライセンス体系についてシックス・アパートさんに聞いてみた。

SaCSS Special 09:Direction Specialに登壇してきました。

ども、どもども。
3月4日(土)に開催されたSaCSS Special 09:Direction Specialにスピーカーとして参加してきました。

SaCSSで登壇させていただくのは、これで3回目。
前回は2014年9月に同じくディレクションの内容で登壇していました。
その際はウェブディレクション全般に関する内容だったのですが、今回は「見積もり」にフォーカスした内容でお話してきました。
ここ数年、ディレクションに関するセミナーなどでお話させていただく機会が多かったのですが、その際にいつもご質問いただくのが見積もり方法に関するものだったんですよね。
昨年8月の2回めの参加でその見積もりに関する部分をお話したのですが、そちらが好評だったようで今回の登壇となりました。

続きを読む:
SaCSS Special 09:Direction Specialに登壇してきました。

ウェブ制作者向けブラウザBliskをインストールしてみた

ども、どもども。
2017年、最初のブログ記事。
今年もよろしくお願いします。

さて、2017年1発目が2016年の話題と言うのもアレですが...半年ほど前?に話題になっていたブラウザ、Bliskを入れてみました。

スクリーンショット 2017-01-21 15.01.37.png

このブラウザ、いろいろな特徴があるらしいのですが、気になったのは「Chromeエクステンションがそのまま使える」という話。
Chromeじゃなくてもインストールできるの?ということで試してみました。

続きを読む:
ウェブ制作者向けブラウザBliskをインストールしてみた

MovableType.net Dashboard Utility 作りました。

screen05.jpg

ども、どもども、西山です。
この記事はMovable Type Advent Calendar 2016の14日目の記事です。

さて、皆さんはMovableType.netというサービスをご存知でしょうか?
詳細は公式サイトに任せるとして、ざっくり簡単に言ってしまうと、私の大好きなMovable Typeを安価でメンテナンスフリーで安心して利用できちゃうサービスです。
ソフトウェア版やクラウド版と機能面での差異はあるものの、このサービス独自の機能などもあり特に今年1年は多くのお客さまに導入させていただきました。
弊社開発実績はこちらにて

このMovableType.netは2015年2月に正式公開されたのですが、それから今までの約2年間であれよあれよと新機能が追加になっています。
例えば、当初は搭載されていなかったテンプレート編集画面のシンタックスハイライト機能。
2015年12月末にChromeエクステンションで私が作成していたのですが、それもめでたく2016年10月には本体にも標準機能として実装されました。
(私が作ったエクステンションも独自機能があるのでまだ公開しております)

そんなわけで、弊社で新規にウェブサイトを構築する際にも、MovableType.netをご提案する機会が増え、そして導入していただくケースも増えてきました。
ところが...どんどんクライアントさんのサイトをMovableType.netで構築すればするほどある問題が。

それが「MovableType.net、ダッシュボードがどんどん使いづらくなる問題」でした。

続きを読む:
MovableType.net Dashboard Utility 作りました。

MTDDC Meetup TOKYO 2016に参加してきました。

ども、どもども、西山です。
去る11月12日(土)、東京お台場のコワーキングスペースMONO(テレコムセンター)で開催されたMTDDC Meetup TOKYO 2016に参加してきました。

当日はすごくいい天気でした。

IMG_9306.jpg

§イベント概要

MTDDC Meetupは、年に1〜2度、全国各地のMTユーザーグループが各地で主催している大型イベント(参加者100〜300名規模)です。

毎年秋は東京開催となっており、今回で3回目の実施となりました。
今回も200名以上の参加があり、3つに別れたセッション会場では、Movable Typeの話はもちろん、他のCMSの話題や、ウェブ全般にかかわる様々なセッションが行われました。

会場の様子はこんな感じ。

入り口看板(ポスター)

IMG_9310.jpg

Room A

IMG_9295.jpg

Room B

IMG_9298.jpg

Room C

IMG_9299.jpg

おやつコーナー

IMG_9297.jpg

マルチトラック(セッションが並行開催される)は、どれを聴講しようかという悩ましくもワクワクする気分になりますね!
なお、当日のタイムテーブルはイベント公式サイトをご覧ください。

続きを読む:
MTDDC Meetup TOKYO 2016に参加してきました。

【MT福岡】Web制作・運営のツボ Vol.1に登壇してきました!

ども、どもども、西山です。
去る10月9日、福岡市天神で開催された「Web制作・運営のツボ Vol.1」(主催:MT福岡)に登壇してきました。
今回はディレクターとしてMovable Typeでのサイト構築・運営をどのようにやっているのかなどを中心に話してきましたよ。

今年の春にMT福岡メンバーのつよぽんが北海道へ旅行に来た際、福岡でセミナーを開催したいと相談され、「呼んでくれるのなら喜んで!」と返事をしたのをきっかけに福岡まで行ってきました。
福岡に行くのは、2013年1月に開催されたMTDDC Meetup KYUSHU以来3年半ぶり。
今回はそのレポートを書いておきたいと思います。

1日目

秋の福岡は初。
数日前から札幌はだいぶ冷え込んできたこともあって、その気温差なんと10度。
しかも雨が降っていたので、到着した頃はかなり蒸し暑く感じる気温でした。

01.jpg

行きの飛行機の中で初めてSKY Wi-Fiを使ってみました。
便利な世の中になりましたね。

IMG_9096.jpg

福岡の地下鉄「福岡空港線」の床。
QRコードになっていたので何か読み込めるのかと思ったのですが、どうやら読み込めないようです(^^;

IMG_9098.jpg

到着した日の夜は、MT福岡の面々と当日の登壇者で前夜祭(懇親会)を開いてきました。
北海道・東京・福岡から10名ほどが集まって、非常に楽しい前夜祭でした。
これ、やるとやらないとでは当日の進行も違ったりするんですよね。
関係者の間で、当日「初めまして」というのはなかなか時間も取れないし、結束力が高まるというか。
今回もあまり遅くならない程度に楽しんできましたよ(笑)

IMG_9099.jpg

IMG_9104.jpg

IMG_9106.jpg

福岡と言えば、モツ鍋・明太子・長浜ラーメン!
前夜祭にも関わらず、いろいろと美味しい食べ物を堪能してきました。
(注:このブログはグルメブログではありません)

続きを読む:
【MT福岡】Web制作・運営のツボ Vol.1に登壇してきました!

Adobe Xdが快適すぎる

ども、どもども。
最近使い始めたAdobe Xdが快適すぎる件について。

AdobeXD.jpg

昨日開催されていたAdobe MAX Japan 2016でもXdの関連セッションがあったらしく、Twitterなどでもいろいろと流れてきてたけど、これは一度使い始めるとやめられないかも。

これまでワイヤーフレームは、IllustratorやCacooを使ってきてて、それらも満足して使っていた(Cacooがたまに保存させてくれなくなる以外はw)のだけど、Xdはとにかくサクサク進められるところと、プロトタイプを作れちゃうところがかなりいい感じ。

今日はXdでワイヤーフレームを作って、それをIllustratorに貼り付けて資料を作成(上の画像がそれ)するって感じで進めたんだけど、なんだか急に「デキる子」になった錯覚でした(笑)
画像をサクッと入れられたり、繰り返しのパーツをザザザっと入れられたり、気持ちいいです。
PDF書き出しに対応してくれたのが大きいですよねー。

ただ、いろいろできる反面、ワイヤーフレームと言いつつデザインの方にまで進めがちになっちゃう(こだわり過ぎちゃう)のが、ちょっと心配かもなという感じです。
それくらい使い勝手のよいツールに出会いました。

これからしばらくはAdobe Xdの使い方を研究します!

MT東京 vol.23「春のプラグイン祭り」に参加してきました。

どもども。
こんにちは、西山です。

昨日、4月23日(土)に開催された、MT東京主催「春のプラグイン祭り」に参加してきました!

続きを読む:
MT東京 vol.23「春のプラグイン祭り」に参加してきました。

たった2日で楽しく身につく「HTML/CSS入門教室」を読んだ。

ども、どもども。
3月16日に発売になったこちらの本を読んでみました。

IMG_7817.jpg

たった2日で楽しく身につく HTML/CSS入門教室 (Design&IDEA)

たまたま友人が「これからHTML/CSSを学んでみたい!」と相談を受けていたので、この本なんかどうだろうと思ったのです。
最初、同じ著者の「作りながら学ぶ HTML/CSSデザインの教科書 」も良いかなと思ったのですが、よりこちらのほうが初心者向けかもということでこちらを取り寄せました。

で、友人に渡す前にまずは内容をと思って、サラッとですが中身を読んでみました。

続きを読む:
たった2日で楽しく身につく「HTML/CSS入門教室」を読んだ。

ディレクター・ノンプログラマー目線のMovable Typeの補足

こんにちは、西山です。
この記事は、2016年2月27日(土)に開催されたCMSMix Sapporoのセッション「ディレクター・ノンプログラマー目線のMovable Type」に関するフォロー記事です。
私が担当したこのセッション、あろうことか時間配分を誤って10分以上も早く終わってしまったのでした。
明らかな準備不足...

そこでこの記事では、セッション中に「伝えたつもりでいるけれど、伝わっていないかもしれない」ことを中心に、当日のセッションをフォローアップする目的で書いていきます。
セミナー・イベントに参加された方はもちろん、参加されなかった方もぜひご覧ください。

なお、スライドはこちらで公開されています。

続きを読む:
ディレクター・ノンプログラマー目線のMovable Typeの補足

CMSのお祭り「CMSMix Sapporo」を開催しました!

ども、どもども。西山です。
もう1週間前になってしまいますが、去る2月27日(土)にCMSMix Sapporoを開催しました!

当日の模様はキタゴエさんほか、各登壇者さんのブログ等でもご覧頂けます。

5つのCMSが北の大地に集結!CMSMix Sapporoに行ってきた #cmsmix_sap | キタゴエ
CMSMix Sapporoで、ふたたびCMSディレクション全般について話しました | Study | ウェビンブログ
CMSMix Sapporo でa-blog cmsセッションのスピーカーとして登壇しました | セミナー | mkasumi.com
札幌で開催されたイベント「CMSMix Sapporo」にて、concrete5愛を語ってきました。 - ねこみみ隊長らしい。
ほか、確認次第随時掲載(予定)

弊社主催イベントであると同時に、MT蝦夷も協力...ということで、Movable Typeのセッションは私が担当させていただきましたー。

続きを読む:
CMSのお祭り「CMSMix Sapporo」を開催しました!

MTにログインできない:syntax error at lib/MT.pm line 482, 〜

ども、どもども。
私、ブログ・CMSプラットフォームのMovable Typeが大好きでして。
北海道のユーザーグループを主宰してそのことを公言する機会が多いと、Movable Typeに関する相談をお受けする機会も増えてきたんです。
例えばうちと同じようなウェブサイトの制作会社さんだったり、フリーランスのデザイナーさんだったり。
ウェブで調べてわかることもありますが、時にはそれだけではなかなか情報がつかめないことあります。

今日はそんな例で、あるエラーを解消した際のお話を。
プログラマーさんなどにしたらごく普通のことかもですが、それ以外の方がウェブ上で検索した際にこの記事を見てくれると良いなと思っております。

では早速。

続きを読む:
MTにログインできない:syntax error at lib/MT.pm line 482, 〜

2月6日「ブログの日」とブログカード

どもども。
2月6日って「ブログの日」なんですね。Facebookのフィードで知りました。

そんなのいつからあったの?と調べてみると、Ameba Blog(アメブロ)でお馴染みのサイバーエージェント社が2007年に制定して、日本記念日協会によって認定をうけたとか。いやいや知りませんでした。

せっかくなんで、上のリンク先にある記念スタンプを私も使ってみるかとアクセスするも、アメブロでしか使えない模様(そりゃそうか)
それなら画像だけでもと思ったけど、スクリーンショットを載せるのもなぁ...と思ったところで、はてなブログの「ブログカード」を思い出しました。
前からやってみたかったんだよなーと。
ただ、このブログ(Movable Type)で利用するには、APIを使って埋め込まなきゃならないとか、ちょっと面倒な感じ。

リンクをキレイに表示できる、はてなの「ブログカード」をはてなブログ以外のブログサービスで簡単に使う方法
他のページへのリンクをスマートに表示できる「ブログカード」を提供元のはてなブログ以外で簡単に使う方法を紹介。もちろんライブドアブログもOKです。

そこで調べてみると便利なブックマークレットを作っている人を発見!これは便利。

はてなブログ ブログカードをブックマークレット化してみたよ
先日でこにくというサイトで見かけてちょいちょい使っていたのですけども、このためだけに拡張機能を入れるのはなんか違うなぁと思ったのでブックマークレット化。

という流れで、このブログでも今後はブログカードを使っていきたいなと思ったのでした。

SyntaxHighlight for MovableType.netリリース、そしてGitHubで公開。

ども、どもども。
2016年もいよいよスタートです。
今年もよろしくお願いします。

皆さん、MovableType.netって使ってますか?
私は個人的にも好きで、弊社案件でも使い始めています。

非常に良いサービスなんですが、まだサービス開始から1年ほどということで、いくつか要望みたいなものがあります。
そのうちの1つに「テンプレート編集画面で、HTML/MTMLがシンタックスハイライトされないので見づらいのをなんとかしたい」というのがありました。
うちのスタッフさん(Webデザイナー1年生)がテンプレート編集を頑張っているのを横目に見てて、シンタックスハイライトされていればもっと使いやすいんだろうな~と考えていたのです。

そこで、そのシンタックスハイライトを実現するChromeエクステンションを作ってみました!
Chromeにインストールしてもらうと、下のスクリーンショットのようにソフトウェア版のMovable Typeと同じようにシンタックスハイライトしてくれます。

Syntax Hightlight for MovableType.net

Syntax Hightlight for MovableType.net

続きを読む:
SyntaxHighlight for MovableType.netリリース、そしてGitHubで公開。

FONTPLUSの太字をTinyMCEのカスタマイズで解消

ども、どもども。
本日2度めのブログ記事投下。

FONTPLUSさんのWebフォントサービス、使ってますか?

FONTPLUS|フォントプラス

最近はレスポンシブデザインのウェブサイトを構築する機会が多くって、弊社ではFONTPLUSさんのサービスを利用させてもらっています。
扱いやすくリーズナブルでお気に入りのサービスですが、1つだけ困っていたことがありました。

フォントプラスでは、<b>タグや<strong>タグ、CSSのbold指定等により、文字を通常よりも太く表示することはできません。 以前、一部のブラウザに依存する問題でWebフォントを適用すると自動的に太字になるという現象があったため、回避策として、フォントプラスのWebフォントには太字が反映させないように対応いたしました。

【解決策】 太めの書体をご利用ください。

Q. 太字指定が反映されません。|よくある質問|FONTPLUS

解決策にあるとおり、この部分だけ別のフォントを指定して回避するのが良いと思いますが、Movable TypeのTinyMCEエディタでこれをどう実現するか考えました。
ちなみにTinyMCEでは<strong>タグで強調されるので、単純にそこにfont-familyを指定するのも良いかと思いますが、今回は別途classを設定したかったのでした。

続きを読む:
FONTPLUSの太字をTinyMCEのカスタマイズで解消

MT6.2とImageUploadUtilityProの複数画像アップロード機能比較

この記事はMovable Type Advent Calendar 2015の5日目の記事です。

今年は何を書こうかなーと悩んでいたのですが、なかなか良いテーマが見つからず...。
気が付くと前日になっていました(汗)...と、そんな時、あるお問い合わせが。

Movable Type 6.2の複数画像アップロード機能と、ImageUploadUtility Proの同機能で、どのような違いがあるのですか?

MT6.2がリリースされてからたびたびお問い合わせをいただくので、今回はこちらをテーマにしたいと思います。

MT6の複数画像アップロード機能との違い

標準のものとは以下の点が異なります。

  1. 画像をアップロードするタイミング
  2. 画像の並び替え
  3. 代替テキストの挿入
  4. 画像ごとの細かい設定
  5. エディタに挿入されるHTMLソース
  6. 画像をエディタに直接ドロップ(※追記)
  7. MT6.2.2の「アップロード先のカスタム」でキャンセル可能(※さらに追記)

これ以外にも細かい違いや、独自の機能(透かし画像の合成やPDFの画像化など)はありますが、今回はこの5つ6つ7つでご案内します。

続きを読む:
MT6.2とImageUploadUtilityProの複数画像アップロード機能比較

Vagrant環境にImageMagickをインストールしてみた

こんにちは、西山です。
ワタシ、Movable Typeを愛用しているのですが、ローカルでの検証などには「Vagrant」を利用しています。

Vagrant+VirtualBoxでMT6を動かしてみた。- 2013.12.18

なんですが、これまでぜんぜん気がついていないことがありました。
そう、利用しているVagrant環境にImageMagickが入っていないことに。
Movable Type用の画像アップロード補助機能プラグインとかリリースしているのに、検証はここ以外でもやっていたせいか、ぜんぜん気がついていませんでした...(汗)

プログラマさんに「試しにターミナルでidentifyってコマンド入れてみてらえますか?」と言われ...、ターミナルで、MTインストールディレクトリへ移動(cd hoge)し、Vagrant を起動(vagrant up)、vagrant sshでSSHアクセスして[vagrant@localhost]になって、identifyコマンドを実行してみると...

error while loading shared libraries: libMagickCore-6.Q16.so.1: cannot open shared object file: No such file or directory

というわけで、ImageMagickが入っていないことが判明(汗)
これをインストールする旅へ出発です!

続きを読む:
Vagrant環境にImageMagickをインストールしてみた

AWS Cloud Roadshow 札幌に参加してきた

こんにちは、西山です。
11月12日(木)に、ホテルニューオータニ札幌で開催されたAWS Cloud Roadshow 2015に参加してきました!

20151116103143.jpg

続きを読む:
AWS Cloud Roadshow 札幌に参加してきた

MovableType.netのデザインをGitHub連携でやってみる with SourceTree & Brackets

こんにちは、西山です。
ここのところ更新が滞っている感じですが、皆さんいかがお過ごしでしょう(汗)

さて、今日は「MovableType.netのデザインをGitHub連携でやってみる with SourceTree & Brackets」と題して備忘録を...。
上手く行ったことはこうやって書き記しておかないと、後で自分がわからなくなりそうで(笑)

各サービス/アプリケーションについては、その紹介を割愛させていただきますのでご了承ください。

MovableType.net
GitHub
SourceTree
Brackets

ではさっそく行ってみましょうー!
今日の手順はこちら

  1. GitHubでアカウントを作成する
  2. SourceTreeでローカルリポジトリを作成する
  3. MovableType.netでGit連携する
  4. 実際にコミット/プッシュしてみる
  5. BracketsでMTMLにシンタックスハイライトを適用する

続きを読む:
MovableType.netのデザインをGitHub連携でやってみる with SourceTree & Brackets

MTがもっと使いやすくなるセミナー開催レポート

こんにちは、西山です。
気が付くと3ヶ月ぶりのブログ更新(汗)
皆さん、おいかがお過ごしですか...

さて、先日(10月10日)、私が主宰させていただいているMovable Typeユーザーグループ MT蝦夷の主催で「MTがもっと使いやすくなるセミナー 〜管理画面のカスタマイズでここまで便利になるTips大公開スペシャル」が開催されました。

というわけで、開催レポートです!
(ブログ書くまでがMTCafe!)

20151012171040.jpg

セミナーの概要はこちら → http://peatix.com/event/112453/view

当日は3連休初日であるにもかかわらず、26名の方にご参加いただきました!
前半の3セッションは、シックス・アパート 長内さん、KDDIウェブコミュニケーションズ(CPI) 山田さん、アライアンス・ポート(3rdfocus) 山辺さんにご登壇いただき、各社さんのサービスや製品をご紹介いただきました。

シックス・アパートの長内さんからは、Movable Type 6.2の最新情報や開発メーカーだから話せるMT管理画面カスタマイズの基本を、CPIの山田さんからは9月29日に機能強化されたCPIのお話とMovable Typeがレンタルサーバー ACE01でサブスクリプション利用(月額定額)できるメリットなどについてご紹介いただき、アライアンス・ポートの山辺さんからは、3rdfocusというサービスで提供されているMT Cloud Starter Kit(MTAppjQueryやFreeLayoutCustomFieldがパッケージになった製品)の中身や利用方法をご紹介いただきました。

この3つの内容って、あまり札幌のセミナーなどで聞ける話ではないと思っていて、今回のイベントに合わせて依頼した甲斐があったと思いました!
個人的にも満足度の高いセッションとなりました。

そして後半は、このセミナーのメインテーマでもある「管理画面カスタマイズ」に的を絞ったセッションです。

FreeLayoutCustomFieldプラグインで カスタムフィールドを超強化

Movable Typeのプラグインを少しでも触ったことがある方なら、もちろんそのお名前を知っているであろう藤本 壱さんから、管理画面を強力カスタマイズできるプラグインFreeLayoutCustomFieldの機能面や、どんな時にどのようなカタチで利用できるかといった、具体的な事例をもとにご紹介いただきました。

例によってネタに使っていただきました(上記写真参考)が...今回は具体例としてすごく分かりやすかったと思うので、なんとも不思議な感覚です(笑)

運用ファーストなCMSサイト構築 〜運用と制作を楽にする MTAppjQuery〜

昨年のMovable Type プラデミー賞で大賞を受賞したMTAppjQuery、開発のbit partさんから「どんなシーンでどんな利用ができるか」とすごく分かりやすく紹介していただきました。
逆引き形式で紹介していただいたので、「こんな時はこの機能を」と具体的にイメージできて、大変良かったです!

参加者の方からは「今、こんな案件で困っていたのだけど、MTAppjQueryを使えば上手く解消できると解った」などの声を聞くことができ、さっそく役立ててもらえそうで良かったです。

---

本編終了後、私を含む3名がLTを行い、最後にはMT東京より「MTDDC Meetup TOKYO 2015」のイベント案内がありました。

4時間以上の長丁場にもかかわらず、参加者の方々は最後まで楽しんでいただけたようで大変良かったです!

 

MT蝦夷懇親会

そしてセミナーの後には、セミナー参加者の方々を中心に19名が集まり、MT蝦夷懇親会を開催しました。
登壇者の方々を囲みつつMovable Typeの導入やプラグインの利用に関する話をされていたり、同じ札幌の同業者として意見交換があったりとこちらも大変盛り上がりました。

20151012174103.jpg

写真は2次会の会場で食べたお刺身の盛り合わせです。

 

MT蝦夷では今後もセミナーなどのイベントを開催していきます。
最新情報はFacebookページか、Twitterのアカウントをフォローしてゲットしてくださいね。

MT蝦夷Facebook公式ページ:https://www.facebook.com/mtezo.net
MT蝦夷公式Twitterアカウント:https://twitter.com/mt_ezo 

 

登壇者の皆さん、参加者の皆さん、改めてありがとうございました!
では、次回のMT蝦夷イベントでお会いしましょう!

WCAN 2015 Summerに参加してきた

ども、どもども。
先週末7月12日に名古屋市で開催されたWCAN 2015 Summerに参加してきました!

20150714110055.jpg

こちらのイベントは、名古屋で定期的に開催されているWeb系事業に従事している方向けのセミナーイベントで、私は初めて参加してきました。
WCAN/イベントに関する詳細はこちらをご覧ください。

§ WebデザイナーのためのSPAsことはじめ - こもり まさあきさん

SPAs(Single Page Applications)に関する内容でした。
正直なところ、実例として紹介されたJavascriptコードの部分などはよく理解できなかったのですが、今後それがどう活用されていくか、Movable Typeにも実装されているCMS側のAPIとの関係性などは、近い将来のWebサイトをイメージしやすいお話でした。
6月に開催されたMTDDC Meetup TOHOKUで、スカイアークの小林さんが話されていた内容とリンクする部分があり、すごく納得させられる感じでした。

§ コンバージョンを考えたコンテンツ戦略とサイト設計 - 益子 貴寛さん

今回の会場は名古屋商科大学の新しいキャンパスで、なんと32:9の超大型スクリーンが利用できるところだったのですが、それに気がついた益子さんは、急遽スライド資料を32:9に編集!
そのため、すごく迫力のある感じになりました。(冒頭の写真がそれです)

内容はこれまで私がやってきたことの復習というか、できていないところを再確認させてくれる非常にためになるお話で、後日配布される資料をもとに改めて自分の今と照らし合わせてみようと思いました。

§ 進化を続ける検索エンジンから集客を続けるポイント - 辻 正浩さん

SEOについては私がこの仕事を始めた時にかなり時間をかけて勉強いてきた部分で、それだけに数年前頃の「なにやら怪しげなSEO」をひどく敬遠するようになり、かつて大好きだったそれは今ではあまり口にしないことでもありました。

ですが。

この方のお話は違うんですよねー。
そんなワタシでも素直に納得できるSEOに関するお話で、今回のお話の中心になった「モバイルフレンドリー」と「地域対応」については何度も頷くところがあり、非常にためになりました。

§ セミナーに参加して

名古屋のお客さんを訪問する予定があり、せっかく名古屋に行くのならと、このセミナーイベントにタイミングを合わせて出かけてきました。
正直なところ、ついでという気持ちが無かったと言えば嘘になります(^^;

でも、参加した後の今となっては、参加してかなりよかったなと思えるセミナーでした。
それくらい勉強になったと思います。

やはり、情報は取りに行かないと得られないものですね。
今後もチャンスがあればいろいろと参加してみたいです。

§ ところで...

ここ最近、セミナーイベントの参加レポートが、なにを食べたとかばかりになっていましたが、今回は少し真面目にレポートを書いてみました。

いかがです?(笑)

なに、物足りない。
欲張りだなー。

続きを読む:
WCAN 2015 Summerに参加してきた

mt:Entriesでハマった話

どもども。
久々にMTタグでハマったので忘れないようにメモ。
(ふつうのコトだったらごめんなさい)

今回の参考コードはこちら

<mt:Entries>
<mt:EntriesHeader>
<ul>
</mt:EntriresHeader>
<li><$mt:EntryTitle$></li>
<mt:EntriesFooter>
</ul>
</mt:EntriesFooter>
<mt:Else>
</mt:Entries>

上記のMTMLで再構築を行うとエラーになります。
その内容がこちら。

変更を保存しました。 テンプレートでエラーが見つかりました。
<mt:Entries>に対応する</mt:Entries>がありません(1行目)。

エラーが出ているのは<mt:Entries>?
閉じタグが無い?
さて、どこが間違っているか分かりますか?

続きを読む:
mt:Entriesでハマった話

一騎当千のIT/Web活用セミナーを開催しました!

ども、どもども。
本日2度めのブログ更新。
書かなきゃ書かなきゃと思っていたことを。

去る5月19日(火)に、「一騎当千のIT/Web活用セミナー」を開催しました!
こちらのセミナーは、ラジカルブリッジさんとの共催で行いました。

20150705162531.png

弊社(ジャクスタポジション)はWebサイト構築やコンサルティングをメインで行っているのですが、Webにかぎらず様々な相談を受けます。
その中でよくあるのが「業務効率化」に関するシステム開発の話なんですよね。
それをWebシステム/アプリ的な感じで開発することもあるのですが、スクラッチ(ゼロから)で作ると時間も費用もけっこうな感じで必要になってきます。
一見、それは弊社にとってみれば「大きなお金が舞い込むチャンス」と思いがちですが、そのプロジェクトを完遂するまでのリソース(人の手配やスケジュールの確保)ってのは、実は結構な負担になりえます。(これは弊社の体力的問題でもありますけどね)

そんな時に出会ったのがkintone
そしてこのkintoneのエバンジェリストなのが、ラジカルブリッジ 斎藤さんなんです。
これがあれば、弊社のお客さんの悩みなんかもかなりの確立で解決できちゃうんじゃないかなと思って、それでこのセミナーの開催に至ったのでした。

続きを読む:
一騎当千のIT/Web活用セミナーを開催しました!

Time MachineのバックアップをFinderから削除した?話

ども、こんにちは。
先月末なんですが、新しいiMacを買いまして。
すったもんだありつつ、つい先日やっと無事使い始めたわけですが、Time Machineのことを考えててふと気になったことが。

そういえば、もう手元にはないMacBook Airのバックアップがまだ残ってるんだよなーと。
無駄に容量使ってちゃってるし、これを削除したいなーと考えたのです。

20150703191401.jpg

どうやったらいいのかな?というわけでGoogle先生にいろいろと質問してみたのですが、「Time Machineに入って不要なファイルを削除する」とか「Time Machineで指定日以前のバックアップを全削除する」など、どれも意図しているところと少し違う感じ。
私は、Time Machineに残っている今は使用していない古いMacのバックアップファイルだけを削除したいのです。
上の画像のようにFinderからTime Capsuleに接続した際に出てくるバックアップ(拡張子:sparsebundle)のうちから1つだけ削除したかったんですよね。

ところがGoogle先生が示してくれた検索結果には「バックアップファイルをそのままゴミ箱に入れると、ゴミ箱を空にできないエラーが発生!これは間違った手順!」みたいなのがいくつも出てきて...。
このエラーを回避するためにはターミナルでコマンド操作(sudo rm -rf)しましょう!とか出てくる感じで。
なにをやっていいのか、なにをやったらダメなのかがさっぱり(汗)

続きを読む:
Time MachineのバックアップをFinderから削除した?話

Illustrator&Photoshopセミナーを開催しました!

こんにちは、どもども。
去る6月1日~2日、Illustrator&Photoshopセミナー in 札幌を開催しました!

20150627192207.jpg

ブログに書こうとして、随分日が経ってしまった(汗)

ことの始まり

4月に東京で開催されたCSSNiteに参加してきました。
こちらはWebディレクター向けの内容で、セミナーそのものも勉強になったのですが、その懇親会で書籍『Webデザインの現場ですぐに役立つ Photoshop仕事術』の話しになりまして。
内容がすごく良さそうだよねーって話で盛り上がり、札幌でもPhotoshopのセミナーとかないかなーって話に。

そこで思い切って、その会場にいた書籍の著者である鷹野 雅弘さんに相談してみました。

鷹野さんは『10倍ラクするIllustrator仕事術』(増強改訂版)の出版記念セミナーを全国で開催されていて、そのセミナーもまだ札幌開催が決まってなかったので、いっそ2つともやっちゃいませんか?と。

すると鷹野さん、即座に快諾してくれまして、とんとん拍子で話が決まっていきます。
同じく会場にいた書籍の共著者、黒葛原 道さんにも声をかけさせてもらうと、こちらも快諾!
宮崎にお住いの黒葛原さんは北海道に来たことがないってことで、ものの数十分のうちに札幌開催が決まったのでした。

慌ただしく進むセミナーの準備

開催が決まったのはいいものの、なんとそこから1ヶ月後の緊急開催となり、ここから怒涛のスケジュールが始まります(汗)
と言うのも、5月19日にもうちとラジカルブリッジさんで共催したセミナーがあって、もろもろの準備がほぼ同時進行になってしまったのです。
(そのセミナーの開催レポートはまた改めて)

迫る開催日、苦戦する集客...
ですが、いろんな方にお手伝いいただいて準備も進み、なんとか当日を迎えることができました!

続きを読む:
Illustrator&Photoshopセミナーを開催しました!

MTDDC Meetup TOHOKU 2015 に参加してきました!

ども、どもども。気がつけば3ヶ月近くぶりの更新。
年度末〜GW頃までは毎年忙しいのですが、今年はそれに加えてイベントなども重なり、すっかりご無沙汰してしまっておりました。

先週末、6月6日に仙台で開催されたMTDDC Meetup TOHOKU 2015に参加してきましたー。
仙台を訪れるのは昨年9月以来で、また牛たんが食べられるかと思うと...っと、そうじゃなくって、Movable Typeのユーザーイベントを楽しみに行ってまいりましたよ!

20150608195811.jpg

イベント前日の5日(金)に仙台入り。
あいにくの天候でしたが、それほど寒くも暑くもなく、暑がりな私としてはいい感じでした。

ホテルにチェックインしたあとは、移動中に連絡があった仕事の依頼をこなしつつ、翌日のイベントで話すライトニングトークの練習をしてみたり。
ここで気がついたんですが、新千歳空港のラウンジにライトニングケーブルを忘れてきた模様。ショック。

だがしかーし!
そんなめそめそした気持ちも、イベント関係者で開催された前夜祭で吹き飛ぶことに!

20150608200414.jpg

このお刺身の美味しそうなこと!実際に美味かった!肉厚ですげーっす!
宮城といえば魚もですが、やっぱり日本酒!もちろん笹かまぼこも食べましたよー!

20150608200844.jpg

この一ノ蔵、すごく美味しかった!
お店のご厚意で一升瓶が2本も出てくるなんて、すごいサービスです!

と、食べ物の話ばかりしていてもアレなんですが...
仙台ですからね、食べないと、牛タンを!

20150608201158.jpg

今回の牛タンは、味の喜助 定禅寺店で特切り厚焼定食を頂きましたよ。
失敗したのはこの写真の角度じゃ厚切り加減が伝わらないこと...早く食べたくて焦ってしまいました。

続きを読む:
MTDDC Meetup TOHOKU 2015 に参加してきました!

Google Chrome アプリ Movable Type Writer ver 1.0.2 を入れてみたよ!

ども、どもども。

Google製ブラウザ ChromeのアプリからMovable Typeへブログ記事を投稿できるMovable Type Writerがリリースされていたので、早速入れてみました。

画像のアップロードはドラッグ&ドロップでこれも便利ですね。
レンタルサーバーのスペックなどで不自由な思い(汗)をされている方も、ぜひ試していただきたい!

Director's Night vol.4 に参加してきました。

ども、どもども、西山です。
1月31日に開催された「どうやって進めてるの? 株式会社コンセントに聞くWebディレクションの秘訣 〜Director's Night vol.4 コンセント・スペシャル!」に参加してきました。

20150208170859.jpeg

少し前のセミナー・イベントになりますが、その参加レポートを。

続きを読む:
Director's Night vol.4 に参加してきました。

YosemiteでVagrantが起動しなくなった

こんにちは、どもども。
すごく今更感がありますけど、昨年末やっとYosemiteにアップグレードしました。

20150115172044.png

ご覧のとおりワタシのMacBookAirはメモリ4GBなんですが、とりあえず問題なく動いています。

そして、今日、ひさびさにVagrantを使おうと思ってターミナルからコマンドを入れて気がつきました。(Vagrantの導入記についてはこちら

Vagrantが息をしていない...

続きを読む:
YosemiteでVagrantが起動しなくなった

Movable Typeで17万件のスパムコメントを一括削除した話

あけましておめでとん。
今年もよろしくお願いします。

2015年最初のブログ記事。
今年の抱負とかー...、目標とかー...、書くべきことってありそうですよね。
それはまた落ち着いたらってことで(笑)

新年早々、涙そうそう。

Movable Typeのお悩み相談をお寄せいただきました。
コメントが174,693件もあるんだけどそれがほとんど全てスパムコメントで...それを簡単に削除したい!と。

 

( ゚д゚) ...

(つд⊂)ゴシゴシ

( ; ゚д゚)...イチジュウヒャクセンマン...

(つд⊂)ゴシゴシ

( ; ゚д゚)...174,693件...(滝汗)

 

こりゃ大変だ。
というわけでこれをサクッと削除してみました。

続きを読む:
Movable Typeで17万件のスパムコメントを一括削除した話

DynamicPreviewプラグインのリリース予告!

この記事は「Movable Type Advent Calendar 2014」の16日目の記事です。

こんにちは、西山です。
アドベントカレンダーからお越しで、初めましての方もこんにちは。

さて、2014年もMovable Typeのプラグインが数多くリリースされましたが、そんな中でも7月にリリースされた「FastestPreview(Taku AMANOさん作)」はその利便性が高く、すでに利用者も多いようですね。

実は弊社(ジャクスタポジション)でも同じ頃、Movable Typeのプレビュー機能を強化するプラグインを開発していました。
その名を「DynamicPreview」と言いまして、来年1月にリリースすべく準備を進めております。
今日はそのDynamicPreviewについてご案内したいと思います。

続きを読む:
DynamicPreviewプラグインのリリース予告!

MTDDC Meetup TOKYO 2014 に参加&登壇してきた(2)

ブログを書くまでがMTDDC

さて、旅行記と化した第一部
ここからは今回の目的であるMTDDC Meetup TOKYOの参加レポートを書き記して参りますよ。

3日目

いよいよ本番当日。
私はモニタチェックをしたかったので、少し早めに会場に入りました。
会場は東京六本木の「東京ミッドタウン」、しかもあのYahoo!Japanさんのセミナールーム。
思い切り御上りさん状態で会場に向かいました。

20141203145620.jpg

おおお、間違いなくYahoo!さん。
出発前に札幌支社の方に「受付にこれがあるかも!」と言われ、超期待していたのですが、残念ながら数日前に撤去されてしまっておりました。
いや、仮にこれがあったとしても、乗ってみたいとは思っても乗っているところを見られるのはちょっと...なので良かったのかも(笑)

20141203165409.jpg

続きを読む:
MTDDC Meetup TOKYO 2014 に参加&登壇してきた(2)

SaCSS Vol.58 でお話してきました。

ども、どもども。

去る9月27日(土)、札幌市民ホール会議室で開催されたSaCSS Vol.58 ディレクション関連特集に登壇させていただきましたー。
イベントの詳細はこちら →http://connpass.com/event/8307/

20140929121430.jpg

当日は60名近くの参加者の方々にお越しいただき、大盛況でしたね。
一番最初にお話させていただいたのですが、なかなかの緊張感でした(笑)

続きを読む:
SaCSS Vol.58 でお話してきました。

Webフォントを使ってみた。

ども、どもども。

機会があったら使ってみたい!と思っていたFontPlusさんのWebフォント。
近々構築するサイトで導入することになって、ものは試しということで自分のブログに入れてみたよ。

続きを読む:
Webフォントを使ってみた。

DNSサーバー、Webサーバー、Mailサーバーを分離してみる

ども、どもども。

先日、独自ドメインでWeb/DBサーバーとMailサーバーを分離して運用したいという相談がありました。
その利用方法が可能なのはもちろん知っていましたが、自分で設定したことが無かったので、今回それに挑戦してみることにしました。
思っていたよりも簡単に設定できたのですが、Web上にもあまり具体的な説明が見つけられなかったので、今回はその手順を残しておこうと思います。

今回の構成はこちら。

DNSサーバー:ムームードメイン(ムームーDNS)
Web/DBサーバー:CPI ACE01
Mailサーバー:さくらのメールボックス

ちなみにワタシは普段、Webディレクターとしての仕事をしているのですが、正直なところこのあたりの情報には疎いので、途中で説明が間違っていたり、不足があったりするかもしれませんが、その点はご了承ください(^^;

また、当然ですが、同じようなことをされる際もあくまで参考としていただけるようお願いします。

ざっくりと以下の手順になります。

  1. ムームードメインでドメインを取得、ムームーDNSをセットアップ
  2. ムームードメインでネームサーバーをムームーDNSに変更
  3. CPI ACE01でサーバーを契約、取得したドメインで運用できるよう設定
  4. さくらのメールボックスを契約、独自ドメインで運用できるよう設定
  5. ムームーDNSで各レコードを設定
  6. DNSの反映後、メール送受信とWebサーバーへのアクセスを確認

では、さっそく進めていきましょう!

続きを読む:
DNSサーバー、Webサーバー、Mailサーバーを分離してみる

お名前.comでMXレコードを編集する

こんにちは。どもども。

あるドメインで、メールをGoogleAppsで管理することになって、DNS設定を変更する必要が出てきました。
ドメインを管理している「お名前.com」でMXレコードの設定変更を行います。
以前にも同じ操作を行ったのですが、確か同じ所で躓いたので、今回もメモ。

GoogleApps側でも以下のようにアナウンスされてます。

MX レコードの設定: お名前.com


さて、まずはお名前.comの「ドメインNavi」にログインしましょう。
ログインできたら、「ドメイン設定」へ移動し、「ネームサーバーの設定」から「DNS関連機能の設定」へ進みます。
そして、「DNSレコード設定を利用する」の「設定する」をクリックして、次画面で操作するドメインを選択して「入力画面へ進む」をクリック。
いよいよここから設定開始です。

続きを読む:
お名前.comでMXレコードを編集する

FacebookのiPhoneアプリは日本語URLが開けないらしい

ども、どもども。

昨夜のことなんですが、Facebookの公式iPhoneアプリで日本語URLのWebサイト/ページをシェアしてもアプリ内のブラウザでは表示できないことを知りました。

例えばこんな感じのURL
※実際にシェアしたのはこちらではないのですが...例として取り上げてすみません(汗)

Jimdoで日本語メニューのままURLを英語にする方法

↓こんな感じですね

20140820091519.jpg

これをタップして開いても、アプリ内ブラウザでは何も表示できません。
↓こんな感じ

20140820091739.jpg

ちなみに、通常であれば右下の 20140820091950.gif から「サファリで開く」という方法が取れるのですが、上記の状態ではそれもできませんでした。

調べてみると、少し前まではサファリそのものでもURLに日本語が含まれる場合、正常に開けない場合があったようです。

iPhone:アプリにペーストした日本語URLが開けないという人はこうするだけで解決できるかもって話
(ちなみに今日試したところ、現在はURLを直接コピー&ペーストでも開けました)

続きを読む:
FacebookのiPhoneアプリは日本語URLが開けないらしい

Movable TypeのWebサービスパスワードを確認する方法

はい、こんにちは。
Movable Typeで構築されたWebSite(ブログ)に、外部投稿サービスなんかから投稿しようとした際、Webサービスパスワードというのが必要になることがあります。

このWebサービスパスワードなんですが、何回やっても「あれ?どうやって確認するんだっけ?」という事態に陥ります。
主にワタシが。

なので、その方法をこちらでまとめておこうと思います(つまりメモです)

<追記> Webサービスパスワードとは、外部ツールなどからMovable Typeに記事を投稿する際に、mt-xmlrpc.cgiにアクセスするために必要となるパスワードのことです。 MTユーザー(ログインアカウント)ごとにMovable Type側で設定しておく必要があります。※初期値が設定されています。

続きを読む:
Movable TypeのWebサービスパスワードを確認する方法

MT用HTML Tidyプラグインを試してみた。

どもども。
深夜作業を終えて、ふとソーシャルに目をやるとこんなプラグインの記事が。

HTML Tidyをオンラインで利用するWebサービスとMTプラグイン

どんな感じなのかな?ということでインストールしてみました。
(機能面などについては上記ブログをご参照ください)

続きを読む:
MT用HTML Tidyプラグインを試してみた。

CSSNite in SAPPORO Vol.14「選ばれるECサイト」に出演したさ。

どもども。

今しがた、うちのスタッフブログにも書いたんですけどね、こっちのブログに慣れると、あっちのブログの書き方が堅っ苦しく感じてしまって(笑)
こちらでも書こうと思ってたんだけど、まぁどっちかというと、もうちょっと個人的な感じで。

そう、先週の日曜日(7月6日)に開催されたCSSNite in SAPPOROでショートセッションを担当させてもらったんですよ!

20140711202258.png

出演者の皆さんが決まった後に、地元札幌枠みたいな感じでねじ込んでいただいたので、扉絵には載ってませんけどね(笑)
お声がけいただいた益子さん、ありがとうございます!

ちなみに、公式サイトの真ん中あたりに載ってますよ。

続きを読む:
CSSNite in SAPPORO Vol.14「選ばれるECサイト」に出演したさ。

Keynote発表時のディスプレイ解像度

こんにちは。

前回の記事に書いたとおりここ1年半ほど、様々なイベントなどでプレゼンさせていただいたり、発表させていただく機会が増えていました。
その際に悩んでいたことの1つがiPhoneのKeynote Remoteアプリでのリモート・コントロール。

そしてもう1つが、スライドの画面サイズについてでした...。
「は?」と思われた方もいるかと思うのですけど、無知であった恥を承知で書きます(汗)

最初の頃は特に困っていなかったんです。
でも、いつの頃からだったか、スクリーンに映るスライドが小さくなった気がしていたんですが、Keynote初心者のワタシは原因がよくわからず...。
イベントの度にスタッフの方や出演者の方に「画面小さくないっすかね...」と聞いていたんですが、「そう?」という答えばかり。
でも気になって気になって...。

そんな時、株式会社スイッチの鷹野さんのこんな記事を目にしました。

外部ディスプレイに接続時、希望する解像度がリストに出てこないとき
主にプレゼンなど、出先で外部ディスプレイに接続する際、[ディスプレイ]環境設定の[解像度の設定]のリストに、希望する解像度が出てこないことがあります。
この場合には、optionキーを押しながら[変更]のラジオボタンをクリックします。

これで悩みが解決できるかも!
と思ってさっそく試してみました。

続きを読む:
Keynote発表時のディスプレイ解像度

新しい装備を手に入れた

以前より仕事でプレゼンをする機会がそこそこあったわけですが、ここ1年半ほどはイベントやちょっとした勉強会などでも登壇させていただく機会が増えてきました。
お声がけいただけるのはホントありがたいことですよねー。

そのようなプレゼンの時、私はKeynoteというプレゼンツールを使う機会が多いのですが、壇上でパソコンとにらめっこしちゃうのがアレなので、iPhoneのリモートコントローラー(KeynoteのiPhoneアプリ)を使用してスライドを操作していました。

ただ、このリモート機能はどうにも本番途中で使えなくなる(Mac本体との接続が切れちゃう)ことが多くて、仕方なくキーボードを操作することも多かったわけです。
iPhoneアプリが無料(私が使い始めた時は85円でした)ということもあって、なんとか騙し騙し使ってきたのですが...。

2014.06.15 追記
ワタシは今までKeynote Remoteアプリを使用して、Wi-Fiでの接続かアドホックでの接続を利用していたのですが、新しいKeynoteアプリでBluetooth接続にすると切れないという話を聞きました。それも今度試してみます!

そんな私ですが、実は7月にあるイベントに参加させていただく機会をいただきまして。
それで、その場でリモートが使えなくなるなんてことがあってはちょっと残念過ぎる!ということで...今回、新たな装備を手にしました。

続きを読む:
新しい装備を手に入れた

Movable Type 6 ハンズオンセミナーのレポート

こんにちは。

もう2週間も経ってしまいましたが...。
先月24日(土)、Movable Typeユーザーグループ MT蝦夷の主催で、「Movable Type 6 ハンズオンセミナー」が開催されました。

ワタシ、このMT蝦夷の主宰になっておりますので、参加レポートというのもおかしな話なんですが、どこかにまとめておきたいなという思いでこちらに書いていきます。

MT6ハンズオンセミナーの開催概要についてはPeaTixのサイトをご覧ください。

続きを読む:
Movable Type 6 ハンズオンセミナーのレポート

phpMyAdminでMTの記事IDを任意の数値に変更してみた

こんにちは。
先日(5/24)、Movable Type 6 ハンズオンセミナーをMT蝦夷主催で開催しました。
そのレポートを書こうかとこのブログを開いて、ふと気がついたことが。

そのハンズオンの中で、Data APIを利用するために400件以上の記事データをインポートしていたので、記事IDが激増してしまっていたんです。

記事IDが増えてしまうことは良いのですが、使用していないIDが大量にあるのは気持ちよくない。
そこで、昔はよくやっていた「MySQLで任意のテーブルのAuto_incrementをリセットする方法」で、任意の数字に変えてみようと思いました。

続きを読む:
phpMyAdminでMTの記事IDを任意の数値に変更してみた

ImageUploadUtilityのアップデート

うち(ジャクスタポジション)では、ImageUploadUtilityっていうMovable Type用の画像アップロード機能補助プラグインを販売しております。

このエントリーは、そのプラグインのアップデート(新機能追加)のちょっとしたお知らせをテストを兼ねて投稿してたりします。

続きを読む:
ImageUploadUtilityのアップデート

SiteStatsTermChangerを入れてみた

先日、アルファサードの野田さんが「MT6のダッシュボードの「サイト情報」ダッシュボードは個人ブロガーにはちょっと...」とブログで書いたところ、それに応える?カタチで、小粋空間さんでこちらのプラグインが公開されておりました。

Movable Type 6のダッシュボードのサイト情報期間を変更できる「SiteStatsTermChangerプラグイン」:小粋空間

おー、これはちょっと良さそう!というわけでさっそくインストール。
(下はこのブログの情報です)

スクリーンショット 2014-05-01 12.47.02

現在は2ヶ月分が表示できるようですが、今後はこれも変更できるようになるみたい。
これは書いてる人のモチベーションも上がりそう。
書けば読まれる、みたいな体感ができると面白いですもんね。
あと、アドセンスなんかやってみたら、その収益との関係性なんかも見えるかも。
GoogleAnalyticsでコンバージョン設定して、その関係性を見るのも面白そう。

というわけで、MoreAnalytics同様、面白そうなプラグインです。

Movable Type6.0.2から6.0.3への移行の「あるある」?

4月9日、Movable Typeのセキュリティアップデートがありました。

[重要] 6.0.3、5.2.10、5.17 セキュリティアップデートの提供を開始(2014.04.09)
http://www.sixapart.jp/movabletype/news/2014/04/09-1100.html

その後立て続けに「MTをアップグレードしたらブログの表示がおかしくなった」というヘルプがあったのですが、ちょうど今日、このブログをアップデートしてて同じことをやったので記録的にメモ。

続きを読む:
Movable Type6.0.2から6.0.3への移行の「あるある」?

MTCafeSapporo Vol.5を開催したよ

20140406164520.png

先週の金曜日(4月4日)に、MTCafeSapporo Vol.5 を開催しました。
年度初めの忙しい時に...という声もありましたが(汗)

ご存じない方のために簡単にご説明すると...、MTCafeは「誰でも気軽に参加できるMovable Type(MT)のユーザーコミュニティ」のことです。

そもそもMovable Typeって?という方はこちら
CMS プラットフォーム Movable Type - コンテンツがもっと広がる、つながる - Six Apart

ここ北海道札幌では、昨年10月にMTDDC Meetup HOKKAIDO 2013が開催されるのに合わせて、イベント実行委員会のコアメンバーがMT蝦夷というグループを作り、昨年度4回のMTCafeを開催しました。
そして、2014年度1回めのMTCafeとしてキックオフ懇親会を開催したという流れです。

続きを読む:
MTCafeSapporo Vol.5を開催したよ

このブログでソーシャルメディア対応としてやったこと

ソーシャルメディアの利用が一般的になってきて数年。
Webサイトの運営でも、いわゆる「ソーシャルメディア対応」なんていう言葉が普通に使われてますよね。

例えば、twitterのツイートボタンを設置したり、Facebookなどで大切になってくるOGP(オープングラフ・プロトコル)を設定したりするのは最低限必要なところかな、と思います。
LINEに送るってのもありますが...とこの話はまた別の機会にでも。)

このブログでも、公開にあたって一番気にしたのはそこでした。
デザインや機能も大切なんですが、そこは「まず公開することを優先した」感じですね。
思い立ってから公開できるようになるまで2〜3時間だったかな...という感じです。

公開前にやったことは...

  1. ブログテンプレートの一部カスタマイズ(ソーシャルメディア対応など)
  2. CSSなどの一部調整(ホントに少しだけ^^;)
  3. プラグイン2種のインストール(ImageUploadUtility / SetDefaultCategory

という感じです。

今日はそんな中から、ソーシャルメディアへの対応について何をしたかをご案内します。

続きを読む:
このブログでソーシャルメディア対応としてやったこと

Loupeから写真をアップロードしてみる

先の投稿に続けて、またもやモバイルとMovable Typeについて。

今回はMT6で実装されたLoupeを使用してみました。
Movable Type 6にアクセスするとダッシュボードに出てくるコレですね。

20140322175448.png

続きを読む:
Loupeから写真をアップロードしてみる

iPhoneから管理画面にアクセス

さてさて、このブログはMovable Type 6で作られているわけですが。

このMT、version5.12からは、スマートフォンで管理画面にアクセスした際に最適化表示してくれるようになってます。
(正確に言うと5.2.6から本体同梱)

どんな感じかと言うと、こんな感じ。


サインイン画面

20140322112839.jpg

続きを読む:
iPhoneから管理画面にアクセス

アクセスの多い記事