www.ni4.jp

カテゴリ:Webの記事一覧

小樽市のウェブサイト制作会社7社と、ウェブサイト構築を依頼する時の5つのポイント

ども、どもども。
ジャクスタポジション 西山です。

弊社(株式会社ジャクスタポジション)は今から20年ほど前に、ウェブサイトの構築事業をメインに小樽市で創業しました。
現在は所在地を札幌市に移していますが、今も小樽市内の事業者さんとお取引をさせていただいているほか、個人的には小樽青色申告会連合会の常任理事を務めさせていただいたり、過去には小樽商工会議所さんの専門家派遣を通して小樽市内の事業者さんのところに訪問させていただいたこともありました。

そんなこともあって小樽への思い入れは強いほうと自負しているのですが、小樽市の事業者さんがウェブサイト制作会社を探そうと検索した際、検索結果に出てくるまとめ記事では所在地を北海道外に置く企業も多く掲載されていて、一部には小樽市内の事業者が一切掲載されていない記事まで見受けられることがあり、少し残念に感じていました。

そこでこの記事では「小樽市にゆかりがあるウェブサイト制作会社」だけをピックアップして、制作会社の目線で紹介していきたいと思います。

弊社創業当時と比べて状況も変わり、弊社含め同業者の方々にも個性が出てきた感じがありますので、小樽市でウェブサイト制作を依頼したいとお考えの事業者さんは、それぞれの会社さんの紹介とウェブサイトをご覧いただき「お!」と思ったところに問い合わせてみてはいかがでしょうか。

この記事がその参考になれば幸いです。

続きを読む:
小樽市のウェブサイト制作会社7社と、ウェブサイト構築を依頼する時の5つのポイント

DKIM署名とDMARCポリシーで、メールの信頼性を高めてみよう

ども、どもども。
気がつくと2024年も3ヶ月が過ぎ、4月に入っていました。
あけましておめでとうございます…。

さて、1年ほど前になりますが、Gmailにメールが届かないときは、SPFレコードをDNSに登録しようという記事を書きました。

この記事では、独自ドメインを使用したメールがGmailに届かなくなってしまった場合への対処として、SPFレコードを登録する方法について書いていました。
送信されたメール(ドメイン)が、その送信元として許可されているメールサーバー/ウェブサーバーから送信したものであることを、受信側で確認できるようにする仕組みです。

これで独自ドメインを使用したメールがGmailに届かなくなることはなくなりましたが、その後、Gmailのガイドラインがアップデートされ、Gmailに対し1日5,000件以上のメールを送信する場合には、SPFレコードに加え、DKIM(ディーキム)レコード/DMARC(ディーマーク)レコードの登録が必要と変更されました。

Gmail宛に1日5,000件もメールを送信することは現時点では考えにくかったので、特にこの設定はしていなかったのですが、弊社でも利用しているオンライン決済サービス Stripeから、このようなメールが届きました。

Stripe をご利用いただきありがとうございます。
この度、カスタムメールドメインの設定が変更されることをお知らせいたします。現在、お客様のメールはカスタムメールドメインから送信されていますが、ご利用のドメイン juxtaposition.jp に有効な DMARC ポリシーが設定されていませんので、以下の内容をご確認ください。

変更点
2024 年 2 月より、Google と Yahoo は迷惑メールに対処するための変更を順次実施しています。一括メール送信者に義務付けられる要件の 1 つに、SPF と DKIM と共に有効な DMARK ポリシーを併用してメールの認証を実行することがあります。
Stripe では、貴社のカスタムドメインから送信されるメールの認証に、すでに SPF と DKIM を使用しています。今回の新しい要件に完全に準拠するには、カスタムメールドメインを利用するための有効な DMARC ポリシーを保持していただく必要があります。

必要なご対応
ご利用のドメイン用の DMARC ポリシーをできる限り早く公開してくださいますようお願いいたします。このご対応により、お客様から Google および Yahoo のメールユーザーへのメール送信が中断されずに継続されます。DMARC ポリシーの設定方法については、Stripe のドキュメントをご覧ください。
2024/04/10までにご対応いただけない場合、お客様のメールの送信元はカスタムメールドメインではなく、stripe.com となります。

弊社製品の購入時、Stripeのクレジットカード決済/コンビニ決済を利用してお支払いいただいた際に、Stripeから送信されるメールを juxtaposition.jp で送信するようにしていたのですが、この機能(カスタムドメイン)を引き続き利用するにはDMARCポリシーの公開(DMARCレコードをドメインに登録する)が必要とのことでした。

これを良い機会と考え、Stripeでカスタムドメインに設定していた juxtaposition.jp に加え、同じく運用している juxtaposition.co.jp にもDKIM署名とDMARCポリシーを設定することにしました。

