スロバーのgif drupalのホスティング

2012年9月25日12時44分にDrupionサポートが提出しました

それはあなたが簡単に彼らは完全に異なるページをロードすることによって、観客に不便を生じさせることなく、ページ上のより多くの情報を表示することができますので、モーダルウィンドウは、優れたデザインの特徴です。私は別のページ全体の負荷に値するに十分膨大ではありませんより多くの情報を表示するモーダルを使用しています。

図1：これらは、クリックされたときは、追加コンテンツとモーダルウィンドウを誘発するとの見方によって生成されたタイトルのリンク、です。

Drupalの中でホスティングスロバーのgifのDrupal

図2：図1に示すように、リンクをクリックした後、モーダルウィンドウには、追加情報が表示されます。

簡単にDrupalの中でのモーダルを作成するには、2つの一般的な方法があります。第一、及び一般的な方法は、カラーボックスまたはLightbox2モジュールを使用することです。両方のモジュールは、いくつかの組み込み機能を持っていると、サイトビルダーレベルで設定することができます。

より多くのテーマを制御し、モーダルの内容、およびモーダルウィンドウがどのように機能するかの知識を得るために、私はアールマイル（カオスの別名マーリン）カオスツール、またはモーダル作成CTools方法に突入しました。ここで私はそれをやった方法です。

このチュートリアルでは、あなたがこれを行うためのモジュールを構築する必要がありますDrupalの7の理解の高度なレベルの中間が必要です。

1.私たちは、「ハッピー」を私たちのモジュールに名前を付けるので、あなたのDrupalは名付け、サイト/すべて/モジュール/幸せをインストール内のディレクトリを作成します。

「幸せ」ディレクトリ内には、2つの空白のファイル、「happy.module」と作成「happy.infoを」。また、ダウンロードしてCToolsモジュールおよびビューモジュールを有効にします。 CToolsモーダルの依存関係、およびビューとしてこの例の依存関係です。

また、モジュールディレクトリ内のモーダルカスタマイズに次の行を追加します。

  • 例えば、 'サイト/すべて/モジュール/幸せ/のJS / happy.js'）内の "happy.js" と "JS" フォルダ。
  • 例えば、内の「happy.css」と「CSS」ディレクトリサイト/すべて/モジュール/ CSS / happy.css '）。
  • GIFファイル（必要な場合）、例えばスロバーカスタムAJAXs用画像ディレクトリサイト/すべて/モジュール/幸せ/画像/ [画像名] .JPG "
  • サイト/すべて/モジュール/幸せ/テーマ」で、そのディレクトリ内のビューテンプレートは、このチュートリアルでさらに沿って、当社のカスタムビューテンプレートのテーマディレクトリに配置されます。

2.「happy.info」ファイルにモジュールを構成します。

オープン、ファイルに以下の貼り付け、保存します。

名=ハッピー
説明はCToolsフレームワークを使用して、モーダルウィンドウを作成するための例示的なモジュールを=。
コア= 7.xの
パッケージ=ユーザー・インターフェース
PHP = 5.2.4
依存関係[] = ctools
依存関係[] =ビュー

サイドノート：この例の目的のために、私たちは、クリックされたとき、モーダルウィンドウ内のノードのコンテンツを開くのノードへのリンクのリストをgeneratするビューを使用しています。したがって、この例では、ビューは依存性があります。

スロバーGIFのDrupalとモジュールを構成するホスティング

3.「happy.module」を開き、保存し、上部にある標準のDrupalモジュールの足場を置きます。

4.最初のステップは、モーダルウィンドウが表示されたら、モーダルリンクが開きますメニューパスを定義することです。

ここで高度点のカップル：CToolsモジュールは、要求パスのプレースホルダとして「％のctools_js」を識別する。 CToolsは、ユーザーのブラウザのJavaScript機能に応じて、「JS」または「nojs、」とそのプレースホルダの引数に置き換えられます。 「ページのコールバックは、」我々は次の定義する機能です。重い物を持ち上げるのほとんどが行われる場所です。最後に、この例では、アクセス制限はありません。それは、「ページのコールバックが」TRUEに設定されているので、匿名ユーザーは、モーダルのコンテンツにアクセスすることができ、あります。

5.「ページのコールバック」関数を定義します。

それは複雑に見えますが、上記の機能は単純明快です。ユーザーのブラウザは、Javascriptをサポートしていない場合、CToolsによって私たちのために決定されるように、我々は彼らに非Javascriptのコンテンツを提供します。そうでなければ、我々はCToolsモーダルをオフに解雇し、それらにノードのティーザービューモードを与えます。

6.次に、私たちは親のページのロードにモーダルウィンドウの設定を注入する必要があります。

あなたはこれを行うことができますDrupalはページのコンテンツレンダリングフック関数の数です。次のコードが動作する例示フックhook_node_view（$ノード - >コンテンツ・オブジェクト・ピースを変更する）、hook_block_view、hook_field_load、等が挙げられます

