Holiday Webmaster Blog

Dドライブの空き容量をCドライブに割り当ててCドライブの空き容量を増やす方法

2010-02-06T23:10:00.023+09:00

誰もが一度は体験するCドライブの容量不足。

その度に不要ファイルの削除やら不要アプリケーションの削除やらウィンドウズ復元ファイルの削除やらを行ってきたのだが、残り100MBとなり、いよいよごまかしが効かなくなってきた。

OSの再インストールが頭をよぎるが、それだけは避けたいと色々調べた所、OSの再インストール不要でパーテーションのリサイズが出来る「Partition Wizard Home Edition」というフリーソフトを見つけた。

以下から、「Home Edition」をダウンロードして、

Partition Wizard

ソフトをインストールしたら、作業に取り掛かろう。

※）この手のソフトは失敗すると、ハードディスク全てのデータが消える可能性があるので、あらかじめハードディスクのバックアップを取ることをお勧めします。

作業方法

まずはDドライブを選択し、「Move/Resize」をクリック。

そして、Dドライブの領域先頭をマウスで右に移動させ、

Cドライブに充てる容量分を確保して「OK」をクリック。

すると、新しいブランク領域が作成される。あらかじめDドライブの先頭(つまりCドライブの後方)を空け、そこをCドライブに充てるわけだ。

次にCドライブを選択し、「Move/Resize」をクリック。

Cドライブの後方にブランク領域が出来ているはずなので、

右端まで領域を広げたら、「OK」をクリック。

こうしてパーテーションのリサイズの準備は整った。

最後に、「Apply」をクリックし、

最終確認で「Yes」をクリックすると、

作業が開始される。

今回、Cドライブはシステムドライブとなっているため、途中で「Cドライブが使用中ですよ」と確認を促される。ここでは「Restart Now」をクリック。

すると、Windowsが再起動し、ブートモードで残りの処理を行ってくれる。

残りの処理が完了すると、Windowsが起動するが、ここでも再起動を促されるので、「今すぐ再起動する」をクリックし、再起動をすると、パーテーションのリサイズが完了となる。

スクリーンショットは、リサイズ作業後に、改めて取り直したもので、実際はCドライブ：15GB⇒30GB、Dドライブ：135GB⇒120GBにリサイズしてみたのだが、これでCドライブの容量不足に悩まされることはなくなるだろう。そもそも、Cドライブの容量を余裕もって取っておけば済むことなのだが…。

以上、Dドライブの空き容量をCドライブに割り当ててCドライブの空き容量を増やす方法でした。

訃報　アベフトシ

2009-07-22T22:37:00.004+09:00

孤高のギターヒーロー、アベフトシが死んだ。

ずっと、活動再開を待ち焦がれていた。

ただ、リアルタイムでTMGEを聴けたことは幸せだったんだと思う。

rockin' blues.com アベフトシ

追記（2009/7/26）

7/25 FUJI ROCK FESTIVAL でチバが最初に言った言葉、「今日のライブは大親友だったアベフトシに捧げます」

Bloggerのアーカイブページやラベルページで記事タイトル一覧を表示

2009-05-31T02:53:00.011+09:00

個人的には、記事タイトル一覧の無いアーカイブページは、目次や索引の無い参考書のようなものだと思っています。日記や小説とかなら別に必要無いんだろうけど…。

月別アーカイブリンクがサイドバーにちょこんと表示されはするものの、アーカイブページだけでなく、ラベルページにも記事タイトル一覧を表示させればブログの内容を把握しやすいので、これを読んだBloggerな人は是非とも導入して頂きたい。

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<ul id='post-title-navigation'>
<span>このページの記事一覧</span>
<b:loop values='data:posts' var='post'>
  <li>
    <b:if cond='data:post.link'>
      <data:post.dateHeader/> - <a expr:href='data:post.link'><data:post.title/></a>
    <b:else/>
      <b:if cond='data:post.url'>
        <data:post.dateHeader/> - <a expr:href='data:post.url'><data:post.title/></a>
      <b:else/>
        <data:post.dateHeader/> - <data:post.title/>
       </b:if>
    </b:if>
  </li>
