top


総投稿数 本 
no_

スポンサーサイト

 --------
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
カテゴリ :スポンサー広告 トラックバック(-) コメント(-)
no_1217

Drupal:早速、テーマの改造。まずは参考書紐解き、構造理解しなくっちゃ ・・・ 【Drupalはどう?】

 2010-01-11
 本日 2稿目。くどい? Drupal
 参考書購入したので、早速側において
 デザインカスタマイズに挑戦。

 


 構造も理解しなくっちゃ、ね。
  こちらを利用。

  追記に (長文ご容赦) ▼


FC2ブログランキング にほんブログ村 IT技術ブログ Webサイト構築へ ブログ王ランキング 人気ブログランキング 人気ホームページランキングへ


more

************************************************
◎ デザインカスタマイズに挑戦 の巻 :Drupalはどう?
************************************************


 下準備。
 現在設定しているテーマWaffles | drupal.org」は、
 GNUライセンス。一応表記してコピーレフトで
 利用させていただきます。

 ■フォルダごと複製して
  別ネームのフォルダとして、
  Drupal テーマディレクトリへ。(themes)


 


  ※でも、このフォルダのみアップロードしても
   [管理セクション]>[サイトの構築]>[テーマ]
   には、表示されない。
   (参考書では、testというフォルダに複製して
    アップロードだけでいいと記述されていたが
    ・・・この参考書は 6.x 以前かな)
  ※Drupal6.x でテーマごとの設定ファイルである
   (テーマフォルダ)/(テーマ名前).info
   というファイルが必要。
   (複製した、waffles.info を
    新しく用意した編集用のものにリネーム
   > これで、テーマ一覧に表示される。
  テーマ一覧に表示される
  ※さらにこの、infoファイル(テキストファイル)を
   編集
name = waffles_*****
waffles_*****
 の2ヶ所だ。
    ▼
  きちんと表示される・・・あぁ、すっきり
   きちんと表示される・・・あぁ、すっきり。
  ※この編集用テーマに変更しておく。

 


 ■ページ全体のレイアウト
  ・page.tpl.php というphpファイルが
   そのテンプレートのようだ。とにかく開く。
<!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" lang="<?php print $language->language; ?>" xml:lang="<?php print $language->language; ?>">

<head>
<title><?php print $head_title; ?></title>
<?php print $head; ?>
<?php print $styles; ?>
<!--[if IE 7]>
<link rel="stylesheet" href="<?php print $base_path . $directory; ?>/ie7-fixes.css" type="text/css">
<![endif]-->
<!--[if lte IE 6]>
<link rel="stylesheet" href="<?php print $base_path . $directory; ?>/ie6-fixes.css" type="text/css">
<![endif]-->
<?php print $scripts; ?>
</head>

<body class="<?php print $body_classes; ?>">
 ・・・・・
</body>
</html>
 ・・・おぉ、xhtml1-strictかぁ。
    あまり使わないんだよな。
    (厳しい、から)

  ここで、少し寄り道。
  この段階で html-lint してみると
  どうなんだろう?
  【即確認】
  (一時的に、Basin認証はずして・・・)
   ▼
  きちんと表示される・・・あぁ、すっきり
   ありゃありゃ・・・ダメダナァ。
   30個のエラー/71点 ふつうです。
   ※「hrml-lint 100点への道」を目指していた者としては
    (一応現在は、アラートあるものの 100点。)
  一応現在は、アラートあるものの 100点。
   やだな。
   ※このカスタマイズで、ここも100点目指そう。


 さて、page.tpl.php
 これが基本的な「ページ全体のレイアウト」の
 テンプレートなわけだ。


 


 ■一度きれいにしておく
  ・XML宣言
  ※html-lint で出たアラートのうち
   XML宣言をしていないところは、互換モードの関係があるので
   是非、難しいところだが、一応対応。
<?php echo '<?xml version="1.0" encoding="utf-8"?>'."\n" ?>
 とする。
  ・1: line 7: <title> の内容は 64文字以内に収めるようにしましょう。
   > まぁ、これはいいやね。
  ・4: line 8: <meta http-equiv="content-type"> は 6行目にもありました。
   > おぉ。
     これは、不具合のようでパッチがありますね。
     > Drupal outputs two meta content-type tags
     /includes/common.inc において、
function drupal_get_html_head() {
$output = "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />\n";
// return $output . drupal_set_html_head();
return drupal_set_html_head();
}
 とする。
  ・1: line 7: <meta http-equiv="content-script-type" content="?" /> を指定するように
   > おぉ指定していないのか。
     css の方も無いようだ。
     これは、直接この "" に追記でいいのかな。
<meta http-equiv="content-style-type" content="style/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />

  ・1: line 30: <script>?</script> 内にコメントを書くと、本当にコメントとして扱われます。
   > よく言われます。これも単純にコメントはずすのは
     是非あると思うのだけど、思い切ってはずす。
     やはり、/includes/common.inc ですね。
     (2207行目あたり)
<meta http-equiv="content-style-type" content="style/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />

 とりあえず他はいいか。
  23個のエラー/90点。こんくらいにしておいてやろ
 一応。23個のエラー/90点。こんくらいにしておいてやろ。

 


 ■テンプレート変数
  【page.tpl.php
  ※この page.tpl.php で利用されている
   テンプレート変数には・・・
□ヘッド部分が
 ・$head_title
  タイトル部分へ組み込まれる
 ・$head
  ヘッド部分、metatagなどだろう
 ・$styles
  CSS関連の設定
 ・$scripts
  javascriptか
 といった部位を表すもの があり、
 さらに「ヘッド部分」は3つに区分され、
 □最初のヘッド部分
  ここは直接記述され
  ・$search_box
   検索エリア
  ・$logo
   ロゴ
  ・$site_name
   サイト名称
  ・$site_slogan
   サイトスローガン
   (サブタイトルキャッチ)
  という部品で構成
 □ヘッダーの中央部分
  ・$header_middle
 □ヘッダーの最後
  ・$header_last
  は、それぞれのテンプレート変数
 ※要は、必要に応じて
  ヘッダー部分が
  2段にも3段にもできるようになっている
  ・・・というわけだ。

 その後に、

 □ヘッダーボトムとして
  ・$primary_links
   プライマリリンク
  で構成される部分が続き、

 □id="preface" で示されるエリアが
  ・$mission
  ・$preface_first
  ・$preface_middle
  ・$preface_last
  などのテンプレート変数で用意される。

 メインエリアは、
 □id="preface" で示されるエリアが
  ・$sidebar_first と
   ・$help
   ・$messages
   ・$breadcrumb などの構成で
  組み合わされる2カラム基本のようだが、

 


  その中には、
  ・$content_top
  ・$content_bottom に囲まれる形で
   ・$tabs
   ・$sidebar_last
   ・$title
   ・$content
  などが用意される。

 その後に用意される、
  ・$postscript_first
  ・$postscript_middle
  ・$postscript_last
 は、印刷用だろうか。
 そして、
 □フッター要素として

  ・$footer_top
  ・$footer
  ・$footer_message
 などのテンプレート変数。
 □body閉じ直前には
  ・$closure
  という変数がある。
 こうやって段階別に書き出してみると
 非常に判り易い。
 そして、各パーツ
 ・左サイドバー
 ・コンテンツ
 ・右サイドバー
 ・フッタ
 などは、それぞれまた他の、***.tpl.php が
 レイアウトを担っている・・・というわけだ。

 


  【block.tpl.php
  左右サイドバーを構成するテンプレートとして
  このファイルが用意されている(ということだ)
  ※汎用的に利用されるために
   IDなどの部分は、用途に応じて
   動的に変わるようになっている。
<div class="block-wrapper <?php print $block_zebra; ?>">
<?php if ($rounded_block): ?> <!-- see preprocess_block() -->
<div class="rounded-block">
<div class="rounded-block-top-left"></div>
<div class="rounded-block-top-right"></div>
<div class="rounded-outside">
<div class="rounded-inside">
<p class="rounded-topspace"></p>
<?php endif; ?>

<div id="block-<?php print $block->module .'-'. $block->delta; ?>" class="block block-<?php print $block->module ?>">
・・・・・
</div>

<?php if ($rounded_block): ?>
<p class="rounded-bottomspace"></p>
</div><!-- /rounded-inside -->
</div>
<div class="rounded-block-bottom-left"></div>
<div class="rounded-block-bottom-right"></div>
</div><!-- /rounded-block -->
<?php endif; ?>

</div>

 


  【node.tpl.php
  メインのコンテンツ部分を構成するテンプレートが
  これで、この中には、、
  ・$picture
  ・$page
  ・$title
  ・$submitted
  ・$content
  ・$terms
  ・$links
  ・$node_bottom
  ・$teaser
 などが含まれている。

 


  ※さらに、私の今回のプロジェクトには
   特に必要ないが、
  【comment.tpl.php
  コメント部分を構成するテンプレートが
  ・$picture
  ・$comment
  ・$submitted
  ・$content
  ・$signature
  ・$links
 などで用意される。

 ■HTML出力関数
  それぞれのHTMLの出力を、制御するものとして
  ・ユーザー定義テンプレートファイル
   (template.php)があり、この中の
   ・頭に、phptemplate_の ついた関数が
   ・システム(モジュール)に用意されている
    頭に、theme のついた関数より先に
    読み込まれ、オーバーライドして実行される。
  ・・・ふむふむ。


 


 ■スタイルシート
  ※初期設定では、style.css
   テーマごとに必要なようで、今回編集用に用意した
   中にも存在する。
   ・テンプレートの中で、
<?php print $styles; ?>
 とされると
  □システムで共通の4つのスタイルシート
   ・/modules/node/node.css
   ・/modules/system/default.css
   ・/modules/system/system.css
   ・/modules/user/user.css に続けて
  □テーマ固有の(テーマフォルダ内の)CSSファイルが
   呼び出され、出力されるわけだ。了解。

 なるほど、単純に、
  ・page.tpl.php などを書き直せば
   いいってもんではないのだな。


 今日はここまで。明日は実践だ。

commentsコメント
comment_post












管理者にだけ表示を許可する
commentトラックバック
トラックバックURL:
http://metaboy.blog23.fc2.com/tb.php/1217-d35ac8dd
ようこそ
Add to Google 創るmetaboy:RSSフィード
My Yahoo!に追加
最新記事のRSS | 問い合わせ

仕事検索、アルバイト検索、依頼仕事の検索ポータル - 仕事検索.COM - www.jobkensaku.com ツクルン

創るmetaboy - WEB創る、サイト創る、何創る - 創ったmetaboy

 

リンク集

 

最近の記事

 

ブロとも申請フォーム
Sponserd by

さくらのレンタルサーバ さくらのレンタルサーバ
大容量・高機能レンタルサーバー heteml 大容量・高機能レンタルサーバー heteml
XREA (ValueDomain)
お名前.com お名前.com
名づけてねっと名づけてねっと
ムームードメインムームードメイン

 

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。