挑戦する
「ハイライト」としてのフラッシュマガジンと、メニューおよびヘッダーの標準フォントの置き換えを含むDrupal製品カタログ。
行こう！
通常、将来のDrupal Webサイトのデザインレイアウトを開発して開発時間を短縮するとき、私は自分でシャベルで作ったフレームワークテーマを使用しました。 そして今回は、前のものと同じことをしました。 一般的な構造が開発されたため、フラッシュを固定する必要がありました。
最初の行き止まり。 Drupalテーマのフラッシュ
顧客の将来のサイトは、ソースコードへのアクセス権なしでホスティングにありますが、Drupal管理者の権利があるため、挿入されたflash要素の変更を禁止する必要がありました。 通常のswftoolsは放棄されなければなりませんでした。
ソリューションを長時間検索した後（DrupalテーマでHTMLに通常のFlashを挿入しても結果が得られないため）、次のコードを使用してFlashオブジェクトが挿入されました。
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="880" height="440" align="middle" class="header2"> <param name="allowScriptAccess" value="sameDomain" /> <param name="allowFullScreen" value="false" /> <param name="movie" value="/FLASH.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="#FFF" /> <param name="SCALE" value="noborder" /> <param name="wmode" value="transparent" /> <embed src="/FLASH.swf" width="880" height="440" align="middle" quality="high" bgcolor="#FFF" wmode="transparent" allowscriptaccess="sameDomain" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" scale="noborder" /> </object>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="880" height="440" align="middle" class="header2"> <param name="allowScriptAccess" value="sameDomain" /> <param name="allowFullScreen" value="false" /> <param name="movie" value="/FLASH.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="#FFF" /> <param name="SCALE" value="noborder" /> <param name="wmode" value="transparent" /> <embed src="/FLASH.swf" width="880" height="440" align="middle" quality="high" bgcolor="#FFF" wmode="transparent" allowscriptaccess="sameDomain" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" scale="noborder" /> </object>
-もちろん、コードは世界と同じくらい古いものであり、おそらく正しく構築されていないかもしれませんが、うまくいきました！ そして、これが主なものです。 しかし、挿入された要素はページのメインコンテンツに比べて多くのスペースを占有し、変更する予定はなかったため、このフラッシュムービーを1回レビューした後、ユーザーは将来それを見たくないと提案しました。 訪問者の注意をそらさないために、要素を「隠す」機会を与えると同時に、再びそれを見る機会を与える必要がありました。 理想的には、ページをリロードしないでください。
すぐに決定が下されました。 件名に単純なjQueeryを使用し、複雑ではない追加のjsファイルを使用する：
- DrupalにjQuery UpdateおよびjQuery UIモジュールをインストールする
- Drupalトピックで、必要なCSSを追加します（非表示または表示するブロック用）
- これらの要素を非表示/表示にするJSファイルをテーマに追加します
- クリックすると、同じアクションが実行されるボタンを作成します
驚いたことに、すべてが機能し、競合はありませんでした。 しかし、実際には効果は達成されませんでした。 別のページに切り替えた後、すべてが最初から繰り返されました。
2番目の行き止まり。 AjaxとDrupal
賛否両論を念頭に置いて苦労して検討した後、フラッシュの隠されたブロックが他のコンテンツとともに更新されないように、コンテンツのajaxロードを使用することにしました。
いくつかの検索の後、ネットワーク上でいくつかの解決策を見つけました。 私は最初のものを選び、作成中のサイトに合わせてそれをひねり始めました。 いわゆる「ソリューション」-ページレンダラー+非同期モジュールと、同じメーカーの対応するテーマ。 何らかの理由で、現在はdrupal.orgでは利用できません。 どうやら、この「解決策」の問題にぶつかったのは私だけではなかったからです。 一見、すべてが素晴らしかったです！ トピックをねじ込み、モジュールをインストールし、構成しました。 すべてうまくいきました！ さらに、非常にうまく機能しました。1つまたは別の内部リンクをクリックすると、手段によって分割可能なCSS divが表示され、ロードが行われていることが通知されます。 トピックのいくつかの詳細に取り組み、すべての準備ができたときに、サイトにほとんどの情報（テキスト、写真など）を入力し始めましたが、最も悲しいことが起こりました：Wysiwygエディターと私にとっても重要ないくつかのモジュールは動作を拒否しました。 彼らはいなくなったようです。 ラップトップで眠れぬ夜を何回も過ごし、タバコを何ブロックも吸っており、紛争を解消して捜索して数十リットル以上のコーヒーを飲んだため、私はこの「美しさ」をすべて捨てて、別の解決策を探し始めました。 そして、それが見つかりました：
- AjaxITモジュールを（既にインストールされているjQuery UpdateおよびjQuery UIに加えて）インストールし、必要なライブラリを更新/インストールすることを忘れない
- サイトのテーマに応じて設定します（すべて非常にシンプルです）
そして、「ああ、神様！」-それは動作します！ 確かに、美しいブート要素は表示されません。 しかし、これは、気にする人にとっては、自分でそれを台無しにすることは難しくないと思います。 うまくいったとき、私は喜びのためにしか踊ることができないように思えましたが、そこにはありませんでした。 標準フォントを自分のものに置き換えることを忘れていました。
第三の行き詰まり。 Drupal + AjaxIT + Cufon =競合
私はCufonモジュールとそのためのJS のフォントコンバーターを使用することに慣れています。 しかし、今回は、通常のアクションをすべて完了しても、結果は得られませんでした。 最初は、問題はフォントにあると思っていましたが、すでにテスト済みの別のフォントを適用した後、再び何も得られませんでした。 その後、@ font-faceプロパティが頭に浮かびました。
4番目の行き詰まり。 @ font-faceおよびOpera
World Wide Webの荒野を長い間調べることなく、私はフォントフェースジェネレーターを見つけました。その操作は私には非常に簡単に思え、私に警告しました。 しかし、 Adobe BrowserLabでクロスブラウザー互換性についてサイトをテストした後、シンプルさの注意は言い訳を見つけるようには見えませんでした-世界的な「最愛の」ロバでさえ時計のように働きました。 しかし、うれしそうなニュースと、サイトをテストし、画面を表示するというリクエストで行われた作業について自慢したいという気持ちで友人に電話をかけたところ、彼女から手紙を受け取ることにto然としました-彼女が使用したOpera（10.50）では、慎重にねじ込んだフォントは表示されませんでした。
コードを使用して、いくつかの熟考と適切な解決策の発見を試みた後：
@font-face {
font-family: '';
src: url('_normal-webfont.eot');
src: local(''), local('-Normal'), url('_normal-webfont.woff') format('woff'), url('_normal-webfont.ttf') format('truetype'), url('_normal-webfont.svg#') format('svg');
}
-望ましい結果になりました。 私の興味を引くすべてのブラウザー（私のプロジェクトのロシア語ユーザーの30％以上が好むOperaを含む）は、私が望むようにフォントと他のすべてのコンテンツを表示しました。
IE6でPNGを表示するためだけに残ったため、Drupalのモジュールを使用しました-PNG behave。 そして彼は尊厳をもって仕事を遂行しました。
質問がある場合は、このプロジェクトを作成するときにこのテクノロジーまたはそのテクノロジーが私を駆り立てた「行き止まり」のそれぞれについて詳しく説明し、結果へのリンクを提供します。