弊社では、ドメイン管理に「お名前どっとこむ」を、メールサーバーに「さくらインターネットのサーバー」を利用しているので、この記事ではそれらにあわせた内容で、設定を進めた手順をまとめておこうと思います。

続きを読む:
DKIM署名とDMARCポリシーで、メールの信頼性を高めてみよう

Facebookが不正アクセスで乗っ取られ、アカウント停止処分を受けました。

ども、どもども。
…と、いつも通りな感じで書き始めましたが、心中はいつもどおりではありません…!

実は、7月21日(金)の深夜に、10年以上利用していたFacebookアカウントの乗っ取り被害に遭い、それ以降、Facebookにまったくアクセスできない状況が続いているのです。

WEB関連の仕事していて、なんなら「コンサルティング業務」なんかもやっている私ですが、大変お恥ずかしい話ながら、何をしていてもやられるときはやられるんだな、と。
今は「まさか自分が…」という気持ちで、心がかなりざわついております。

少し気持ちの整理ができてきたので、不正アカウントがあったときのことから、アカウントが停止された後になにをしているかなど、この記事でまとめて行こうと思います。
この記事を書き始めた7月26日(水)現在、まだ復旧の目処は立っていませんが、進捗があり次第、追記していくカタチで残していきたいと思います。

続きを読む:
Facebookが不正アクセスで乗っ取られ、アカウント停止処分を受けました。

GDPR対応もOK!「ウェブサイト向けCookie同意管理バナーツール」の導入と動作確認をしてみた。

ども、どもども。
先日このブログで、「日本企業のウェブサイトに求められるCookie利用同意確認とCookieポリシーの設置」という記事を書きました。

その記事にもあるとおり、日本国内のウェブサイトであっても、GDPRの適用対象となる場合や、改正個人情報保護法が定める「個人情報の第三者提供」を行うと認められる場合、ウェブサイト閲覧時にCookieを発行することに同意を得る必要があります。

GDPR以外へも対応が必要な場合や、ウェブサイト上でどのようなCookieを発行しているかが不明な場合などは、OneTrustなどのCMP(Consent Management Platform)を利用するのが安心かと思いますが、GA4+GoogleTagManagerでアクセス解析等を実施しているだけのような場合には、ユーザーローカル社が無料提供している「Webサイト向けCookie同意管理バナーツール」の利用も選択肢の1つと思います。

そこで今回、このブログ記事では、ユーザーローカル社の「Webサイト向けCookie同意管理バナーツール」について、その導入方法と、導入した際のGA4+GoogleTagManagerの動作(Cookieの発行状況)について、まとめていこうと思います。

続きを読む:
GDPR対応もOK!「ウェブサイト向けCookie同意管理バナーツール」の導入と動作確認をしてみた。

日本企業のウェブサイトに求められる「Cookie利用同意確認とCookieポリシーの設置」

ども、どもども。
先日、クライアント企業さんから、自社のウェブサイトにもCookie利用確認のボタンを設置したほうが良いだろうか?と相談を受けました。

Cookie利用確認のボタンの例

ここ数年でよく見かけるようになったこのボタン、EU加盟国で施行されたGDPRや、改正個人情報保護法への対応として設置されているものですが、どのようなときに必要となるかなど、明確に説明できるほど理解できていませんでした。

そこであらためて、GDPRのこと、改正個人情報保護法のこと、ウェブサイトでこのボタン(Cookie利用同意確認ツール)が必要になるケースを勉強し直したので、このブログにも残しておこうと思います。
だいぶ長くなってしまいましたが、一通り理解できたのかなと思います。
間違いなどがあったら、優しく指摘してもらえると喜びます!

続きを読む:
日本企業のウェブサイトに求められる「Cookie利用同意確認とCookieポリシーの設置」

【MovableType.net新機能】月間50回まで使えるAIタイトル提案機能で、ブログのタイトル選びを効率化!

ども、どもども。
このブログでも使用しているMovableType.netに、新たな機能が追加されました!

最近話題のAI、ChatGPTを利用した新機能!
昨年夏のMidjourney以降、私もちょこちょことAIを触っていて、ChatGPTでもいろいろと試していました。
そんな話題の新機能なので、さっそく試してみましょう!

続きを読む:
【MovableType.net新機能】月間50回まで使えるAIタイトル提案機能で、ブログのタイトル選びを効率化!

Macのローカルサーバー構築手順【PHP追加編】

ども、どもども。
というわけで、前回の記事では、MAMPを利用したローカル環境構築と、そこからのメール送信部分までを進めました。

