Orchard CMSを使用してゼロからWebサイトを作成する方法。 パート1. Orchard CMSの概要（続き）

^{これは記事の続きで、 このアドレス から 読み 始め ます}
Orchard CMSコンテンツ管理システムの紹介の最初の部分では 、システムに精通し、数分でダウンロードして最初のサイトを立ち上げました。 WebMatrix開発ツールを使用して、Orchardを自動的にダウンロードして展開する方法を学びました。

ガイドの続きを次に示します。ここでは、Orchard CMSコントロールパネルに精通し、サイトの最初のセットアップを行い、サイトテーマを選択し、コードとデータベースを操作し、潜在的な問題についてサイトを分析し、サーバーにサイトを自動的に公開します 。

Orchardの自動ダウンロードは 、WebツールのクイックアクセスツールであるWeb Platform Installerを 使用して アプリケーションギャラリー から利用できることを思い出させてください （ このリンクを クリックし てインストールを開始します ）。

オフィスオーチャードCMS

Orchard CMSベースプロジェクトの読み込まれたページは、タイトル、ナビゲーションバー、4つのテキストブロック、およびプロジェクト管理パネルへのダッシュボードリンクがある「フッター」を備えた、明るくてシンプルなサイトです。

コンテンツ編集

各テキストブロックの右上隅に編集要素があることに注意してください。 このプロパティを使用すると、ブロックの内容をすばやく変更できます。 最初のブロックで[編集]をクリックすると、管理パネルのコンテンツ編集ページに移動します（図1.14）。


図 1.14。 管理パネルでブロックのコンテンツを編集する

エディターを使用して、テキストブロックのタイトルと内容を変更し、[今すぐ公開]をクリックします。 新しいコンテンツがすぐにページに反映されていることがわかります。

次に、地下のダッシュボードリンクを使用して、サイトのメインページから管理パネルに戻ります。 管理パネルのウェルカムページが表示されます（図1.15）。

新しいページを追加する

知っているように、便利な管理パネルを作成することは、Orchard CMS開発者の重要な目標の1つです。 現在、このパネルには非常に豊富な機能があり、コンテンツ管理ツールが直面するすべての問題を解決できます。

• ページ、セクション、ブログの作成と削除。
• コンテンツの編集、メディアコンテンツのダウンロードと管理。
• モジュールのロードとインストールされたモジュールの管理。
• テーマを適用します。
• ウィジェットを管理します。
• 役割とユーザーを管理する
• 多くのシステムパラメータを設定します。
• などなど...

図 1.15。 Orchard管理ダッシュボードのウェルカムページ

管理パネルの概要として、「新規」セクションの「ページ」リンクをクリックします。 表示されるエディターで、サイトの新しいページを作成できます。 ページにタイトルとコンテンツを入力します。 サイト用に生成されたリンクに注意してください。 覚えておいて、必要に応じて変更してください（図1.16）。


図 1.16新しいページのタイトルとリンク

その後、[今すぐ公開]ボタンをクリックして、サイトに新しいページを作成して公開します。 ページが正常に作成されたという通知を受け取ります（図1.17）。


図 1.17。 新しいページの成功通知

次に、ナビゲーションリンクをクリックして、新しいページへのナビゲーション要素を作成します。 [新しい項目の追加]セクションの下部のフィールドにデータを入力します。ナビゲーションフィールドの表示テキスト、ナビゲーションフィールドの位置、ページへのリンク（前にスラッシュを付けます）（図1.18）。


図 1.18。 新しいナビゲーションアイテムの確立

[追加]ボタンをクリックし、新しいナビゲーションアイテムがトップリストに追加されたことを確認します。 次に、サイトの変更を確認します。

管理パネルの左上隅にある[サイト]リンクを使用して、サイトに戻ります。 コンテンツが含まれるページに移動する新しいナビゲーションアイテムが表示されます。


図 1.19。 サイトページの新しいナビゲーションアイテム

テーマの変更