</b:loop>
</ul>
</b:if>
</b:if>

上のソースを好きなところに挿入すれば、個別記事ページとトップページ以外のページに記事タイトル一覧が表示されるようになる。

話変わって、Blogger使ってる日本人が少ないのは、日本語のBlogger解説サイトが少ないからだろうなぁ。きっとBlogger使っている人は技術屋が多くて何でも自己解決してしまうから、Bloggerカスタマイズ指南サイトなんてのは流行らないんだろうな、たぶん。

追記（2009/6/19）

クリボウの Blogger Tips: 複数投稿表示ページでタイトル一覧をまず表示するで別バージョンが紹介されています。同じ日付に複数の投稿があると日付表示がうまくいかないらしいです。一日に複数記事なんて書かないから気付かなかった…。ちなみにクリボウの Blogger Tipsは、数少ない日本語のBlogger解説サイトのひとつです。

追記（2009/6/21）

Ito hisashiさんから、「うちでも以前からやってますよー」とのコメントを頂いたので、訪問してきました。

うーむ、やっぱりページ内リンクかぁ、そりゃそうだよなぁ。というわけで、このブログもページ内リンクに変更。なんだか、スキューバダイビングやりたくなったぞ、と。

追記（2009/7/16）

luckymeさんから、「ページ内リンクのコード教えて(><)」とコメントを頂いたので、以下にコードを。

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<ul id='post-title-navigation'>
<span>このページの記事一覧</span>
<b:loop values='data:posts' var='post'>
    <li>
    <b:if cond='data:post.title'>
      <data:post.dateHeader/> - <a expr:href='&quot;#&quot; + data:post.id'><data:post.title/></a>
    <b:else/>
      <data:post.dateHeader/> - <a expr:href='&quot;#&quot; + data:post.id'><data:post.id/></a>
    </b:if>
    </li>
</b:loop>
</ul>
</b:if>
</b:if>

クリボウさん所の便乗にさらに便乗した感はあるけど…。

あと、余談ですが、ページ内リンクの良し悪しについて書かれた記事があるので、ページ内リンクを導入しようと思っている人は一読する価値ありです。

というわけで、やっぱり個別記事へのリンクに戻します。つか、iPhone欲しいぞ。

JavaScriptでブラウザ判別するスクリプト

2009-05-24T13:46:00.026+09:00

本当なら、どんなブラウザであろうと同じ振る舞いをするコードを書くのが良いのだろうけど、そうもいかない場合もある。

そんな時、ブラウザの判別をする必要があるのだが、わずか12文字でブラウザがIEかどうかを判別するキュートなスクリプトを見つけたの紹介。

IE='\v'=='v'

The Spanner - Detecting IE in 12 bytes

下の"Do you use IE?"ボタンをクリックしてみよう。

上のサンプルは以下のように条件分岐させている。

IE='\v'=='v';

if (IE) {
  alert("You use IE.");
} else {
  alert("You don't use IE.");
}

ただ、上記のスクリプトではIEかそうでないかしか分からないから、実際にブラウザ判別するには、ユーザーエージェントで判断するのが一般的だろう。

というわけで、もうちょっとしっかりブラウザ判別したければ、"navigator.userAgent"を使えば良い。

下の"Your userAgent"ボタンをクリックしてみよう。あなたが現在使っているブラウザが吐き出しているユーザーエージェントが表示されるはずである。

例えば、Firefoxを見分けるには、ユーザーエージェントに"Firefox"という文字列が含まれているかどうかを調べれば良い。

if (navigator.userAgent.indexOf("Firefox") != -1) {
  alert("You use Firefox.");
} else {
  alert("You don't use Firefox.");
}

navigator.userAgent.indexOf("Firefox")は、"navigator.userAgent"から"Firefox"という文字列を検索して、一致する文字列があればその文字列の位置を、一致する文字列がない場合には"-1"を返す、というプログラムである。