ただ、前回記事の最後にあったとおり、MAMPでは現在、パッケージに同梱されているバージョンのPHPしか利用できないようで、それ以外のバージョンを利用したい場合は、自分でインストールするしか無いようでした。
いろいろ検索するも、同梱されているバージョンの切り替えは見つかるのですが、そもそも同梱されていない場合の手段が見つかりません。

そんな中、私と同じように困っていた方の記事を発見し、そこから Adding Versions of PHP to MAMP on a Mac( 訳:MacのMAMPにPHPのバージョンを追加する ) という情報を見つけました。

これなら行けるかも!と試した結果、ダウンロードしたパッケージに同梱されていなかったPHP 8.0.28 の導入に成功したので、今回はその流れを備忘録として残しておこうと思います。

続きを読む:
Macのローカルサーバー構築手順【PHP追加編】

Macのローカルサーバー構築手順【SSL/バーチャルホスト編】

ども、どもども。
前回前々回と、MAMPを利用したローカル環境の構築と、利用するPHPバージョンの変更を実施してきました。

続けてこの記事では、ローカル環境へのhttpsアクセスの設定と、SSL証明書の導入、そしてバーチャルホストを利用した複数環境の作成を進めていきたいと思います。

ローカル環境ではSSL証明書はなくとも良いかもしれませんが、ブラウザに警告(Chromeだと「保護されていない通信」)が表示され続けるのは落ち着かないので、SSL証明書を導入してみることにしました。
また、私のようにウェブサイト構築の仕事をしていると、ウェブサイト毎に開発環境が用意されていたほうが、なにかと便利だと思うので、今回はバーチャルホストの設定までやってみることにしました。

参考になるウェブサイトや記事はたくさんありますが、ここも自身の備忘録として、まとめておこうと思います。

続きを読む:
Macのローカルサーバー構築手順【SSL/バーチャルホスト編】

Macのローカルサーバー構築手順【MAMP導入編】

ども、どもども。
普段、ウェブサイト制作会社でディレクターとして仕事をしている私ですが、自社で開発・販売しているSKELETON CART(ショッピングカートシステム)やMovable Type用プラグインで、リリース前の動作確認をすることも、私の仕事になっています。

新機能などの動作確認であればよいのですが、PHPのバージョンアップなど、サーバー環境に変化があった際の動作確認は、それと同じ環境を用意することが私には難しい場合も多く…。
そのようなときは開発担当に動作確認をお願いしていたのですが、業務の都合などでなかなかスムースに進められないことも多く、負担になっていないか、気になっていました。

そこで今回、数年ぶりにローカル環境を整えてみようと思い立ち、以下の条件を満たせる環境を構築してみました。

最終的に目標は達成できたのですが、いろいろな作業をして初めて知ることも多かったので、いつものように「未来の自分への備忘録」として、ブログ記事にしておこうと思います。

続きを読む:
Macのローカルサーバー構築手順【MAMP導入編】

macOS版Chromeブラウザの言語設定は「システム環境設定」で変更できる

ども、どもども。
先日書いた Gmailにメールが届かないときは、SPFレコードをDNSに登録しよう という記事を、その道のプロの方が読んでくれて、「とても読みやすい」と言ってくれたことが嬉しい、そんなワタシです。

さてさて、このブログでも利用している Saas型CMS「MovableType.net」、その関連サービスに MovableType.netフォーム がありますが、このフォームは多言語対応が可能になっていて、日本語の他に英語と中国語(繁體中文/台湾)に対応しています。

言語設定を「英語」にしたフォームのサンプル

先日、クライアントさんから「英語版のフォームを用意したい」と依頼があったのですが、作ってみるとエラーがあった際のメッセージが日本語で表示されてしまうことに気が付きました。

英語設定なのにエラー部分に日本語が…

ちゃんと英語設定になっているのかな?と不安になり、シックス・アパート社の早瀬さんに確認すると、以下のマニュアルを教えてくれました。

MovableType.net フォームに入力時、「必須」にした項目が未記入、または未選択の場合に表示されるエラーメッセージは、フォーム作成時に設定した使用言語とは関係なく、ブラウザに設定された言語で表されます。
https://movabletype.net/support/form/alart-setting-lang-japanese.html

私はMacでChromeを使用しているので、それならとMac版Chromeの言語設定変更を検索してみたのですが、見つかった情報はどれも上手くいきません。
そんな中、以下のようなヘルプを見つけました。

Mac または Linux の場合:  Chrome は、パソコンで使用しているデフォルトのシステムの言語で自動的に表示されます。
https://support.google.com/chrome/answer/173424