次に、サイトのテーマを変更してみてください。 これを行うには、Orchard CMS管理パネルに戻ります。 テーマがまだダウンロードされていない[テーマ]セクションに移動し、[ ギャラリー から テーマ を インストール ]ボタンをクリックします。 しばらくすると、利用可能なテーマのリストが管理パネルにロードされます（図1.20）。


図 1.20。 Orchard CMS管理パネルのスキンのリスト

リストの2番目のトピック（Association Dark Green-バージョン：1.0）など、お気に入りのトピックを選択し、その反対側の[インストール]リンクをクリックします。 しばらくすると、テーマが自動的にサイトにアップロードされます。

これで、テーマのインストールがテーマセクションから利用できるようになります（図1.21）。 それに行きます。


図 1.21。 テーマセクションにアップロードされたトピック

ダウンロードしたテーマをサイトのテーマとして設定するには、[現在の設定]ボタンをクリックします。 その後、サイトのメインページに戻り、サイトのデザインが変更されたことを確認します（図1.22）。


図 1.22。 新しいテーマを使用したブラウザーでのサイトの外観

管理パネルとその基本的な機能のいくつかに精通しました。 このガイドの以降の部分では、パネルのすべての機能を詳しく見ていきます。 それまでの間、WebMatrixが私たちのサイトで動作するために役立つものを検討してください。

WebMatrix機能の使用

管理パネルを介してOrchard CMSにサイトを立ち上げてセットアップしたら、WebMatrixに戻り、サイトの開発と保守に役立つ機能を検討します。

サイトリクエストの調査

WebMatrixの最も重要な利点の1つは、サーバー上および開発中にサイトの状態を監視できることです。 たとえば、WebMatrixは、アプリケーションの実行中にサイトのリソースおよびページに対するすべてのリクエストを監視します。 これにより、リソースおよびページへのアクセスに関するすべての問題を追跡し、適切なアクションを実行できます。

メインのWebMatrixウィンドウ（図1.10）で、コントロールパネルの[リクエスト]ボタンを使用して、完了したリクエストのリストに移動します。 ステータス、リードタイム、およびリクエストのタイプの説明と推奨されるアクションに関する追加情報を含むリクエストのリストが表示されます。


図 1.23。 申請中のサイト要求のリスト

このWebMatrix機能を使用すると、開発者はコンテンツへのアクセスに関するサイトの問題（画像、スクリプト、スタイルなど）を簡単に追跡できます。 訓練を受けていない専門家は、コンテンツへのアクセス状況の説明を読んで、問題が発生した場合の解決策についてアドバイスを受けることさえできます。

コードを操作する

Webアプリケーション開発者の仕事は、何らかの形で、常にコードの記述と編集に関連しています。 このようなコードには、動的ページのソースファイル、マークアップファイルとプレゼンテーションファイル、デザインスタイル、およびJavaScriptスクリプトを使用できます。

WebMatrixは、多くのファイルタイプの構文を強調表示する完全なソースエディターです。 左下のセクションブロックで[ファイル]セクションを選択します。 Orchard CMS Webサイトの現在のプロジェクトに含まれるすべてのファイルのリストを受け取ります。 ファイルツリーを使用すると、タスクの前に必要なプロジェクトファイルを開いて変更できます。

たとえば、ダウンロードしてインストールしたテーマをサイトに合わせて調整できます。 Themes \ AssociationDarkGreen \ Styles にあるSite.cssスタイルファイルを開くと、スタイルの定義を好みに合わせて変更できます。

たとえば、サイトタイトルのテーマで使用されるフォントを再定義する場合は、Styles.cssで＃ ブランド要素のスタイル定義を探します。 定義を必要に応じて編集します。たとえば、フォントをSegoe UIに指定し、CSS要素の値を設定します： font -family ：“ Segoe UI ” （図1.24） 。


図 1.24。 WebMatrixコードエディター

ファイルを保存し、ブラウザでサイトのメインページを更新します。 フォントが変更されたことを確認します。

