BiND Archive

BIND4のブロックエディタで編集を行い、ロールオーバーの画像に角丸の画像ファイルを使ったところ背景が透過されずイメージ通りにならないので疑問を持ちました。
同じページの目次ボタンのブロックではうまく表示されるのです。

透過ファイルには、GIFか PNGファイルを使います。ところが、BIND4はロールオーバーに GIFファイルを指定すると保存時に JPGファイルに変更してしまいます。このため角丸の画像の場合、背景が透過されません。ならば PNGファイルならよかろうとロールオーバー画像に指定しましたが、背景が透過されません。

ソースファイルを眺めて見ると CSSに違いがありました。透過させるにはカスタムタグで追加する必要があります。
（左の画像は拡大できます）

ロールオーバーをする画像の前後にカスタムタグを追加したことでロールオーバーの背景画像が透過できるようになりました。

上段は、カスタムタグがないPNG画像の場合、下段はカスタムタグを追加した同じ画像ですが，複雑なものでも綺麗に透過されています。
BIND4でロールオーバーが簡単になったので、CS5のDreamweaverを使うことが減りました。それくらい気に入っている機能でした。角丸の画像を使っていなかったので気づかなかったのですが、同じような悩みを持っている方の参考になれば良いのですが。
まとめです。ロールオーバーで背景画像を透過させる場合、背景を透過した PNG画像を使い、その画像の前後にカスタムタグを追加します。
<span class="img noborder"> 画像ファイル </span>

先日、Adobe Air 3.0にアップデートしたことから、 BiND4の [テーブルパーツ]編集画面が表示されなくなりました。BiND4を使っているときにアップデートを促されたので迷わずクリックしてからテーブルの編集ができなくなったのです。
来週にはテーブルを編集しなければならずHTMLソースで書き直すことを考えていました。

昨日になって、Adobe Air 3.1のアップデータが配布され、アップデートすることで問題が解決しました。肝心のデジステのサポートには何も情報がなく利用者は放っておかれたような状態、社員の研修と称してお留守なので仕方がありません。

ともかく従来のように使えることになり一安心です。他社製のソフトを組み合わせている BiNDは、他社ソフトのバージョンが変わり問題が発生した場合、どうしても対応が遅くなってしまいます。非常に便利なソフトであることは認めますが、営業用に導入する際はリスクを覚悟しないといけません。以前、メールフォームを使って懲りましたから、CGIを使ったものに変更したことがあります。一度、導入すると後戻するには、かなりの知識が必要になります。

BiND4 Macintosh版が Safari5に対応するためアップデータが公開、環境が該当するためアップデートをしました。

修正内容は、ブロックエディタとテーブルパーツの動作不具合ですが、該当する事象になる操作をしていないので気が付きませんでした。

アップデータを直ぐにはインストールしないのですが、新たにページを追加するため不具合があっては困ると思いインストールしました。

ところが昨日までの二日間、異常終了に見舞われること 7回、その都度、やり直しになり参りました。BiND4は更新後、直ぐアップデートすると遅くなることが多々あります。画像ファイルを扱ったあとなどは極端に遅くなります。それを防ぐため、編集終了後、一端終了させ、改めて BiND4を開いてからアップデートするようにしています。この方が早くアップデートが終了するのです。出来の悪いソフトと感じるときです。

更に、いつの間にか、ブロックエディタのブロックスキンが2種類程度しか表示しなくなりカラーを指定できなくなりました。古いページでは問題がないのですが、新しく作ったページでは選ぶことができず困ってしまいました。そのため古いページのブロックをコピーしたりしました。

今日になってブロックエディタを開くと、ブロックスキンが正常に表示されるブロックもあり、何が原因か分かりませんが、まだバグが残っているような気がします。BiND5に移行すれば現象がなくなるのかアップグレードのタイミングを図りかねています。

【追記：10/09】
毎日、更新作業を行うのですが、数回は異常終了してしまいます。アップデート前はこれほど酷くはなかったので困ってしまいます。編集の都度、保存を行うことを徹底しました。ついでに画像パーツを作る際、アイテムブラウザにサムネール画像の表示が極端に遅いので「ユーザ／ライブラリ」内の「Preferences」フォルダにある「BiND4 Cache」をゴミ箱へ移動させました。その結果、アイテムブラウザの表示が速くなりました。「BiND4 Cache」フォルダは再起動の際、自動的に新しいものができます。

【追記：11/20】
「BiND4 Cache」を削除してから 1か月以上経ちましたが、いちども異常終了することがありません。「BiND4 Cache」のサイズは 60Mほどでしたが、これだけのサイズで異常終了していたのかは分かりませんが、ともかく安定しましたので一安心です。
アイテムブラウザにサムネール画像の表示が極端に遅くなった方は試しても良いと思います。