もしかしてMac本体の言語設定を変更するのか?…これはなかなかハードルが高い…と思っていると、タイミングよく鷹野さんのツイートを目にしました。

これを試してみたところ、MovableType.netフォームの英語設定と中国語設定もちゃんと確認できたので、今日はその方法を残しておこうと思います。

続きを読む:
macOS版Chromeブラウザの言語設定は「システム環境設定」で変更できる

Gmailにメールが届かないときは、SPFレコードをDNSに登録しよう

ども、どもども。
札幌のウェブサイト制作会社 ジャクスタポジション 西山です。
先日リニューアルしたウェブサイト、さり気なく宣伝してみました。

さて、2022年の3月〜4月頃から、以下のようなご相談をいただくことが増えました。
Googleなどで検索してみても、多くの方が同じような状況になっており、対応策もいろいろと案内されています。

  • 独自ドメインを使用したメールアドレスから、Gmail宛にメールが送れなくなった
  • Gmail宛に届いたメールに「ご注意ください」や「問題がある」と警告が表示されている
  • メールフォームやショッピングカートなどのプログラムから、Gmail宛にメールが送れなくなった

先日も同じようなご相談があったので、私が実施した対応を、自身の備忘録としてまとめておこうと思います。

続きを読む:
Gmailにメールが届かないときは、SPFレコードをDNSに登録しよう

弊社ウェブサイトをリニューアルしました!

ども、どもども
今日は12月30日(金)、2022年も残すところあと2日となりました。

そんな年末ではありますが、つい先日の2022年12月28日(水)に、弊社ウェブサイトをリニューアルしました!
このリニューアルにあわせコンテンツを一新、ドメインも新たに取得した juxtaposition.co.jp でスタートしています。

これまでのウェブサイトは2008年6月に公開されたもので、当時はまだ法人化前だったこともあり、すべてを私1人で担当していましたが、今回は弊社メンバーに協力してもらうことで、それぞれの良いところを引き出せた、とても良い感じのウェブサイトになったと思っています。
14年半前には実施していなかった「念願のレスポンシブ対応」も行い、やっとウェブサイト制作会社らしいウェブサイトになったとも思います(苦笑)
本格的な構想開始から9ヶ月、構築着手からは4ヶ月半ほどで公開することができましたが、年末にかけ忙しいスケジュールの中、細かい要望に最後まで応えてくれたメンバーにはとても感謝しています。

なお、現在もまだ旧ウェブサイト www.lat43n.com の閲覧が可能ですが、年明け数週間後にはクローズする予定となっています。

今回のリニューアルでは、私たちがこれまでに行ってきたウェブサイト制作業務で培ってきたものはもちろん、新しいアイディアや挑戦もふんだんに取り入れています。
その結果が出るには、まだ少し時間が必要と思いますが、今日はそのリニューアルにあたって考えていたことをいくつかご紹介しようと思います。

続きを読む:
弊社ウェブサイトをリニューアルしました!

Movable Type ブロックエディタの「カスタムブロック設計パターン」

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

ども、どもども。
先日の記事でも触れましたが、MTDDC Meetup TOKYO 2021「カスタムブロック作成手順のベタープラクティス」というセッションで、複雑なHTML構造のウェブページを、Movable Typeのブロックエディタで作る方法を紹介していました。

その後もカスタムブロックをどう使っていこうかと試行する中で、カスタムスクリプトを利用したカスタムブロックにも、ウェブサイトの運営状況(操作スキルや利用シーン)によって大きく2パターンあるなと考えるようになったので、今日はその2通りのカスタムブロック設計パターンについて、ブログ記事にしてみようと思います。

続きを読む:
Movable Type ブロックエディタの「カスタムブロック設計パターン」

MovableType.netで使用する独自ドメインでメールも利用する

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

ども、どもども。
今年10月、シックス・アパート社さんとの共催で、以下のセミナーを開催しました。

参考)スライド資料

このセミナーでは、MovableType.netを利用して弊社がどのようにウェブサイトを構築しているか、その事例を踏まえご紹介させていただきましたが、そのセミナーの中で「MovableType.netを利用する際、同じドメインでメールを運用したい場合は、どのように対応しているか」と質問を受けました。

MovableType.netでは、利用する独自ドメインのCNAME、またはAレコードにIPアドレスを設定することで、独自ドメインによるウェブサイトの運営が可能になっています。
ただ、提供されるのはウェブサイト機能のみで、メール機能はありません。

独自ドメイン(公開設定/追加ドメイン)
https://movabletype.net/support/setting/domain.html

弊社では、ウェブサイトはMovableType.netで、メールは別のサーバーで運用するように独自ドメインを設定していますが、その点についてはMovableType.netのマニュアル等には記載されていません。
上記ページでも、独自ドメインをどのように設定すると良いのか、その具体的な方法については紹介されていないので、ここがわからず不安になっているケースもあるのかと感じました。