WebMatrixを使用すると、サイトのプロジェクト内のファイルとフォルダーを完全に編集、作成、削除できます。 WebMatrixは、さまざまなファイル形式の構文強調表示をサポートしています。 エディターには、ファイルをナビゲートするための便利な手段があり、スタイルを操作するときなどに、コードを自動的に追加する機能があります。 WebMatrixエディターは便利で、タブに基づいて構築されているため、複数のファイルを同時に操作できます。

DBを使用する

Webプロジェクトを使用する場合、開発者は常にデータウェアハウス、つまりデータベースの使用に直面しています。 開発者には、データベースを作成し、データベースの構造を作成および編集し、データベーステーブルのコンテンツを管理する手段が必要です。

WebMatrixは、完全な組み込みデータベースツールを提供します。 [データベース]タブをクリックします。 左側には、現在のデータベースアイテムのリストが表示されます。 Orchard.sdfアイテムをダブルクリックします。 これは、サイト上のすべてのデータを含むSQL Server Compact形式のデータベースファイルです。 Tables要素を展開すると、データベースで作成され、編集可能なすべてのテーブルのリストが表示されます。

Navigation_MenuPartRecordという名前のテーブルを見つけ、ダブルクリックしてその内容を開きます。 テーブルに保存されている情報にアクセスできます。 具体的には、この場合、Navigation_MenuPartRecordテーブルには、前に作成したナビゲーションポイントに関する情報が格納されます。 Orchard CMSコントロールパネルをバイパスして、データを直接編集できるようになりました。

Homeのコンテンツが含まれるフィールドをクリックして編集し、Homeという値を取得します（図1.25）。


図 1.25 WebMatrixでデータベースを編集する

ブラウザでサイトのメインページを更新すると、ナビゲーションパネルに変更が表示されます。 HomeはHomeになりました。

記述されたコードはデータベース内のテーブル構造が特定の形式に縮小されることを前提としているため、データベース、特にテーブル構造に直接変更を加えるように注意する必要があります。 テーブル構造の編集は、通常、データベースをゼロから作成する開発の最初に行われます。

WebMatrixは、Webサイトデータベースへの完全なアクセスを提供します。 データベースとテーブルを作成し、テーブル内の情報を作成および編集できます。

問題とエラーのウェブサイト分析

WebMatrixのユニークな機能は、潜在的な問題についてサイトを分析し、この分析の結果に基づいてレポートを作成する機能です。 この機能により、WebMatrixは機能的なコードおよびデータエディターと開発ツールだけでなく、サイトメンテナンスツールにもなります。

組み込みのレポートツールを使用して、次の側面についてサイトを分析できます。

• 検索サービスのためのサイトの最適化。
• 一般的なWebページレイアウトエラーの存在;
• クライアント最適化の一般的な手順。
• ページ上のすべてのリソースの可用性と利用可能なリンクの関連性。
• サイトリソースへのアクセス速度：写真、スクリプト、スタイルなど。

[レポート]セクションを開き、画面中央にある[ サイトの レポート を 作成 ]ボタンをクリックします 。 レポートの名前を入力し、レポートの作成元のアドレスを入力するよう求められます。 デフォルトでは、現在のサイトにアドレスが設定されています（図1.26）。


図 1.26。 レポートパラメータの入力

[OK]をクリックして、新しいレポートを作成します。 WebMatrixに戻り、レポートがバックグラウンドで生成されることに注意してください（図1.27）。これにより、サイトを分析しながら、そのファイルとデータベースを引き続き使用できます。


図 1.27。 バックグラウンドサイト分析とレポート生成

分析が完了してレポートが作成されたら、検出された違反、エラー、および推奨されるヒントのリストを操作して分析できます（図1.28）。


図 1.28。 分析結果とレポートを操作する

Orchard CMSテンプレートの開始サイトの場合、レポートには、コンテンツ管理システムテンプレートに固有のいくつかの小さなエラーと警告が含まれます。 サイト構造、ページレイアウトを作成し、このテンプレートに適切なコンテンツを入力する必要があります。 これは、サイトのエラーや潜在的な問題を分析するときに役立ちます。