もっとも、ユーザーエージェントは偽装可能なので、ユーザーエージェントで完璧にブラウザ判定が行えるわけではないので注意しよう。

検索エンジンにインデックスさせない方法

2009-05-21T15:00:00.005+09:00

検索エンジンにサイトやら特定のページやら特定のディレクトリやらをインデックスさせない方法の紹介。以下、GoogleとYahoo!のヘルプから抜粋。

メタタグでインデックスへの登録拒否

HTMLのメタタグの記述で、サイト内の特定のウェブページをインデックスに登録することを拒否できます。

<meta name="robots" content="noindex">

サイトのページを Google ロボットのクロールからのみ除外し、他のロボットにはクロールを許可する場合は、次のタグを使用します。

<meta name="googlebot" content="noindex">

YSTのインデックスへの登録を拒否する場合には、次のように記述します。

<meta name="Slurp" content="noindex">

特定のウェブページの、インデックスへの登録を拒否 - インフォセンター - Yahoo!検索メタタグによるサイトへのアクセスのブロック - ウェブマスター/サイト所有者ヘルプ

robots.txtでクローラーの巡回拒否

robots.txtで巡回を拒否する場合は、「robots.txt」という名前でテキストファイルを用意し、下記の内容を記述します。ファイルは、サイトのルートディレクトリに設置してください。

すべての検索エンジンのクローラーの巡回を拒否する場合

User-agent: *
Disallow: /

「User-agent: *」は、「すべてのクローラー」という意味になります。

特定のディレクトリ内のみの巡回を拒否したい場合は、「Disallow: /」に続いてそのディレクトリ名を指定します。以下はcgi-binというディレクトリのみを拒否対象にしたいとき。

Disallow: /cgi-bin/

Allowの使い方

「Allow:」は通常「Disallow:」と組み合わせて使用します。たとえば、あるディレクトリのなかの特定のウェブページだけを巡回してほしい場合には、次のように記述します。

Disallow: /foo/
Allow: /foo/bar.html

この例では、「foo」ディレクトリ以下は巡回を拒否するが、/foo/bar.htmlは巡回を許可するという意味を持ちます。

「*」記号

「*」記号は、任意の長さの、任意のURL文字列にマッチさせるときに使います。URL文字列のいずれの部分にも使えます。