そこで今回は、独自ドメイン側でどのように設定すると、MovableType.netで利用するドメインで、ウェブサイトとメールを利用できるのかを中心にご紹介したいと思います。

続きを読む:
MovableType.netで使用する独自ドメインでメールも利用する

MovableType.netのブロックエディタで「ブロックを追加」する場所をわかりやすくする

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

ども、どもども。
ワタシ、このブログはもちろん、仕事で構築しているウェブサイトでも、ここ最近は Movable Type のブロックエディタを活用しています。
カスタムブロックでとても使いやすい管理画面が作れるので、利用者さんからも好評です。

ブロックエディタを使えば、こんな複雑な構造のページでも、HTMLを触ることなく編集することができます。
このブロックエディタの作り方は、MTDDC Meetup TOKYO 2021「カスタムブロック作成手順のベタープラクティス」というセッションで紹介しました。

複雑な入れ子構造のHTMLでも、直感的に作れてとても便利なのですが、このようなレイアウトを作る際に、ひとつだけ気になっていたことがあります。

続きを読む:
MovableType.netのブロックエディタで「ブロックを追加」する場所をわかりやすくする

10年ほど使ってきたパスワード管理ツールを1PasswordからDropbox Passwordsへ変更

ども、どもども。
突然ですが皆さん、パスワードの管理ってどうしていますか?

インターネットを利用しているとパスワードを設定する機会がとにかく多いと思います。
SNSアカウントはもちろん、通販やウェブサービスを利用するにもアカウント&パスワードが必要ですよね。
しかも万が一のことを考えるなら、同じパスワードを使い回すのは避けたいところ。

とは言え、私のような仕事をしていると管理するパスワードがどんどん増えるのでかなり大変です。
自分だけのパスワード生成ルールを作って管理しているケースもありますが、ぜんぶそれで通すというのもなかなか難しいものです。
そこでワタシは10年くらい前から1Passwordというアプリを利用していました。

とても有名なアプリなので知っている方も多いと思います。
4〜5年前からサブスクリプション型(月額課金)のサービスに変わったのですが、ワタシはその少し前に買い切り版のversion6を購入していたこともあり、すぐにサブスクリプションに乗り換えることはせずにいました。
ところが先日、とうとうChromeエクステンションの1Passwordが正常に機能しなくなり…これはもういよいよサブスクリプションへの乗り換えかと考えていたんです。

と、そこで思い出したのがDropbox Passwords!
普段から利用しているDropboxが提供しているパスワード管理ツールで、私が契約してるプランであれば追加料金なしに利用できるということで、1Passwordのサブスクリプションを始める前に、こちらを試してみることにしました。

1Passwordに保存されているパスワードが200以上あることに気がついて、これをどうやって移行しようかと考えていたのですが、CSVデータのエクスポート&インポートで簡単に移行することができました。
ウェブ上にはその手順の紹介があまりなかったので、今日はその手順を記事にまとめておこうと思います。

続きを読む:
10年ほど使ってきたパスワード管理ツールを1PasswordからDropbox Passwordsへ変更

MovableType.net Dashboard Utility ver0.6.0 リリースしました!

ども、どもども。
今年もアドベントカレンダーの季節がやってまいりました!
Movable Typeでは今年10年目となります。
いつも参加してくれる皆さん、そしてこの記事をご覧の皆さん、ありがとうございます!

この記事は「Movable Type Advent Calendar 2021」11日目の記事で、ここ数年恒例となっている「MovableType.net DashBoard Utility」の新バージョンリリース記事となります!

…の予定だったのですが(お詫び)

この記事を準備したのが12月9日(木)17時、その直前にChromeウェブストアに新バージョンをアップロードし、審査に入ったものの、12月11日(土)16時現在、まだ審査が終わらず公開されていません!!(汗)
そのため、以降は「近日リリースされる新バージョン」の紹介としてご覧ください…

追記)2021年12月24日(金)にリリースされました!

続きを読む:
MovableType.net Dashboard Utility ver0.6.0 リリースしました!

【MovableType.net】画像アップロード時にネイティブLazy-load対応にする

ども、どもども。
この記事は 「Movable Type Advent Calendar 2021」 3日目の記事です。

ここ数年、ウェブページの表示速度向上があらゆる場面で取り上げられています。
そんな中、手軽な対応の1つとして「画像の遅延読込」がありますが、2年ほど前にはGoogle Chrome ブラウザがJavaScriptを使用せずにこれに対応できる「ネイティブLazy-load」に対応して話題になりました。