コンテンツに関連するエラーに加えて、コントロールパネルの[パフォーマンス]セクションにレポートを切り替えることにより、サイトのパフォーマンスの分析に進むことができます。 このセクションには、サイトで検出されたすべてのリソースと、分析中にこのリソースが取得された時間が表示されます。 リソースがより速く取得されるほど、より良い結果が得られます。 原則として、ページやその他のファイルリソースの取得に長時間かかることは、サイト自体の問題を示しており、開発者の注意が必要です。

[パフォーマンス]ウィンドウには、特定のリソースの読み込みにかかった正確な時間（秒単位）を含むリソースのリストが表示されます。 表の上部にある要素を使用すると、リストを特定の時間間隔の要素のみに制限できます（図1.29）。


図 1.29。 レポートのパフォーマンス設定画面

レポートでは、すべてのリソースをほんの一瞬で指定する必要があります。これは、Webサイトの健全な状態を示します。

これまで見てきたように、WebMatrixは開発ツールであるだけでなく、Webサイト分析およびメンテナンスツールでもあります。 レポートを作成することにより、WebMatrixはサイト開発の段階だけでなく、サイトが既にインターネットでホストされている場合、サイトの正しい、応答性のある、エラーのない操作が最も重要な場合に、開発者に有用な情報を提供できます。 したがって、WebMatrixは、開発者だけでなく、運用中にWebサイトに付随するITスタッフにとっても有用なツールとなります。

プロジェクトをサーバーに公開する

Orchard CMSで最初のWebサイトをダウンロード、構成、起動し、コードエディターを使用してコンテンツを編集し、データベースエディターを使用してデータベースデータを編集し、問題のサイトを分析してレポートを確認したので、インターネット上のサーバーでのみ公開できるようになりました。

サーバーにデータを公開するタスクは、日常的で些細な、非常に日常的な作業です。 同時に、サーバーへの更新の公開は、エラーが発生する可能性のある責任のあるタスクです。 経験豊富な各Web開発者は、FTPプロトコル、リモートRDP接続、またはスクリプトセットを介して、サーバーにデータを公開するためのいくつかのプラクティスとアプローチを武器にしています。 サーバーへのデータと更新の公開は、あらゆるクラスの専門家から多くの時間がかかるプロセスである場合があります。

そして、ここでWebMatrixはその必須性を再度実証し、サーバーとデータを交換するための自動プロトコルであるWebDeployのサポートを提供します。 このメカニズムとWebMatrixの組み込みサポートを使用すると、サーバーにデータと更新を配置するプロセスは、マウスを数回クリックするだけの簡単なタスクになります。これは、最も準備のできていない開発者でも対応できます。

インターネット上に何かを投稿するには、サイトをホストするホスティングサービスが必要です。 それは、個人サーバーまたはホスティングプロバイダーのサービスのいずれかです。

ガイダンスとして、WebMatrixプロジェクトの特別な無料（60日間）ホスティングを使用します。これはhttp://WebMatrixHosting.ru/にあります。 このリソースを使用すると、WebMatrixのすべての利点を無料で評価し、実際のプロジェクトをホストするための有料ホスティングを購入する前に、それらを実際に使用する方法を学ぶことができます。

WebMatrixHosting.ru

WebMatrixHosting.ruで無料ホスティングの使用を開始するには、数分しかかかりません。 リンクhttp://WebMatrixHosting.ru/に従ってサイトに登録します。


図 1.30。 ブラウザーでのwebmatrixhosting.ru Webサイトの外観

登録が成功したことを示すレポートが数通届きます。 文字の1つは特に重要で、WebMatrixを介してサイトを公開するために必要なサーバー設定が含まれています。 同じ文字には、サイトの公開を自動化するための同じパラメーターを含むXMLファイルが埋め込まれています。

WebMatrixからサイトを公開する

登録後、すべてがすぐにサイトの公開の準備が整います。 [サイト]タブのWebMatrixに移動し、ツールバーの[公開]ボタンをクリックします。 サイトを公開するためのウィンドウが開きます（図1.31）。


図 1.31。 WebMatrixでサイトを公開するためのウィンドウ