User-agent: *
Allow: /public*/　・・・1
Disallow: /*_print*.html　・・・2
Disallow: /*?sessionid　・・・3

1. 「public」で始まるすべてのディレクトリへの巡回を許可
例：「/public_html/」や「/public_graphs/」も巡回されます。

2. 「_print」を含むすべてのファイルとディレクトリへの巡回を拒否
例：「/card_print.html」や「/store_print/product.html」は巡回されません。

3. URL文字列に「?sessionid」を含むすべてのファイルへの巡回を拒否
例：「/cart.php?sessionid=342bca31」は巡回されません。

「$」記号

「$」記号は、URLの末尾にある、任意の文字列をマッチさせるときに使います。

User-agent: *
Disallow: /*.gif$　・・・1
Allow: /*?$　・・・2

1. robots.txtが設置されたサイト以下で、「.gif」で終わるすべてのファイルへの巡回を拒否（「$」を省き「/*.gif」とすると、ファイルパスに「.gif」を含む、すべてのファイルの巡回が拒否されていることになります）

2. 「?」で終わるすべてのファイルへの巡回を許可

サイト単位、ディレクトリ単位での巡回の拒否設定 1 - インフォセンター - Yahoo!検索サイト単位、ディレクトリ単位での巡回の拒否設定 2 - インフォセンター - Yahoo!検索 The Web Robots Pages

JavaScript動作チェックツール

2009-05-10T01:06:00.017+09:00

JavaScriptの動作確認をするツールです。JavaScriptの動作テストを行うことが出来ます。

プログラムを入力してください

出力:
エラー:

※デフォルトで入力されているソースコードは、3の倍数と3がつく数字の時だけアホになるカウントアッププログラムです

※拝借したソースコードが掲載されている以下の連載は、プログラムとはどんなものかを味見することが出来ます

404 Blog Not Found:アマグラマーのすすめ - 目次

HTML特殊文字変換ツール

2009-05-08T22:52:00.035+09:00

HTML特殊文字、「&」「<」「>」「"」「'」を、「&」「<」「>」「"」「'」に変換するツールです。

HTMLや、Blogの記事の投稿などで、タグをそのまま表示させたい場合にお使いください。

変換したいソースコードを入力してください

Movable TypeからBloggerへの移行

2009-05-06T22:55:00.108+09:00

レンタルサーバー+Movable Typeに疑問を抱きつつ、ブログの更新を先延ばし続けていたわけだが、重い腰を上げて、ブログを移行することにした。

Movable TypeからBloggerに移行しようと思っている人はもちろん、初めてBloggerを始めようする人にも移行録を綴っておこう。

覚悟

ブログの移行にはそれなりの覚悟が要るが、リアル引越しと同じで、引越しをする度に無駄が排除されていくというメリットがある。引越しは繰り返せば繰り返すほど上達するものです。

過去に得たバックリンクを捨てる覚悟
過去に書いた記事を捨てる覚悟
今後、テンプレートカスタマイズに力を注がない覚悟

俺とBlogger

俺がBloggerを選んだのにはいちおう訳がある。

無料

ブログは無料が当たり前。何にでもお金を払えばその分良いサービスが得られるというのはウェブの世界では通用しない。

容量無制限

無限に広がり続けるウェブの情報を整理するのだから容量は多いほうが良い。正確には、1回の投稿記事容量の制限や、アップロードできる画像ファイルサイズの上限がある。

サーバレスポンス

格安サーバー+Movable Type or WordPressの不安定さ（主に格安サーバーがいけないんだけど）に嫌気がさして、無料ブログを色々試していたのだけれど、BloggerもといGoogleのサービスはさすが、記事表示や記事投稿もストレス無く動作する。ただ、記事が増えていってどうなるかが心配だけど。

Bloggerの設定

改行の変換以外に特別注意するような設定はない。以下はやっておいた方が良いかなという程度の設定。

フォーマットの設定

改行の変換 » いいえ: 基本的にローカルのエディタでタグ入力しながら記事を作成するので、改行タグの挿入は余計なお世話です。

コメントの設定

バックリンク » 表示: 自分の記事に言及しているブログなどを簡単に探すことが出来る。Bloggerにはトラックバック機能が付いていないのです。
コメントの投稿者に確認用文字を入力させますか？ » はい: スパムコメント撲滅。

アーカイブの設定

投稿ページを有効にしますか？ » はい: 単なる日記なら"いいえ"でも良いのかもしれないがちょっと…。

サイトフィードの設定

ブログフィードを許可 » 完全

フィードを全文配信にするか部分配信にするかは悩みどころではあるが、読者を増やしたいなら全文配信、トラフィックを増やしたいなら部分配信が良い。個人的にはフィードを購読してくれる熱心な読者ほど広告クリック率が低いので、アクセス数を水増ししなければいけない理由がない限り全文配信しよう。

フィードリダイレクト URL の登録 » FeedBurnerのURL

移転前からFeedBurnerを利用していたのであれば、移転前のFeedBurnerのURLを入力しておこう。その際、FeedBurner側の設定も忘れずに行うこと。

Edit Feed Details… » Original Feed: を

http://yourdomain.blogspot.com/feeds/posts/full

とすれば全文配信となり、

http://yourdomain.blogspot.com/feeds/posts/summary

とすれば部分配信となる。

と、ここまで書いておいてあれなのだが、このままだと2種類のフィードURLが存在することになり、移転前のサイトのフィード（この場合はFeedBurnerにリダイレクトする為だけのファイル）を削除してしまうと、以前からの読者が購読出来なくなってしまう。移転前のサイトのフィードを削除する場合は事前にフィードの登録変更を依頼しておこう。

最低限のテンプレートカスタマイズ

飽きっぽい性格であれば、テンプレートは極力いじらないほうが良い。なぜならテンプレートを変更するたびに、同様の修正を行わなければならなくなるのだから。

レイアウトテンプレートとクラシックテンプレート

Bloggerには"レイアウトテンプレート"と"クラシックテンプレート"の2種類のテンプレートが存在し、それぞれに異なるタグが用意されている。ここでは、"レイアウトテンプレート"の利用を前提として話を進めることにする。

スタイルシートは追記する

HTMLやBloggerの独自関数に手を加える場合、変更履歴を記録しておかなければ、後々元に戻すことが面倒臭くなるのだが、スタイルシートは追記することで時間が経っても変更箇所が一発で分かる。例えば、

code {
  color: black;
  }

code {
  color: red;
  }

と書くと、後者の"color: red;"が適用される。デフォルトテンプレートが用意されているブログシステムを利用しながらスタイルシートを頻繁に修正する場合、スタイルシートは修正せずに追記する方法がHoliday Webmasterにとってはメンテナンス性に優れているのでお勧め。

スタイルシートを書く時に俺が気を付けているのは、記事そのものに修正が必要になるのでクラスは使わないということと、記事本文内（.post-bodyとか）のクラスのみスタイルを適用させて、記事以外の部分のスタイルには手を付けないということ。

個別記事タイトルタグ

Bloggerのデフォルト個別記事タイトルタグは"ブログタイトル: 個別記事タイトル"となっている。タイトルタグはSEOにおいて最も重要なタグであり、SERPsで表示されるタイトルタグの文字数は決まっている為、必ず先頭に個別記事タイトルを持ってこなければならない。

これだけでSEOの8割が完成するくらい大事なことなので是非とも修正しておこう。その代わり、日付がh2タグだったりするのは目をつぶることにする。

before

<title><data:blog.pageTitle/></title>

after

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> :: <data:blog.title/></title>
</b:if>

Titleタグのブログ名と記事名の順番を入替える（その２）

記事のインポートとリダイレクト

残念なことに、Movable TypeからBloggerへの移行はちょっと面倒くさい。Bloggerは基本的に他のブログからのインポートが出来ないようになっているのだが、google-blog-converters-appengineというプロジェクトで解決できる。

記事のインポート

Movable Typeでログをエクスポートしたら、 google-blog-converters-appengine » movabletype2bloggerにて、先ほどエクスポートしたMovable Typeのログを選択して"Convert"すれば、あっという間にBloggerのインポート用xmlファイルが生成される。ただし、

NOTE: This hosted application will only allow downloads smaller than 1MB.

と書かれている通り、1MB以下という制限がある。

あとはBloggerでxmlファイルをインポートすれば、記事のインポートが出来る。インポート以前に投稿した記事は消えないので安心だが、念のため、「ブログをエクスポート」で、過去記事のバックアップを取っておこう。

手抜きリダイレクト

記事のインポートが完了したら、インポートした全ての記事へのリンクページを、アーカイブページのソースをコピーするなどして作成し、移転前のブログからそのリンクページへリダイレクトさせる、なんてのはどうだろう？手抜きした感はあるが、ブログのトップへリダイレクトよりはマシかなあと。

.htaccessでリダイレクト

「これぞ」という記事があるならば、やはりHTTP301リダイレクトがお勧めだ。.htaccessが利用出来る環境であれば、.htaccessに以下のように記述すればよい。

Redirect permanent /blog/2008/09/06010000.php http://naminorito.blogspot.com/2008/09/css.html

※) 改行しているように見えるかもしれないが、一行で記述しよう。

上記は、（http://ドメイン名を省略することに注意）"/blog/2008/09/06010000.php"から、"http://naminorito.blogspot.com/2008/09/css.html"へリダイレクトさせる記述で、リダイレクト元にこの.htaccessをアップロードしてやればよい。また、複数記事をリダイレクトさせる場合は、改行して同様に記述すればよい。

-------

今回は、Movable Type から Blogger への移行備忘録と書いたものの、メインテーマは"過去との決別"である。もし、「全ての記事を記事毎にリダイレクトさせて、リンク切れとかを無くしたいんだよ」という方は以下のリンクが参考になるかもしれない。

Movable TypeからGoogle Bloggerへの移行をこっそり目指すブログ、始めました。

CSSでレイアウトに合わせて文字数を制限する

2008-09-06T10:00:00.007+09:00

複数のAPIを利用してサイトをデザインしていると、予期せぬ事態が起こることがある。画像サイズがAPIによって異なったり、取得した文字数が多かったり…。これらはレイアウトが崩れる原因となる。

というわけで、今回は、CSSで文字数（行数）を制御しようと思う。

幅と高さが固定された要素に文字をたくさん入れてしまうと…

限られた領域に文字数を多く表示しようとすると、ブラウザによって領域が拡大されたり文字が重なったりして、レイアウトが崩れてしまう。例えば、幅を100px 高さを50pxに固定したボックスの中に、文字数をたくさん入れ込むと以下のようになる。

多い文字多い文字多い文字多い文字多い文字多い文字多い文字多い文字

少ない文字

IE6で見ると多い文字の書かれたボックスが高さ方向に拡大してしまい、Firefoxで見ると文字がはみ出して下の少ない文字のボックスと重なってしまっているのが分かるだろうか。

はみ出す部分は隠してしまえ

この状況を打破するためには、文字サイズを小さくしたり、文字数を減らしたりするのではなく、領域外を表示されないように指定してしまえば迷走しなくて済む。

line-height:1.5em;
width:100px;
height:3em;
overflow:hidden;

上のようにスタイルシートに記述すると、ボックスに表示させる文字の行数を制御することが出来る。

絶対2行しか表示させない絶対2行しか表示させない

「line-height」で一行の高さを決めて、「height」で行数を制御している。この場合は、line-height が 1.5em で、height が 3em だから2行表示されるようになる。ここで単位を「em」とすることで、訪問者がブラウザで文字サイズを変更した際も、文字サイズに合わせて行の高さとボックスの高さが調整される。

また、「overflow:hidden」ではみ出した部分を表示しないように指定しているので、文字数が多くて表示しきれない場合は、文字が表示されないようになる。

ブラウザで文字サイズを変更してみると、文字数が変化し、ボックスサイズを維持していることが分かるだろうか。

文字が消えることについては、賛否両論あるかもしれないが、これを覚えておけば、文字数や文字サイズに悩まされずに、柔軟かつ統一感のあるレイアウトが可能となる。

Amazon、楽天、バリューコマース（Yahoo!ショッピング）APIで取得した画像リサイズ

2008-07-25T11:00:00.003+09:00

当ブログはテキストメインで、非常にシンプルなテンプレートを利用している。それゆえに、画像が映える。というわけで、画像付き自作コンテンツマッチ広告作成に向けて、各種APIで取得した画像サイズを揃える方法を検討してみる。

各種APIで取得出来る画像サイズ

商品によって画像サイズは異なるが、おおよそ以下のようなサイズの画像を取得することが出来る。

Amazon Web サービスで取得できる画像サイズ

SmallImage	小さい画像	75pxくらい
MediumImage	中くらいの画像	160pxくらい
LargeImage	大きい画像	500pxくらい	大きすぎるので省略。

楽天ウェブサービスで取得できる画像サイズ

smallImageUrl	小さい画像	64px*64px
mediumImageUrl	中くらいの画像	128px*128px

バリューコマース・ウェブサービス（Yahoo!ショッピングAPI）で取得できる画像サイズ

vc:image class="small"	小さい画像	76px*76px
vc:image class="large"	中くらいの画像	146px*146px

画像URLをいじって画像サイズを揃える

Amazon Web サービス、楽天ウェブサービスでは取得した画像URLをちょいといじくることで、画像サイズを簡単に変更することが出来る。というわけで、バリューコマース・ウェブサービス（Yahoo!ショッピングAPI）の最小画像サイズ「76px*76px」に他のAPIで取得した画像サイズを揃えてみる。

Amazon Web サービスの画像サイズ変更

Amazon Web サービスで取得した画像URLは以下の通りである。

http://ecx.images-amazon.com/images/I/～～._SL75_.jpg
http://ecx.images-amazon.com/images/I/～～._SL160_.jpg

このURL中で画像サイズを決める要素が「SL75」「SL160」で、SL[～～]の「～～」を変更することで画像サイズを変更することができる。

例えば、

http://ecx.images-amazon.com/images/I/～～._SL76_.jpg

とすれば、画像の縦横の大きい方のサイズが76pxになる。

楽天ウェブサービスの画像サイズ変更

楽天ウェブサービスで取得した画像URLは以下の通りである。

http://thumbnail.image.rakuten.co.jp/～～.jpg?_ex=64x64
http://thumbnail.image.rakuten.co.jp/～～.jpg?_ex=128x128

このURL中で画像サイズを決める要素が「64x64」「128x128」である。

このURLを、

http://thumbnail.image.rakuten.co.jp/～～.jpg?_ex=76x76

とすれば、画像サイズが76px*76pxになる。

上記の方法で3つの画像サイズを揃えて並べると、

こんな感じで、画像サイズを揃えることが出来る。

ただし、このような画像リサイズ方法は非公式な方法であり、APIの仕様はいつ変更になるかわからないので、注意が必要だ。

PHP＋HTMLの記述で画像サイズを揃える

PHPとHTMLを利用すれば、ブラウザの見かけ上の画像サイズをリサイズすることが出来る。

HTMLの記述でリサイズ

バリューコマース・ウェブサービス（Yahoo!ショッピングAPI）には画像URLをいじって画像サイズを揃える方法は今のところ無さそうなので、画像サイズを変更したければ以下のようにHTMLで記述すれば良い。

<img src="画像URL" width="画像の幅(px)" height="画像の高さ(px)" />

例えば、画像の幅と高さを30pxにすると、こんなにちっちゃくなる。

PHPで画像サイズを取得しリサイズ

楽天ウェブサービス、バリューコマース・ウェブサービス（Yahoo!ショッピングAPI）で取得出来る画像サイズの縦横比は1:1になっているのだが、Amazon Web サービスで取得出来る画像は縦横比が異なる場合もある。だから画像サイズの縦横比を求めておかないと、画像が引き伸ばされて変なことになる。

こうならないようにするために、Amazon Web サービスではあらかじめ画像サイズを取得し、縦横比を計算しておかなければならない。

画像サイズ取得にはgetimagesize関数を利用する。画像高さを揃えてリサイズするには以下のようにPHPで書けばよい。

<?php
$imgurl    = "画像URL";
$height    = "画像高さ";
$imgsize   = getimagesize($imgurl);
$imgwidth  = $imgsize[0];
$imgheight = $imgsize[1];
$width     = round($imgwidth * $height / $imgheight); //縦横比を計算
echo("<img src=\"$imgurl\" width=\"$width\" height=\"$height\" />");
?>

たったこれだけで（見かけ上）画像のリサイズが出来る。

さて、これで画像サイズに悩まされることはなくなった。次は、広告デザインに入ろう。

PHPで3桁ごとに数字にカンマ区切りを入れる方法

2007-06-11T15:00:00.001+09:00

金額表示や、桁数の多い数値を出力する時は、3桁ごとにカンマで区切りを入れると閲覧者に見やすくなります。そのためには、number_format 関数を使います。

number_format 関数とは、数字を千位毎にグループ化してフォーマットする関数です。

プログラム

$a = 987654321;
$b = number_format($a);
echo $b;

出力結果

987,654,321

ちょっとしたことですが、こういう細かい気配りが出来る女性は、男性から好かれる、かも(^^)