imgタグのHTML中に loading="lazy" 記述するだけで、最近のブラウザであれば自動的に遅延読込をしてくれるのが便利ではありますが、Safariの対応がもう少し先になりそうなので、現在はJavaScriptと併用している感じが多いのかなと思います。

世界的に利用者の多いCMS「WordPress」では、画像をアップロードした際に自動的に loading="lazy" を記述してくれるようですが、すべての画像に一律で入れてしまうのはちょっと慎重になったほうが良いという話もありますね。

というわけで、私が普段から利用している MovableType.net でも画像アップロード時に loading="lazy" を任意に付与できるようにカスタムブロックを作ってみたので、この記事ではそちらをご紹介したいと思います!

続きを読む:
【MovableType.net】画像アップロード時にネイティブLazy-load対応にする

WYSIWYGエディタでリストの入れ子を作る

ども、どもども。
私、Movable Typeをかれこれ18年ほど利用しております。
そんなわけで、Movable Type 5.2から標準搭載されたTinyMCE(WYSIWYGエディタ/リッチテキストエディタ)とも、かれこれ8年以上の付き合いとなります。

TinyMCEはとても機能豊富なので、Movable Type以外にもさまざまなソフトウェアで利用されており、私が愛用しているMovableType.netでももちろん利用できます。

ただ、大変便利なTinyMCEですが、「入れ子状のリストを作る方法」をつい先日まで知りませんでした!(汗)
入れ子状のリストとは、こんな感じのものです。

  • 和食メニュー
    • 寿司
    • 天ぷら
    • そば
  • 洋食メニュー
    • カレーライス
    • ハンバーグ
  • 中華メニュー
    • ラーメン
    • 餃子
    • 回鍋肉

これができることを知るまでは、恥ずかしながら「TinyMCEでは入れ子状のリストが作成できません!」と言い切っていました…ほんとごめんなさい…

やっとそれを知ったので、今日はその便利な使い方をまとめておこうと思います。

続きを読む:
WYSIWYGエディタでリストの入れ子を作る

Movable Type 誕生から20年!

ども、どもども。
ここ最近も慌ただしくお仕事させていただいてます。
先日は法人第8期も無事に終わり、忙しくも楽しい日々。

そんな中、もう1週間前になりますが、2021年10月8日(金)に Movable Type が誕生から20周年を迎えました。
シックス・アパートさん、おめでとうございます!

この画像はシックス・アパートさんのブログから転用させていただきました。

Movabe Typeは2004年の創業当時から利用しているCMSソフトウェアで、これがなければ私の仕事もこうはなっていなかったと思えるプロダクトです。
私が利用し始めたのはversion2.661で、その後すぐにversion3がリリースされ、仕事でも利用するようになりました。
このソフトウェアでほんとにいろんなウェブサイトを作ってきましたね。

続きを読む:
Movable Type 誕生から20年!

Homebrewを使おうとしたら「Git must be installed and in your PATH!」とエラーが出てしまった

ども、どもども。
昨年12月〜今年1月にかけ、いわゆる黒い画面(ターミナル)を使ってOpenSSLのインストールやSSL証明書のCSR作成SSH接続のための鍵ペア作成など「それっぽいこと」をやっていたワタシ。

その後はあまり利用する機会が無かったのですが、今進めているウェブサイト構築で動画のHLS配信をする必要があって、そのために必要となるffmpegをインストールするため、久々に黒い画面を起動しました。
参考にしたのはこちらの記事。

Homebrewなら前回も使ったし問題ないだろう…と思ったのですが、いざやってみるとHomebrewが動きませんでした。
いったいなにが(汗)

調べた結果、最終的に上手く動かせてffmpegもインストールできたので、今回はその原因と対処方法をまとめておこうと思います。(またいつか自分が必要になりそう…)

続きを読む:
Homebrewを使おうとしたら「Git must be installed and in your PATH!」とエラーが出てしまった

StripeのPayment Linksはホントに5分以内でクレジットカード決済を導入できるのか

ども、どもども
弊社でクレジットカード決済を導入する際、一番に候補に挙げているクレジットカード決済サービス「Stripe」
そのStripeの新しい利用方法「Payment Links」を試してみました。

Stripe Payment Links: リンクを作成し、どこでも販売できます。所要時間は 5 分以下です。

5分以下でクレジットカード決済を導入?!マジすか
というわけで、さっそく作ってみることに。

続きを読む:
StripeのPayment Linksはホントに5分以内でクレジットカード決済を導入できるのか

SSH接続するための秘密鍵と公開鍵をMacで作る