サーバー、ユーザー名、パスワード、サイト名、サイトアドレスを指定して、公開パラメーターのデータを手動で入力できます。 ただし、WebMatrixHosting.ruからのレターに添付されているパブリケーションファイルを使用する方がはるかに正確で、高速で、信頼性が高くなります。

[ 公開 設定のインポート]リンクをクリックし、XMLファイルを選択して設定を読み込みます（選択ウィンドウでファイルタイプを変更する必要がある場合があります）。 すべてのパラメーターフィールドが自動的に入力されることがわかります。

これで、[接続の検証]ボタンをクリックして、パラメーターの正確性を確認できます。 すべてのデータが正しく入力され、サーバーとの接続が確立された場合、証明書をインストールするように求められます（図1.32）。ボックスをオンにして、サーバーを使用できるように[証明書を受け入れる]をクリックします。


図 1.32。 証明書のインストール確認

[保存]をクリックして、後続の自動公開の設定を保存します。 サイトの要件に応じて、リモートサーバーの互換性チェックを行うよう求められます。 現在、互換性に自信があるため、[いいえ]をクリックします。 後で、リモートサーバーが使い慣れていない場合や、パラメーターが疑わしい場合は、このようなチェックを行う必要があります。

WebMatrixは、環境にロードされたプロジェクトに関するサーバー上の変更の検索を開始します。 新しいプロジェクトと空のサーバーの場合、そのような変更はすべてのプロジェクトファイルとデータベースになります。


図 1.33。 公開の準備ができているリソースのリストを表示する

したがって、WebMatrixは、開発者が頻繁に行うことを自動的に生成し、サーバーでの公開に必要な変更のリストを作成します。 データベースも必要な更新としてリストされていることに注意してください。 この時点で、サーバー上でまだ更新したくない項目のチェックを外すことができます。

[続行]をクリックすると、WebMatrixはサーバーにデータを公開する完全自動バックグラウンドプロセスを開始し（図1.34）、その間、Webサイトでの作業を続行できます。


図 1.34。 変更をサーバーに自動的に公開する

しばらくすると（変更のサイズに応じて）、WebMatrixは公開が完了したことを通知します。これは、サイトが既にインターネット上で動作する準備ができていることを意味します（図1.35）。


図 1.35。 出版は完了し、サイトは準備完了です

インターネットにインストールされているWebサイトへのリンクをたどります。 私の場合、サイトはhttp://vyunev-2.hosting.parking.ru/にあります。

WebMatrixは、誰でも簡単に手頃な価格でWebサイトをサーバーに公開する方法を提供します。 ご覧のとおり、WebMatrixを使用してインターネット上でサイトを公開するには、数分しかかかりません。 まだホスティングを取得していない場合でも、 http：//WebMatrixHosting.ruプロジェクトに無料で登録すると、 数分でそれを受け取ることができます。 この特典は60日間有効です。

おわりに

ガイドの最初の部分では、Orchard CMSコンテンツ管理システムについて詳しく紹介しました。 ほんの数分で、WebMatrixを使用してOrchardベースのWebサイトをダウンロードし、自動的にインストールして起動しました。

Orchard CMS管理コンソールを使用して、サイトでいくつかの簡単な管理タスクを実行し、デザインテーマを変更しました。 WebMatrixを使用すると、プロジェクトファイルとデータベースを編集して、サイトに必要な変更を加えることができました。 WebMatrixのアクセシビリティ機能を使用して、ウェブサイトのエラーと潜在的な問題を分析しました。

最終的に、数分で、簡単な登録を経て、インターネット上の実際の無料ホスティングでサイトを公開しました。 WebMatrixの機能を使用すると、公開プロセスはシンプルで簡単です。

WebMatrixの最初のダウンロードからネットワーク上の動作中のサイトまで、10分以内に経過しています。 これが効率です！

このガイドの次の部分では、Orchard CMSコンテンツ管理ツールが提供する機能拡張機能（ウィジェット、モジュール、テーマなど）を詳しく見ていきます。