PHP5 フレームワークの構築: パート 3-PHPチュートリアル-php.cn

PHP5 フレームワークの構築: パート 3

王林

リリース： 2023-09-03 11:10:01

オリジナル

1012 人が閲覧しました

基本的なフレームワークができたので (このシリーズの第 1 回と第 2 回を参照)、設計を PHP フレームワークと統合することについて考え始めることができます。ここでは、新しいフレームワークを簡単に「スキン」する方法など、フロントエンドの設計に焦点を当てます。

すべてがどのように組み合わされるか

これまでのところ、論理構造内のコアファイルと、レジストリによってアクセスされるオブジェクトのコアセットができています。これらのオブジェクトの 1 つはテンプレートハンドラーで、これを使用すると HTML 出力を簡単に構築して生成できます。出力は、「スキン」を構成する画像、CSS、テンプレートなどの一連のファイルから構築されます。

ステップ 1: フレームワークのフロントエンド設計に必要なもの

テンプレートの一般的なフロントエンド設計を正しく行うのは難しい場合があります。これは、フレームワークを使用して作成する Web サイトのすべてのコンテンツを含む基本的な HTML テンプレートをデザインする場合に便利です。私が検討している最小値は次のとおりです:

メインコンテンツエリア、私たちはそれを呼んでいますリーリー

コンテンツの 1 列または 2 列はそれほど重要ではありません。リーリー
いくつかの表形式のデータ。
順序なしリストと順序付きリスト (定義リストを使用する可能性がある場合は、同じことが当てはまります)。
など)。これを HTML の「写真」クラスとして認識します。
データ収集用のフォーム。

まず、ページの基本的な XHTML 構造を作成します。まずはこのセクションから始めましょう: リーリー

一致するドキュメントタイプを変更したり、フレームワークを使用して作成されたすべての Web サイトの設定でドキュメントタイプを定義したりすることもでき、ドキュメントタイプを変更できることも便利です

リーリー

。スタイルシートを設定として定義すると便利な場合があります。これについては、今後のチュートリアルで説明します。

さらに、メタディスクリプションとメタキー属性は、作成するすべての Web サイトのスキンにハードコーディングできますが、壊れないように

各ページに異なる説明とキーワードのセットを提供するのが賢明です。ページは Google の補足インデックスに

として表示されます。

{pagetitle} プレースホルダーは、現在のページのタイトルをテンプレートに挿入するために使用されます。

ここで、テンプレート XHTML ファイルの本体に進み、フレームワークの一般的なフロントエンドデザインを作成できます。このフレームワークを使用して作成する Web サイトのほとんどが従来のヘッダー、コンテンツ、列、フッタースキームを使用すると仮定して、今のところレイアウトをシンプルにしておきます。

リーリー

ステップ 2: 基本的なコンテンツ

約束どおり、スタイルを設定できるページに表示される可能性のあるタグの少なくともほとんどがスタイル設定できるように、いくつかの基本的な情報を入力します。

リーリー

これで、コンテンツに簡単なスタイルを適用する準備が整いました。

ステップ 3: 基本スタイル

まず CSS を使用して、XHTML ドキュメント内の要素のマージンとパディングをリセットします。

リーリー

時間をかけて body 要素のスタイルを設定し、ドキュメント内のリンクが適切に強調表示されていることを確認します。リーリー

次に、デザインを #wrapper div の中央に配置し、各 div に薄い境界線を割り当てて、スタイル設定時に見えるようにします。

リーリー

上記の CSS は Internet Explorer 6 でこの設計を一元化していませんが、柔軟性を最大限に高めるために CSS は基本的なものに保たれています。 CSS をもう少し追加すると、フレームワークのフロントエンドの

完全なスケルトンデザインがほぼ完成します

- 残っているのは、いくつかの簡単な位置決めだけです。リーリー

これで残っているのは画像だけです:

リーリー

この段階で残っているのは、PHP フレームワークフロントエンドの基礎として使用できるシンプルな Web サイトレイアウトです。

もちろん、さらに柔軟性を高めるために、デフォルトで 2 列のコンテンツを許可すると便利な場合があります。これは、XHTML と CSS を追加することで実現できます。

ステップ 4: XHTML からのテンプレート

次のステップでは、XHTML、CSS、画像を PHP フレームワークに適した

スキン PHP5 フレームワークの構築: パート 3 に転送します。これを行うには、XHTML をヘッダー、メインテンプレート、フッターの 3 つのテンプレートに分割する必要があります。テンプレートシステムの構造により、任意の数のテンプレートからページを生成できますが、少なくともヘッダー、フッター、メインテンプレートを使用することをお勧めします。つまり、一般に、次の場合にのみコピーして変更する必要があります。少し構造を作成したい異なる新しいページがある場合は、メインのテンプレートファイルを使用します。

PHP フレームワークのヘッダーテンプレート (skins/default/templates/header.tpl.php)

PHP フレームワークのヘッダーテンプレートには、XHTML セクションと

が含まれている必要があります。 一部：＃＃＃＃＃＃

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>{pagetitle}</title>
<meta name="description" content="{metadesc}" />
<meta name="keywords" content="{metakey}" />
<style type="text/css" title="Default page style" media="screen"><!--@import "style.css";--></style>
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
</head>
<body>
<div id="wrapper">
<div id="header">
<h2><a href="#" title="Website name">Website name</a></h2>
</div>

ログイン後にコピー

PHP 框架的主模板 (skins/default/templates/main.tpl.php)

主模板应包括包含主要内容和列中任何内容的 div。我们现在可以为此内容插入占位符，而不是复制我们用来设置段落、有序列表和表格等元素样式的虚拟文本，占位符将根据内容所在的位置进行更新。

占位符内容是：

{pagetitle} 页面标题。

{maincontent} 页面的主要内容。

{btitle} 和 {bcontent} 内容块的标题和内容。它包含在 rcolumn 循环中，因此可以在列中放置多个块。

<div id="content"> <h1>{pagetitle}</h1> {maincontent} </div> <div id="column">  <h2>{btitle}</h2> {bcontent}  </div>
ログイン後にコピー

PHP 框架的页脚模板 (skins/default/templates/footer.tpl.php)

最后，剩余的 XHTML 放入页脚文件中，该文件关闭 XHTML 文档和正文部分。我们通常使用它来在我们的网站上包含版权声明和“网页设计者”链接。

<div id="footer"> <p> © Website name, 2008. </p> </div> </div> </body> </html>
ログイン後にコピー

对于我们系列中 PHP 的中断表示歉意，但为我们的框架和使用它的应用程序构建皮肤格式的相关模板非常重要。 PHP5 框架开发系列中的第 4 部分将介绍基本的安全注意事项和基本的身份验证处理程序，然后我们将继续创建内容管理模型，并在第 5 部分中研究模型如何组合在一起。该系列中的内容：发送电子邮件、扩展我们的框架以及以创新的方式记录用户事件流。

以上がPHP5 フレームワークの構築: パート 3の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。