ども、どもども。
ここ最近のブログ記事はテクニカルな内容が多い…
ワタシもウェブ屋さんなんだなと実感しています(笑)

さて。
ウェブサイトの構築業務をしていると、こういう依頼を受けることはないでしょうか

  • サーバーにはSSH接続(SFTP鍵認証)でアクセスして欲しい
  • そのためにSSHキーを用意して知らせて欲しい

ワタシも何度かこのような連絡を受けて対応していますが、正直なところSSH接続(というか黒い画面)にはまだ慣れていない部分もあり、毎回ビクビクしながら対応しています(笑)

先日もSSHキーを用意して欲しいと連絡を受け準備したのですが、そのときに実施した手順やちょっとしたコツ?のようなものを、将来の自分のためにまとめておこうと思います。

いろいろと経緯なども書いていますが、サクッと作り方を知りたい場合は【秘密鍵/公開鍵作成のコマンドと手順】だけ読むと良いかもしれません。
なお、ちょっと説明が怪しい部分もあると思うので、その辺りはご了承くださいね(汗)

続きを読む:
SSH接続するための秘密鍵と公開鍵をMacで作る

このブログでもダークモードに対応してみました!

ども、どもども。
このブログも運営し始めてもうすぐ7年になろうとしています。
その前身となるブログなども含めると、もう20年以上、このように書いていることになります。

さすがにここまで長く運営していると、世の中も変わってきます。
というわけで、少し前から対応しているウェブサイトやアプリも増えた「ダークモード」に、このブログも対応してみました!
なんだか大事のように書いていますが、やってみたかったというのが本音ですね(苦笑)

この記事では、その手順とか対応内容をご紹介したいと思います。
それではさっそく参りましょうー!

続きを読む:
このブログでもダークモードに対応してみました!

【MovableType.net】TinyMCEでテーブルに設定されるwidthやheightを削除する

ども、どもども。
2020年の仕事納めは昨日でしたが、今日もデスクに向かってます。こんにちは。

MovableType.netのブロックエディタ、これまでもそのカスタマイズなどをいくつか紹介してきましたが、導入した弊社クライアントさんからも大変好評です。

そんなブロックエディタですが、テーブル(表)の作成だけはちょっと面倒なことが…。

MovableType.netのブロックエディタは、TinyMCEが使用されているのですが、このエディタのテーブルって、初期設定や編集中にちょっと罫線に触れてしまうことで、セルの幅とか高さとかが自動でついてしまうことがあるんですよね。
そのような場合はソースコードをちまちまと修正することも多いのですが、それをクライアントさんに強いるのも難しく、とは言えそこをサポートするのも、数が多かったり複雑だったりすると手間が増えてしまいます。

WordPressを利用している場合はTinyMCEの設定変更が可能なようで、それらの情報が共有されていますが、MovableType.netの場合はそれができません。

これをどうにかしたいなーと言うことで、以前作成したテーブルのレスポンシブ対応カスタムブロックを改良してみました。

続きを読む:
【MovableType.net】TinyMCEでテーブルに設定されるwidthやheightを削除する

自分で作ったCSRで取得した独自SSL証明書をインストールしてみた

ども、どもども。
前回の記事では、初めてMacのターミナルでCSRを作ってみたところまでを記事にしていました。

今回はそのCSRで取得申請したSSL証明書をMovableType.netにインストールするところまでを記事にしておこうと思います。
前回の続きなので、使用しているファイル名等は前回の記事そのままとなります。

続きを読む:
自分で作ったCSRで取得した独自SSL証明書をインストールしてみた

MacのターミナルでSSL証明書取得申請に必要なCSRを作ってみた

ども、どもども。
普段はウェブディレクターとして仕事をしながら、たまにコードを書くことを趣味のようにしているワタシです。

さて、ウェブサイトの常時SSL化が当たり前になって久しいですが、ワタシが普段、SSL証明書の申請・発行に必要となるCSRを用意する際は、導入するサーバーの管理画面(PLESK)で作成していました。
ただ、今回申請するにあたってCSRの中に「メールアドレスを含めない」という必要があって、PLESKではそれができないことがわかりました。(メールアドレスの入力が必須だった)

ブラウザ上でCSRを作成できるツールも試したのですが、暗号化アルゴリズム(SHA2)の都合などもありうまく行かず、自分のMacでOpenSSLを使用してコマンド操作で作成することに。

いわゆる黒い画面ですが、これまでローカル環境の構築やサーバーの移転などで何度か使ってきたものの、CSRの作成は初めてのことだったので、色々調べながらやってみた備忘録を後々の自分のために書き残しておこうと思います。

※記載内容に誤りなどあった場合は、優しく教えてください(笑)