ときどき画像の中の一部にリンク先を設定（イメージマップ）したいことがあります。 左の写真では、はやとの風のプレートをクリックすると JR九州へリンクさせていますので試してください。リンク領域の形状はいろいろありますがプレートなので四角形（rect）にしました。

BiND4の場合、ブロックエディタで画像パーツを使ってイメージマップを作ることができません。カスタムタグを使う必要があります。
予め、画像ファイルは、_userdataフォルダ内に imageフォルダを作成し、その中にファイルを入れておきます。今回の例は、ファイル名を test.jpgとします。

カスタムタグでは、次の HTMLソースを書きます。
<IMG SRC="../_userdata/image/test.jpg" ALT="plate" border="0" usemap="#plate">
<map name="plate">
<area shape="rect" coords="37,77,214,175" href="http://www.jrkyushu.co.jp/trains/details/hayato/index.html">
</map>

悩むのはリンク領域の座標（coords）の求め方かも知れません。ところが、簡単に座標を求めることができます。

Photoshopなどでリンク領域の左上にマウスを置くと、XY座標が表示されます。同じように右下にマウスを置くと XY座標が表示されるのでメモします。それをcoords=",,,"に記入するだけです。

リンク領域はいくつも設定できるので工夫してみてください。
多角形の指定は shape="poly"で行いますが、Photoshopなどを使えば簡単に角の座標を調べることができますから試してください。

イメージマップについての分かりやすい解説はこちらのページにあります。

昨日、予約していた 「BiND for WebLiFE*5 コンプリートセット」が届きました。購入済みの BiND Sites Collectionが LIONに対応しないためコンプリートセットを購入しました。一度作れば、Sites Collectionなど必要ないのですが、もしかして・・・と心配になっての高い買い物です。

地方にいると雑誌などは発売日の 2〜3日後にならないと購入できませんが、デジタルステージは、発売日に商品が届くように発送してくれるところが嬉しいサービスです。ジャストシステムは予約していても発売日以降でないと届きません。先日購入した ATOK11は一日遅れでした。予め予告されますから文句も言えませんが、配達日指定で発売日に届けることができると思うのですが・。

発売日に届いたと言っても、直ぐにはインストールしません。LIONに移行するための準備として割引額がお得な内に購入しただけです。ほかのソフトが LIONに対応してくれるまでは慎重に現行のままにします。新製品ですからバグも残っている不安もあります。

【追記：09/20】
デジタルステージからアップデーター (v.5.02 build960)が配布されていました。BiND5の評判はあまり良くないようですが、アップデータの内容を見るとかなりのバグがあったようです。今回は、LIONと重なったので慎重になりインストールを控えて良かったと思います。
今更、デザインを変える予定もありませんから、まだまだインストールはしません。

【追記：11/15】
そろそろ BiND5をインストールしようかと思い、デジタルステージのサポートを確認すると 10/07付けのお知らせがありました。気になるのは［テーブルパーツ]編集画面が表示されないということ、1か月が過ぎても改善されていないようです。
「Adobe AIR 3.0」をインストールすると発生するのでアップデートするなというのですが、とっくにアップデートしてしまいました。Adobeが悪いとでも言いたげなデジステです。
BiND4でも［テーブルパーツ]を編集するためエディタを起動すると、表示されなくなってしまいました。たまに表示されることもありますが、来週には使う予定があり困ってしまいました。
以前、Googleの仕様変更でフォームが使えなくなりCGIのものに作り直したことがありますが、今回も［テーブルパーツ]を使ったページをHTMLで作り直さなくてはと考えています。いつも対応が遅く困ったソフトです。 BiND5に移行するのは更に遅くなりそうです。

【追記：11/19】
Adobe Air 3.1が配布されアップデートすることにより、BiND4で［テーブルパーツ]編集画面が表示されるようになり一安心。他社のソフトを組み合わせている BiNDは、トラブル解決は他社任せになり時間がかかるので営業用に導入するにはリスクを伴います。

昨日、デジタルステージから BiND5の案内がありました。9月2日発売ですが 8月11日より予約受付開始ということです。

BiNDを購入して以来、全てのバージョンを予約購入していますが、一度使うと後戻りできないため諦めて使っています。BiND4になって少し使いやすくなりましたが、基本となる部分は使い勝手が悪く残念です。メールでは新機能をアピールしていますが、ただ、ただ使いやすくなってくれるだけで満足ですが・・・。

アップグレードの内容が分からないのですが、この時期を逃すと値引きが少なくなるので予約は続けなくてはと考えています。ただ、OSの条件が 10.6.8以降となっており、未だに 10.6.7のままなのでインストールはできません。購入だけして使うのは年末以降かな。

