タグ

ブックマーク / www.koikikukan.com (18)

  • 「ノンプログラマーのためのjQuery生成ツール」作りました

    ノンプログラマーのためのjQuery生成ツールを作ってみました。よければご活用ください。 ノンプログラマーのためのjQuery生成ツール サンプル表示つき このツールは「7つのサンプルでjQueryを学ぼう!「jQueryが全く分からない人のため」の超初級者向け入門講座」にインスパイアされて作った、初心者向けのお勉強ツールです。 コールバックなど複雑な設定はできませんが、基的な設定とメソッドチェーンまでできるようにしています。 追記:イベントとAPIをプルダウンメニューで選択できるようにしました。過不足あればご指摘ください。 追記:イベントとAPIのプルダウンメニューでツールチップを表示できるようにしました。ざっくりした内容ですが、これでイベントやAPIの使い方が分かるようになります。 ツールチップを表示 やっつけで作ったので中のコードはかなりひどいです。あしからず。 1.使い方 エン

  • phpMyAdminでインポートできない大きなファイルを一気にインポートできる「BigDump」

    phpMyAdminを使ったSQLファイルのインポートにはファイルサイズの制限があり、サーバ環境によってはサイズの大きいSQLファイルをインポートできない場合があります。 これを解消してくれるのが「BigDump」です。 BigDump BigDumpは、PHPベースのMySQLインポートツールです。 先日行ったサーバ移転で、100MBほどあるSQLファイルのインポートにこれを利用しました。約100MBほどあるSQLファイルを分割もせず、わずか1分ほどでインポートすることができました。 ということで以下、BigDumpによるSQLファイルのインポート手順を解説します。1つのSQLファイルサイズがかなり大きくても大丈夫なようですが、エクスポートするSQLファイルは7項の手順にしたがって出力したものを利用することを推奨します。 1.BigDumpのダウンロード BigDumpのページの右にある

    phpMyAdminでインポートできない大きなファイルを一気にインポートできる「BigDump」
  • jQueryでスマホサイト向けに画像サイズを縮小する方法

    jQueryでスマホサイト向けに画像サイズを縮小する方法を紹介します。 1.サンプル 次のようなPCサイト用のページがあります。この場合、Movable Typeでページを出力しています。ページで使っている記事内の画像サイズは幅470pxです。 このページをスマホサイト向けに別のページを作り、画像サイズを縮小して表示します。画像サイズは幅280pxに縮小しています。 2.カスタマイズ サイズを変更するには、下記のスクリプトをページ内にあるhead終了タグの直前に追加します。 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> <script type="text/javascript"> jQuery(function(){ $('img').each(functio

    jQueryでスマホサイト向けに画像サイズを縮小する方法
  • Excel(エクセル)の文字入力で表示が「#######」となる問題

    以前から Excel を使っているとき、入力した文字が時々「#####...」と表示されてしまうケースがあります。 「#####...」となる問題は、数値を入力して、セルの幅が入力した値より幅が狭いときなどに発生しますが、ここでは別の事象です。 1.問題点 まず、セルの書式設定で「表示形式」を「文字列」にします。 この状態で文字を入力すると、次のように、「#####...」になります。内容にかかわらず、何らかの条件でこのようになるみたいです。 2.原因 ネットで調べてみたところ、MicroSoft サポートに原因が掲載されていました。 MicroSoft サポート オンライン - 表示形式が文字列のとき 256 文字以上の文字を表示できない 要約すると、下記の条件が揃うと、文字が「#####...」と表示されるようです。 セルの書式設定で「表示形式」を「文字列」に設定 セルに入力している文

  • 小粋空間: Movable Type 4.1 カスタムフィールドの使用方法

    Movable Type 4.1 で追加された「カスタムフィールド」の利用方法です。 この機能は以前、CustomFields プラグインとして公開されていたものが、MT4.1 で新たにアドオンとして追加されました。カスタムフィールドを利用すれば、ブログ管理ユーザがブログ記事投稿画面等に任意のフィールドを新たに追加することができます(下は追加例)。 この機能はプラグインとして配布されている頃から有名でしたが、当ブログでは一度も紹介したことがなかったので、今回は気合を入れて、設定方法およびサンプルによる使用例を記してみました。 1.設定方法 ブログ管理画面より「設定」→「カスタムフィールド」をクリック。 「フィールドを作成」をクリック。なお、左のメニューにも「カスタムフィールド」が追加されています。 このような画面が表示されます。 以下、ブログ記事に「関連リンク」というフィールドを追加する例

    小粋空間: Movable Type 4.1 カスタムフィールドの使用方法
  • Ajax によるモジュール化

    Movable Type のサイドバーの各リストを、Ajax でモジュール化を行う方法を紹介します。 1.PHP モジュール化と Ajax モジュール化の違い Movable Type における PHP モジュール化には次のようなメリットがあります。 再構築時間の削減 アーカイブに依存しないリストの生成(今回はここに言及しません) ただし PHP モジュール化は、ユーザがブラウザからインクルード元のページにアクセスした時、インクルード元のページはインクルード先の各モジュールを読み込んだコンテンツを生成・返却するため、サイドバーに多くの情報をインクルードしていると、PHP でページを生成する分、表示が遅延します。 題とはそれますが、WordPress で表示までに若干のタイムラグが生じるのは、この PHP によるページ生成が行われるためです(キャッシュや条件付きGETが機能していればこの限

    Ajax によるモジュール化
  • 小粋空間: Movable Type が WordPress に負けた本当の理由

    Movable Type と比較して WordPress が人気なのは、「再構築が不要」とか「インストールが簡単」とか「デザインが豊富」とか、国内ブロガーの評価を頼りにしていましたが、下記の記事の一文を読んで、米国で Moovable Type の人気が急激に落ち、WordPress にシェアを明け渡した当の理由を知りました。 Movable Type 4.0 ベータ、ローンチ―第3四半期にもオープンソース化へ MTユーザーとSixApartの間には波乱の歴史がある。Movable Typeは決してオープンソースプラットフォームではなかったのだが、MT 3.0のリリース以前は多くのユーザーがMTをオープンソースであるかのように扱っていた。2004年のMT 3.0のリリースと同時にライセンス契約が強制されるようになったことでユーザーコミュニティーからは激しい非難の声(私の声もかなり声高に混

    小粋空間: Movable Type が WordPress に負けた本当の理由
    dbfireball
    dbfireball 2007/06/22
    「ネットには2.661の情報しかなかったことをよく覚えています。」そうだったなぁ。
  • Movable Type 4 ベータ版情報(ブログ画面・テンプレート構成・追加テンプレート・タグ)

    ベータ版を早速インストールしてみました。IE ではダウンロード NG になったので Firefox で。 1.インストール画面 インストール画面はこれまでのウィザード機能のデザインが変わっただけですので省略しますが、とりあえずスタート画面だけ。 2.サインイン画面 下がサインイン画面。WordPress みたいになりました(この後、管理画面を遷移するたびにこのサインイン画面に戻ってしまいます)。→さくらインターネット + SQLite が NG。MySQL は OK です。 3.管理ページ 下は管理ページにログインしたところ。デザインが大幅に変わりました。Ajax(またはAjaxライブラリ)も使われてます。 エントリー投稿画面はエラーになり、再構築も成功しませんでした(スタティック・パブリッシングにしてもダイナミック。パブリッシングで動作してしまう→SQLite使用のためNG)ので、テンプ

    Movable Type 4 ベータ版情報(ブログ画面・テンプレート構成・追加テンプレート・タグ)
  • QR コードの進化系・ColorCode(カラーコード)

    QR コードの進化系、ColorCodeTM(カラーコードTM)を紹介します。 ちなみに下が同じ URL の QR コード。 他にも美しいデザインの ColorCodeTM があります。 カラーコードTMギャラリー BlogPeople の被リンクを頂いた下記のサイトから知りました。ありがとうございました。 Via:sohoウェブデザイナーの試行錯誤な日々:携帯のカラーコード? colorzip もしかしたらどこかでみかけたことはあるかも知れませんが、私も知られた技術としての認識は全くありませんでした。 もともとは韓国で開発された技術です。 白黒のQRコードから「カラーコード」へ──韓国発の新規格 次世代型バーコードシステム『カラーコード(TM)』が格運用へ ColorCode の基構造は下記が参考になります。 基構造について また、QRコードとの違いは見た目だけでなく、下記のような

    QR コードの進化系・ColorCode(カラーコード)
  • WordPress でステータスコード 404(Not Found)を返却するエラーページを作る

    WordPress のサイトで、「指定された URL が存在しない場合、テーマ(テンプレート)で用意した 404 エラーページ(404.php)の内容を返却します」というようなことが関連書籍等に記されていますが、サーバの設定によっては 404 エラーページを表示したにもかかわらず、HTTP レスポンスにステータスコード 200(OK)を付与してしまうケースがあります。 また、「指定された URL が存在しない場合」についてもバリエーションがあり、例えば、WordPress が解釈できるクエリー文字列が付与され、かつ存在しない URL であれば、適正なサーバの設定を行っても 404 エラーページが表示されない可能性が高いです。 このエントリーでは、指定された URL が存在しない場合、可能な限り 404 エラーページを返却させると同時に、スクリーンショットのように HTTP レスポンスのステ

    WordPress でステータスコード 404(Not Found)を返却するエラーページを作る
  • 小粋空間: Movable Type を始める前に設定しておきたい 10 の項目

    Movable Type を初めてご利用になる方のために、「これだけは最初に設定しておきたい」という 10 項目を挙げてみました。1項から8項は設定の流れを考えて順序づけをしました。最後の2項目の優先度は低いですが、「そういう機能もあります」という意味で掲載しています。 「全てが必須」という意味ではありません。不要と思われる項目はスキップしてください。 2008.10.01 「Movable Type 4 を始める前に設定しておきたい 10 の項目」を公開しました。 1.管理画面を「詳細モード」に切り替える Movable Type の管理画面は「基モード」と「詳細モード」の2種類があり、デフォルトは「基モード」になっています。この状態では基設定とプラグインの一覧しか表示されないため、コメント・トラックバックの受信設定や後に述べるアーカイブページのパス等や拡張子が変更できません。 と

    小粋空間: Movable Type を始める前に設定しておきたい 10 の項目
  • Windows XP で外付けデバイスを簡単に取り外す

    Windows 2000 で USB メモリ等の外付けデバイスを取り外す時、タスクバーに表示された「安全な取り外し」をクリックし、デバイスの停止をするという手順を踏まなければなりませんでした(それを行わずにデバイスを抜くと、システムの動作がおかしくなります)。 そういう訳で XP でも同じ手順を踏んでいたのですが、XP はドライブ単位に「クイック削除」という、「安全な取り外し」をクリックする作業を省略できる機能が追加されているみたいで、デフォルトが「クイック削除」の設定になっているようです。 注:外付けデバイスにインストールしたアプリケーションを実行している状態で外すと、PCが重くなったりフリーズする可能性があります。どの状態で安全に外せるかは、事前に「安全な取り外し」でご確認ください。 どちらの設定になっているかを確認するには、外付けデバイスを挿入した状態で下記の操作を実行しましょう。

  • JavaScript で文字をトリミングする

    JavaScript を用いてエントリータイトル等の文字をトリミング(指定した文字数だけ表示する)するカスタマイズです。 以前、「Movable Type のようなトリミングを、他のブログで実現できないでしょうか」というご質問の回答です。大変遅くなりましたが、このエントリーで回答に替えさせて頂きます。 ここでは文字数でトリミングする方法を紹介していますが、半角・全角が混在している場合のサイズを調整したい場合は、下記のエントリーを参照ください。 JavaScript で文字をトリミングする(改善版) とりあえず「id 属性名」と「要素名+ class 属性名」で指定したタグの中に記述された文字列をトリミングする、簡単な JavaScript を書いてみました。 Windows + IE6/Firefox 2 で実験した限りでは、全角・半角いずれも1文字で計算してトリミングしてくれるようですが

    JavaScript で文字をトリミングする
  • Movable Type の再構築を不要にする「ダイナミック・パブリッシング」(その1:概要)

    「Movable Type で再構築ができません」「500エラーが多発します」という記事をよくみかけますが、Movable Type には WordPress のようなページの動的生成、いわゆる「ダイナミック・パブリッシング」がバージョン 3.1 から標準搭載されており、これを利用することで再構築不要な環境にすることができます。 「ダイナミック・パブリッシング」とは、リクエストが発生するたびにHTMLページを動的に生成する機能です。ちなみに「再構築」は、エントリー文やコメント・トラックバック等のデータをデータベースから読み出して、スタティックなHTMLページを生成することです。 当サイトではこれまで「ダイナミック・パブリッシング」について全く取り上げていなかったのですが、今後は少しずつ記事として取り上げていきたいと考えています。 というのは、現在発売されている某雑誌で「Movable T

    Movable Type の再構築を不要にする「ダイナミック・パブリッシング」(その1:概要)
  • 小粋空間: Internet Explorer 6 と Internet Explorer 7 を共存させる

    はてなブックマーク経由で「IE6 と IE7 の共存はできませんか?」という類の質問をいくつか頂きまして、ネットを検索してみたところ、簡単に共存できる方法が書かれたサイト(下記)をみつけましたので、エントリーにて IE6 と IE7 を共存する方法をご紹介します。 Tredosoft:Internet Explorer 7 running side by side with IE6. (standalone) 「共存」というのはやや誇張した表現ですが、IE7 Standalone 版を来の IE のインストールフォルダとは異なるフォルダにインストールするというものです。またインストーラを利用するので簡単にインストールできます。アンインストールも可能です。当然ながら対応 OS は Windows XPのみです。 上記のページには2つの方法が紹介されていて、このエントリーでは「インストーラ

    小粋空間: Internet Explorer 6 と Internet Explorer 7 を共存させる
  • 小粋空間: Firefox 1.5 と Firefox 2.0 を共存させる

    Firefox 2.0 がリリースされまして、当サイトを Firefox で閲覧されている方の約 50% がすでに 2.0 をお使いのようです。 私もリリースと同時に Firefox 2 をインストールしまして、直感的ですが閲覧機能に限っては(というか他は深く試してません)1.5 よりかなりいい感じです。 ただし拡張機能の差分や、CSSの表示の違いも若干あるようで、個人的には 1.5 と併用したいと思いました。ということで、ここでは Firefox 1.5 と Firefox 2 をひとつのPCで共存させる方法をご紹介します。 今後のバージョンアップでも同様の方法で共存させることができるかもしれません。 参考サイトは下記です。ありがとうございました。 Firefox 1.5と2.0を共存させる方法 Firefox 2.0 RC 1とFirefox 1.5を共存させる方法 なお、Firefo

  • Movable Type テンプレート・タグ一覧

    Movable Type のテンプレート・タグを一覧にしました。アルファベット順と機能別の切り替え表示が可能です。MTタグのリンクは Movable Type 3.3 マニュアルのテンプレート・タグ リファレンスの各タグ名に直接ジャンプするようにしています。*1 *2 ということでよろしければご利用ください。できればバージョンアップにも追従していきたいと思います。 アルファベット順 機能別 ブログ エントリー カテゴリー サブカテゴリー エントリー・タグ アーカイブ 画像関連 カレンダー コメントの一覧 コメント・プレビュー コメント投稿者 トラックバック TypeKey 検索 システム その他 ブログ MTBlogs MTBlogName MTBlogDescription MTBlogID MTBlogLanguage MTBlogHost MTBlogTimezone MTBlogF

    Movable Type テンプレート・タグ一覧
  • ドラッグ&ドロップできるサイドメニューの折りたたみ(その1:基本設定)

    「Docking boxes」という、JavaScript + CSS でサイドメニューの折りたたみとドラッグ&ドロップを実現したスクリプトの紹介です。WordPress をお使いの方は管理画面で利用されているのでご存知の方も多いのではないかと思います。 記事では一般的な設定方法を紹介し、「その2:ブログへの適用」で Movable Type 等への設置方法について説明します。 配布元にサンプルがありますのでお試しください。 1.スクリプトのダウンロード Docking boxes(dbx) のページの「Get the Script」からアーカイブをダウンロードします。アーカイブを解凍した中から下記のファイルのみを使用します。 dbx.css(または dbx-allrules.cssdbx.js dbx-key.js 他のファイルおよび画像はサンプルのためのものです。全てをアップロー

    ドラッグ&ドロップできるサイドメニューの折りたたみ(その1:基本設定)
  • 1