続きを読む:
MacのターミナルでSSL証明書取得申請に必要なCSRを作ってみた

Craft CMS 3を手動インストールする

ども、どもども。
この記事は Craft CMS Advent Calendar 2020 18日目の記事です!

数年前から話題になっているCraft CMS
一度触ってみたいと思いつつなかなか実現できずにいた2019年夏、ここ札幌で開催されたイベントに参加して触ってきました。

良い感触を得られたのですが、とは言えその後もなかなか自分でインストールして…ということはできずにいました。
そんな中で知ったAdvent Calendar、これはもう自分を追い込むしか無い、と。

今回は大したことはできないと思いますが、まずはインストールするところくらいまで自力でやってみようと思います!

続きを読む:
Craft CMS 3を手動インストールする

MovableType.net Dashboard Utility ver0.5.0 リリースしました!

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

このアドベントカレンダーも今年で9回目!
第1回からワタシも参加していて、第4回となる2015年からはワタシが企画させてもらっています。
参加していただいたMT::Loverな皆さん、ありがとうございます!

さて、本ブログの今年のネタですが、もう毎年恒例となりましたMovableType.net Dashboard Utilityのバージョンアップ(12月9日リリース、ver 0.5.0)についてご紹介します!
MovableType.netに今年実装されたブロックエディタについて書こうかとも思ったのですが、アドベントカレンダーならこっちだよなと言うわけで、ブロックエディタについては他の記事もあわせてご覧ください。
ちなみに、今回のバージョンアップでも「ブロックエディタが追加されたからこそ」という機能がありますよ!

2020.12.15
version 0.5.1 をリリースしています。
テンプレート編集時に保存できない不具合が出ていました!失礼しました。
ご指摘いただいた天野さん、ありがとうございました!

Dashboard Utilityは、MovableType.netの管理画面を使いやすくするChromeエクステンション(無償)で、過去5年間ちょっとづつバージョンアップをしています。
昨年、まとめ記事を書きましたので「どんなことができるか」はこちらをご覧ください。

現在、40名ほどの方にご利用いただいているみたいです。
ありがとうございます!
では、さっそく今回のバージョンアップ内容の紹介へ参りましょうー!

続きを読む:
MovableType.net Dashboard Utility ver0.5.0 リリースしました!

MTDDC Meetup TOKYO 2020に参加、セッションを担当しました!

こんにちは、どもども。
2020年10月10日(土)にオンライン開催されたMTDDC Meetup TOKYO 2020に参加、そして登壇してきました!

当日はおよそ340名の参加申込となる大変大きなビッグイベントになりました。
オンライン開催ということで全国各地から参加できたおかげか、参加者数は過去最大の300名ほどだったようです。すごい!

Zoom ウェビナーを使用して2トラック並行開催、TechnologyトラックとStrategyトラックで合計18セッションが行われました。
私はTechnologyトラック 17時〜に「遂にキタ!MTはMTのブロックエディタはイノベーションを起こすのか」と題してお話させていただきました。

て…、Technology…と最初は思ったのですが、なんとかお役目を果たすことができました(苦笑)
今回はそのセッション内容のフォローアップを書いておこうと思います。

続きを読む:
MTDDC Meetup TOKYO 2020に参加、セッションを担当しました!

【MovableType.net】同じフォルダに含まれる下層ページをウェブページ内で一覧表示するカスタムブロックを作ってみた

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

先日、Movable Typeユーザーが主催するイベント MTDDC Meetup TOKYO 2020 に登壇し、セッションを担当してきました。
こちらのセッションに関するフォローアップ記事はまたあらためて書こうと思いますが、今日はその中でもご紹介した「カスタムブロックで作ってみたシリーズ第3弾」を記事にしようと思います。

第1弾:YouTube動画埋め込み時のブロックエディタの見た目をカスタムスクリプトで解決してみた
第2弾:テーブルのレスポンシブ対応を選択できるカスタムブロックを作ってみた

Movable Typeのウェブページ内にその下層ページを一覧表示する

コーポレートサイトなどを構築する際、このような構造になった「インデックスページ」を作成する機会も少なくないと思います。

会社案内という親ページの中に、その下層となる3つのページ「会社概要」「代表あいさつ」「支店所在地」へのリンクを設けるページです。
今回は、このようなインデックスとなる親ページをMovableType.netで作ってみようと思います。

続きを読む:
【MovableType.net】同じフォルダに含まれる下層ページをウェブページ内で一覧表示するカスタムブロックを作ってみた

【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」を実施することになりました。

その後に期間を延長し、現在もまだ受け付けています!(2020年12月9日現在)

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

  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発表時のディスプレイ解像度

アクセスの多い記事