【追記：08/12】
昨夜、デジタルステージから BiND5のバージョンアップの優待コードが送られてきました。長いメールに優待コードがあり、BiND5コンプリートセットの場合、70%オフで 24,800円でした。使わないものも含まれているので、プロフェッショナルセットで十分ですが、コンプリートセットを予約しました。70%引きを強調していますが、そもそももとの価格が怪しげ、いつもの手口ですが慣れました。在庫数を表示して煽る手口も変わりません。今回は、減るペースが速いと思います。意外と売れているのですね。

先日試したphotosliderですが今後使うにあたり手間をできるだけ減らすための工夫が必要になりました。そんな時、使うのが Numbersです。

ダウンロードした photosliderを、BiND4の_userdataフォルダ内 jsと cssにそれぞれ入れてあります。BiND4のスクリプトと詳細設定で、jsと cssを読み込む設定をするほかブロック編集でカスタムスタグを作成し以下のようなソースを貼り付けます。
<div class="photoslider" id="default"></div>
<script type="text/javascript">
$(function(){
FOTO.Slider.loadingURL = '../../_userdata/image/loading.gif',
FOTO.Slider.baseURL = '../../_userdata/photo/110725/';
FOTO.Slider.thumbURL = 'thumbnails/110725_{ID}.jpg',
FOTO.Slider.mainURL = 'images/110725_{ID}.jpg',
FOTO.Slider.bucket = {
'default': {
0: {'thumb': '1.jpg', 'main': '1.jpg'},　　(A) Numbersで作成
1: {'thumb': '2.jpg', 'main': '2.jpg'},
2: {'thumb': '3.jpg', 'main': '3.jpg'},
:
:
27: {'thumb': '28.jpg', 'main': '28.jpg'}
}
};
var ids = new Array(1,2,3,・・・,27,28);　　(B) Numbersで作成
FOTO.Slider.importBucketFromIds('default',ids);
FOTO.Slider.reload('default');
FOTO.Slider.preloadImages('default');
FOTO.Slider.enableSlideshow('default');
FOTO.Slider.duration = 1500;
});
</script>

写真が多くある場合、(A)の赤字の部分をブロック編集内で写真の枚数分だけ繰り返し作業をするには面倒です。単純に数字を増やすだけにしてありますが 50枚ほどあったらうんざりします。繰り返しの単純作業には Numbersを使い、できあがったものをコピー・ペーストすれば効率があがります。

Nubersに次のような式を使い、文字を連結します。各セルはテキストに設定しておきます。

セルB1、D1、F1の数字を変化させます。1行目のセルを選択しドラッグすれば、あっというまにできあがります。A列の赤い部分をコピーして BiND4のカスタムタグの該当部分にペーストします。

次に、（B)の横にファイル番号をカンマでくくる作業ですが、とてもブロック編集では耐えられません。Numbersで一行だけのセルを作り、数値を入れ範囲を選択してドラッグさせると直ぐにできあがります。これを数字をカンマでくくってくれる CSV形式で書き出します。

書き出した CSVファイルを開き、コピーして BiND4のカスタムタグの該当部分にペーストします。

表計算ソフトは、ちょっとした作業にも使うと便利ですから繰り返しの多い作業などに重宝します。

デジカメの写真を全て使うことはなく、ファイル番号がバラバラになるのでスライドショーに使うものはコピーした後、Adobe Bridge CS5でファイル名を変更して使っています。例では、「日付_番号.jpg」となっています。その後、写真のサイズを小さくするため、Adobe Photoshop CS5の自動処理で WEBフォトギャラリーを作成し、できあがったimagesとthumbnailsを使っています。

ファイル番号を統一すれば、カスタムタグで変更する部分が少なくなり、写真の枚数分に合わせることと以下の部分を変えるだけで簡単に終えることができます。
FOTO.Slider.baseURL = '../../_userdata/photo/110725/';
FOTO.Slider.thumbURL = 'thumbnails/110725_{ID}.jpg',
FOTO.Slider.mainURL = 'images/110725_{ID}.jpg',

いろいろなソフトを使っていますから馴染めないかも知れませんが、スライドショーの作成がとても楽になりました。写真のスライドショーは photoslider.cssを変更して使っていますので、photosliderの詳細についてはインターネットで検索してください。

先日、BiNDによる更新作業を行っていたところ異常終了となり、いつものことと気軽に自動の再修復を待ち、修正箇所が修復されていなかったので修正しアップロードさせました。

その後、気がつけば BiND4に組み込んだ Spryが FireFoxや Operaのプレビューで動作しないことに気付き慌てました。それぞれアップデートが行われているので原因は分かりませんが Spryを使ったスライドショーを止めることにしました。

