オンラインプロフィールの定番「Googleプロフィール」や、オシャレなページがカンタンに作成できるウェブサービス「Flavors.me」など、パーソナルページのためのサービスはいくつかありますが、こちらでは、米Lifehackerのオープンソースを活用する方法をご紹介しましょう。

必要なものは、以下の2つ（+1）。

  • 「Lifehacker.me」の「Landing Page PHP」スクリプト（こちらから無料でダウンロード可能）
  • PHP対応したウェブホスト（『DreamHost』などのウェブホスティングサービスを利用）
  • Flickr APIキー（Flickrアカウントと連携させたい場合のみ、こちらのページでサインアップすれば、無料で入手可能）

    • 　作業プロセスの詳細は、以下の動画チュートリアルをご参照いただくとして、ポイントは以下のとおり。

    1: 「Lifehacker.me」の「Landing Page PHP」スクリプト（ZIPファイル）をダウンロードし、解凍して、すべてウェブサーバーのディレクトリにアップロードする。

    2:「config.php」をテキストエディターで開き、設定を変更する。

    ・ページの設定変更：「config.php」の「VISUAL STYLE」の項目で設定変更すれば、背景画像やテキストの影、名前やナビゲーションの色など、自在にカスタマイズできる。背景画像は、サーバーのどこかにアップロードして、そのURLを指定すればOK。

    100928lifehackerpersonal.jpg※　クリックで拡大

    ・Flickrユーザ名の指定（Flickrのみ）：Flickrのユーザ名を設定し、Flickr APIキーを貼り付ける。

    ・Vimeo/YouTube/Twitterユーザ名の指定: VimeoやYouTube、Twitterのユーザ名を指定する。

    なお、これらすべてのソーシャルネットワークと連携させる必要はなく、ページ内で表示しないアカウントは空欄のままでOK。ページのナビゲーションには表れません。

    ちなみに、米LifehackerのAdam Dachisが作成したデモページは、こちら。作業のプロセスは至ってシンプルですが、コンテンツとしては十分ですね。

    こちらのページ作成で利用したコードは、完全オープンソースです。自由にCSSを書き換えて、新しい機能を追加しましょう。「github」のこちらのページに保存されていますので、ぜひご活用ください。

    Adam Dachis（原文／訳：松岡由希子）