この例の目的のために、私がクリックしたときに、モーダル内部ノードのティーザーが表示されていることをノードのタイトルの表示を生成しています。そのために、私は、ビューのフック、hook_views_pre_renderを（）を使用しました：

これは、モーダルを作成するときに書くことがたくさんあります。要約すると、我々はCTools JSファイルのすべてをロードする必要があります。その後、我々はCToolsの設定配列（この例では、$ happy_style）を使用して、モーダルの大きさと機能を定義します。そして最後に、我々はモーダル内容をテーマ設定に必要な設定は、JavaScriptファイル、およびCSSファイルを注入します。

7.モーダルウィンドウが表示されるようにトリガするリンクを定義します。

これまでのところ、私たちはモーダルの内側に表示されるページとコンテンツを定義している、と私たちはモーダルの初期のスタイルを定義しています。今、私たちは、モーダルウィンドウを開きますトリガを定義する必要があります。本当に必要とされるすべては、特定のCToolsクラスとのリンクです。私は、ビューを使用しておりますので、私は、リンク可能なタイトルの私のリストのためのビューテンプレートを定義するつもりです。そうすれば、私はCToolsを認識トリガするビュー内のリンクを変更することができます。

また、あなたはhook_preprocessフックを使用して、テーマ層の上にモーダルを誘発する、またはサイトのテーマディレクトリ内のビューテンプレート内のリンクを定義することができます。

私は、同じモジュールディレクトリ内のカスタムモジュールのすべての機能を持っていることを好みます。それはきれいです。したがって、私はハッピーモジュールディレクトリ内のビューテンプレートを作成することにしました。

ここでは最良の方法です。最初のテーマとビューテンプレートを登録します。

このことを宣言した後、あなたは[module_dir] /テーマディレクトリを作成して配置する必要がありますの見解・ビュー・フィールド - happy.tpl.php 'ファイルの内部。初期の内容については、ビューモジュールのテーマディレクトリ内にあるビュー・モジュールのデフォルトの「ビュー - ビュー - fields.tpl.php」テンプレートの内容を、使用しています。

私はhook_themeを登録してhook_theme内で、ビューテンプレートを宣言しているので、私が作成したタイトルリンクの最終的な表示と口論するビューhook_preprocess_view（）を使用することができます。

happy.tpl.phpファイル - この時点では、変数$ ctools_linkはビュービューフィールドで私に利用できるようになります。そのテンプレート内では、単純に行を追加します。

9. Javascriptのファイル。

私たちは、CToolsモーダルを作成するためのPHPのTASSのすべてを達成しました。今、私たちはJavaScriptに注意を向けます。

あなたはctools_ajax_exampleモジュール内部のデフォルトCToolsモーダルJSファイルで始めることができますが、私はあなたが始めるために必要なすべてを宣言し、あなたのためにそのファイルを単純化してきました。

ここのサイト/すべて/モジュール/幸せ/のJS / happy.jsファイルの内容です：

10.今、あなたはモーダルをスタイルする準備が整いました。

サイト/すべて/モジュール/幸せ/ CSS / happy.css '、スタイルあなたの好みにモーダルウィンドウを使用しました。

この時点で、あなたはでCToolsモジュール内部の拡張ヘルプhtmlファイルを消費するまで、Googleのを避けるため、詳細については、Drupalの7のCToolsのモーダルを作成しているのサイト/すべて/モジュール/ ctools /ヘルプ/ modal.html」。

Drupalの7とハッピーModaling！

このビデオを見て！

関連記事

マルチサイトdrupalのホスティング複数のDrupalサイトを実行している場合は、管理を簡素化することができますし、マルチサイト機能を使用してサイトをアップグレードすることができます。マルチサイトでは、単一のDrupalを共有することができます...
Webfmモジュールdrupalのホスティング私は、ユーザーがビデオ、オーディオ、画像、ドキュメント、テキストなどのメディアコンテンツの様々な異なる種類をアップロードすることができますウェブサイトのアーカイブを作成しています。私は、ユーザーにためやすいようにしたいです...
DrupalはSSLでホスティングHTTPSはHTTPリクエストとその応答を暗号化するプロトコルです。これがあれば、誰かがあなたのコンピュータおよびあなたが要求しているサーバー間のネットワークを危険にさらすことができたことを保証します...
ファセット検索のApache Solrのdrupalのホスティング注意：最後にこのブログの記事を投稿する動機を提供するためのダグ・ヴァンへの余分な特別な感謝を！早期のDrupal 8の検索APIとSolrの関連モジュールが早いアルファにあった2016年、中...
drupalの複数のサイトをホスティングシステム管理者や開発者は、マルチサイト構成は同じサーバー上で複数のサイトをホストすることもできます多くの理由があります。例えば、このような構成ができます...