次は何を使うか探したところ、「ゼロからはじめるPhoto Slider」という古い記事をみつけ試すことにしました。記事を見る限りでは簡単だろうと思ったのですが二日間悩み Blogどころではなくなりました。

サンプルとなる記事を参考に作ったのですが、手こずったのは、サムネイルと写真の表示される枚数が異なりサムネイルの枚数が少なくなるのです。写真の枚数を減らし試すも不一致のままでした。

スクリプトや CSSを何度も直したりしたのですが一向に直らず、一晩経って初めから考え直すことにしました。使う写真のサイズがサンプル記事とは違うため CSSを修正してありましたので CSSの修正箇所を一つ直しては確認する方法で試しました。

原因は、サムネイルの写真サイズの指定は記事のサイズと同一にしないと photolider.jsの中で計算しているため自分勝手なサイズを指定してはいけなかったようです。photoslider.cssを修正した結果、表示される枚数はサムネイルとメインの写真とも同じになりました。まさかサムネイルの写真サイズで表示枚数が変わるとは思いませんでした。

これで一段落と思いきやサムネイルの写真とメインの写真が異なることに気づきました。それも一部だけ、写真を確認するとサムネイルの写真の順番が狂っていました。原因は Adobe Bridge CS5を使った際にファイル名順にソートされている状態でファイル名を変更したため作成日時順とは異なったためでした。Adobe Bridge CS5は写真のファイル名を統一するのに使っています。変更を何度もやり直しているうちにパニクってしまったようです。老いを感じた二日間でした。

昨日、デジタルステージからショックなメールが届きました。今月発売されるMac OS X「LION」をインストールするとデジタルステージの製品の内、LiFE* with PhotoCinema 3と motion dive 5 compact for VJ 以外は使えなくなるというメールでした。

OSのバージョンアップが行われる都度、使えなくアプリケーションが発生するのは、ある程度仕方がないことですが、ID for WebLiFE は既に見放されたソフトで、完全に使えなくなってしまいます。保存した今までのページを見ることもできなくなります。LIONには、「Rosetta」が含まれないことは既知の話だったはず、もっと早くサポート終了を表明すべきだったと思います。

BiND4については、次期メジャーバージョンアップまで LIONをインストールすることができません。先週、デジタルステージが、BiNDの次期バージョンへの要望アンケートを行っている程度ですから、いつになったら解決するのか分かりません。毎日、更新を続けているので困りました。LIONの価格は 2,600円ですから、それほど問題はないだろうと思っていました。

先日、Toast11を40％引きで購入しましたが、これもLIONに対応するのか気になります。アドビとマイクロソフトの製品は LIONの発売前ということで購入を控えています。アプリケーションの割引率が高くなると在庫整理ですから、この夏は LIONに対応と表示がある製品か気をつけないといけません。ATOKは表示していましたので予約しました。

BiND4の解決策として、Windows版を購入して移行してしまうか、LIONを使うMacを別途購入するか、現状のままOSのアップグレードは行わないの何れかにしなくてはいけません。

先日、配布された Mac OS X 10.6.8のアップデーターをインストールしてトラブルになっている人のブログを見かけます。最近のアップルのソフトはトラブルがつきものです。iPhotoの写真を消失したショックは忘れられません。未だに困っています。

LIONが楽しみですが不安もありますから、しばらくは、現状のまま使うことになりそうです。自動でソフトウエア・アップデートを行わないように気をつけなくては・・・、LION導入の準備となるMac OS X 10.6.8は当面インストールしません。

BiND4でテーブルを作る場合、ときどき、DreamweaverCS5で作り、HTMLソースをコピーしてBiND4のブロック編集でHTMLタグにペーストして作っています。
ところが、セルの中にテキストと画像が含まれる場合、テーブルが崩れてしまうことがあります。

BiND4のHTMLタグが次のような場合、（CS5で作ったHTMLソースをコピーしたとき等）

セルに画像が含まれるとテーブルが崩れ、ミーアキャットがはみ出してしまいました。
これは、レッサーパンダの後にタグがないために発生します。
誤った場所ではない部分が崩れているので気づくのに時間がかかりました。

テーブルの崩れを防ぐためには、２通りの方法があります。
(1)タグを追加する。

(2)テキストをHTMLタグ内に入れるのではなく本文で扱う。
　これが正しい使い方だと思います。

マニュアルを読まず使っているので間違いに気づかずテーブルが崩れ慌てたことが何度か、CS5で確認していますから、HTMLソースをペーストした際にタグがないとは気づかないものです。
同じようなことでお悩みの方に参考になるでしょうか。