主题化-B-使用tpl模板定制XHTML(page.tpl.php)(视频)

无须猫 的头像
22条评论发表评论

本节开始学习使用Drupal的模板来定制XHTML输出,大部分情况下使用模板文件即可满足我们的需求。

相关链接:

Drupal主题模板简图

本例区域示意图

page.tpl.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" xml:lang="<?php print $language->language ?>" lang="<?php print $language->language ?>" dir="<?php print $language->dir ?>">

<head>
  <?php print $head; ?>
  <title><?php print $head_title; ?></title>
  <?php print $styles; ?>
  <?php print $scripts; ?>
  <script type="text/javascript"><?php /* Needed to avoid Flash of Unstyled Content in IE */ ?> </script>
</head>
<body class="root <?php print $body_classes; ?> no-scroller node-<?php print $node->nid;; ?>">
  <div id="wrap">
    <div id="header">
      <div id="logo-title">

        <?php if (!empty($logo)): ?>
          <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
            <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
          </a>
        <?php endif; ?>

          <?php if (!empty($site_name)): ?>
            <h2 id="site-name">
              <a href="<?php print $front_page ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a>
            </h2>
          <?php endif; ?>

          </div> <!-- /logo-title -->

      <?php if (!empty($search_box)): ?>
        <div id="search-box"><?php print $search_box; ?></div>
      <?php endif; ?>

      <?php if (!empty($header)): ?>
        <div id="header-region">
          <?php print $header; ?>
        </div>
      <?php endif; ?>
     
        <?php if (!empty($breadcrumb)): ?><div id="breadcrumb"><?php print $breadcrumb; ?></div><?php endif; ?>

    </div> <!-- /header -->


        <div id="sidebar">
              <div id="navigation" class="menu <?php if (!empty($primary_links)) { print "withprimary"; } if (!empty($secondary_links)) { print " withsecondary"; } ?> ">
        <?php if (!empty($primary_links)): ?>
          <div id="primary" class="clear-block">
            <?php print theme('links', $primary_links, array('class' => 'primary-links')); ?>
          </div>
        <?php endif; ?>

        <?php if (!empty($secondary_links)): ?>
          <div id="secondary" class="clear-block">
            <?php print theme('links', $secondary_links, array('class' => 'links secondary-links')); ?>
          </div>
        <?php endif; ?>
      </div> <!-- /navigation -->
          <?php print $sidebar; ?>
        </div> <!-- /sidebar -->


      <div id="contentBox">
     
          <?php if (!empty($title)): ?>
            <h1 class="title" id="page-title"><?php print $title; ?></h1>
          <?php endif; ?>
     
        <div id="contentInner">    

       
        <?php if (!empty($mission)): ?>
          <div id="mission"><?php print $mission; ?></div>
        <?php endif; ?>

         
        <div id="content">
         
          <?php if (!empty($tabs)): ?>
            <div class="tabs"><?php print $tabs; ?></div>
          <?php endif; ?>
         
          <?php if (!empty($messages)): print $messages; endif; ?>
          <?php if (!empty($help)): print $help; endif; ?>
         
          <div id="content-content" class="clear-block">
            <?php print $content; ?>
          </div> <!-- /content-content -->
         
          <?php print $feed_icons; ?>
        </div> <!-- /content -->

       

        </div>
      </div> <!-- /contentInner /contentBox -->


  </div>  
   
      <div id="footer">
        <?php print $footer_message; ?>
        <?php if (!empty($footer)): print $footer; endif; ?>
      </div> <!-- /footer -->

    <?php print $closure; ?>

</body>
</html>

page-album.tpl.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" xml:lang="<?php print $language->language ?>" lang="<?php print $language->language ?>" dir="<?php print $language->dir ?>">

<head>
  <?php print $head; ?>
  <title><?php print $head_title; ?></title>
  <?php print $styles; ?>
  <?php print $scripts; ?>
  <script type="text/javascript"><?php /* Needed to avoid Flash of Unstyled Content in IE */ ?> </script>
</head>
<body class="root <?php print $body_classes; ?> scroller">
  <div id="wrap">
    <div id="header">
      <div id="logo-title">

        <?php if (!empty($logo)): ?>
          <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
            <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
          </a>
        <?php endif; ?>

          <?php if (!empty($site_name)): ?>
            <h2 id="site-name"><?php print $node->type; ?>
              <a href="<?php print $front_page ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a>
            </h2>
          <?php endif; ?>

          </div> <!-- /logo-title -->

      <?php if (!empty($search_box)): ?>
        <div id="search-box"><?php print $search_box; ?></div>
      <?php endif; ?>

      <?php if (!empty($header)): ?>
        <div id="header-region">
          <?php print $header; ?>
        </div>
      <?php endif; ?>
     
        <?php if (!empty($breadcrumb)): ?><div id="breadcrumb"><?php print $breadcrumb; ?></div><?php endif; ?>

    </div> <!-- /header -->

        <div id="sidebar">
              <div id="navigation" class="menu <?php if (!empty($primary_links)) { print "withprimary"; } if (!empty($secondary_links)) { print " withsecondary"; } ?> ">
        <?php if (!empty($primary_links)): ?>
          <div id="primary" class="clear-block">
            <?php print theme('links', $primary_links, array('class' => 'primary-links')); ?>
          </div>
        <?php endif; ?>

        <?php if (!empty($secondary_links)): ?>
          <div id="secondary" class="clear-block">
            <?php print theme('links', $secondary_links, array('class' => 'links secondary-links')); ?>
          </div>
        <?php endif; ?>
      </div> <!-- /navigation -->
          <?php print $sidebar; ?>
        </div> <!-- /sidebar -->

      <div id="contentBox">
     
          <?php if (!empty($title)): ?>
            <h1 class="title" id="page-title"><?php print $title; ?></h1>
          <?php endif; ?>
     
        <div id="contentInner">    

       
        <?php if (!empty($mission)): ?>
          <div id="mission"><?php print $mission; ?></div>
        <?php endif; ?>

         
        <div id="content">
         
          <?php if (!empty($tabs)): ?>
            <div class="tabs"><?php print $tabs; ?></div>
          <?php endif; ?>
         
          <?php if (!empty($messages)): print $messages; endif; ?>
          <?php if (!empty($help)): print $help; endif; ?>
         
          <div id="content-content" class="clear-block">
            <?php print $content; ?>
          </div> <!-- /content-content -->
         
          <?php print $feed_icons; ?>
        </div> <!-- /content -->
       
        </div>
      </div> <!-- /contentInner /contentBox -->


  </div>  
   
      <div id="footer">
        <?php print $footer_message; ?>
        <?php if (!empty($footer)): print $footer; endif; ?>
      </div> <!-- /footer -->

    <?php print $closure; ?>

</body>
</html>

page-blog.tpl.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" xml:lang="<?php print $language->language ?>" lang="<?php print $language->language ?>" dir="<?php print $language->dir ?>">

<head>
  <?php print $head; ?>
  <title><?php print $head_title; ?></title>
  <?php print $styles; ?>
  <?php print $scripts; ?>
  <script type="text/javascript"><?php /* Needed to avoid Flash of Unstyled Content in IE */ ?> </script>
</head>
<body class="root <?php print $body_classes; ?> scroller">
  <div id="wrap">
    <div id="header">
      <div id="logo-title">

        <?php if (!empty($logo)): ?>
          <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
            <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
          </a>
        <?php endif; ?>

          <?php if (!empty($site_name)): ?>
            <h2 id="site-name">
              <a href="<?php print $front_page ?>" title="<?php print t('Home'); ?>" rel="home"><span><?php print $site_name; ?></span></a>
            </h2>
          <?php endif; ?>
     
        <?php if (!empty($breadcrumb)): ?><div id="breadcrumb"><?php print $breadcrumb; ?></div><?php endif; ?>

          </div> <!-- /logo-title -->

      <?php if (!empty($search_box)): ?>
        <div id="search-box"><?php print $search_box; ?></div>
      <?php endif; ?>

      <?php if (!empty($header)): ?>
        <div id="header-region">
          <?php print $header; ?>
        </div>
      <?php endif; ?>

    </div> <!-- /header -->

        <div id="sidebar">
              <div id="navigation" class="menu <?php if (!empty($primary_links)) { print "withprimary"; } if (!empty($secondary_links)) { print " withsecondary"; } ?> ">
        <?php if (!empty($primary_links)): ?>
          <div id="primary" class="clear-block">
            <?php print theme('links', $primary_links, array('class' => 'primary-links')); ?>
          </div>
        <?php endif; ?>

        <?php if (!empty($secondary_links)): ?>
          <div id="secondary" class="clear-block">
            <?php print theme('links', $secondary_links, array('class' => 'links secondary-links')); ?>
          </div>
        <?php endif; ?>
      </div> <!-- /navigation -->
          <?php print $sidebar; ?>
        </div> <!-- /sidebar -->

      <div id="contentBox">
     
          <?php if (!empty($title)): ?>
            <h1 class="title" id="page-title"><?php print $title; ?></h1>
          <?php endif; ?>
     
        <div id="contentInner">    

       
        <?php if (!empty($mission)): ?>
          <div id="mission"><?php print $mission; ?></div>
        <?php endif; ?>

         
        <div id="content">
         
          <?php if (!empty($tabs)): ?>
            <div class="tabs"><?php print $tabs; ?></div>
          <?php endif; ?>
         
          <?php if (!empty($messages)): print $messages; endif; ?>
          <?php if (!empty($help)): print $help; endif; ?>
         
          <div id="content-content" class="clear-block">
            <?php print $content; ?>
          </div> <!-- /content-content -->
         
          <?php print $feed_icons; ?>
        </div> <!-- /content -->
       
        </div>
      </div> <!-- /contentInner /contentBox -->


  </div>  
   
      <div id="footer">
        <?php print $footer_message; ?>
        <?php if (!empty($footer)): print $footer; endif; ?>
      </div> <!-- /footer -->

    <?php print $closure; ?>

</body>
</html>

page-front.tpl.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" xml:lang="<?php print $language->language ?>" lang="<?php print $language->language ?>" dir="<?php print $language->dir ?>">

<head>
  <?php print $head; ?>
  <title><?php print $head_title; ?></title>
  <?php print $styles; ?>
  <?php print $scripts; ?>
  <script type="text/javascript"><?php /* Needed to avoid Flash of Unstyled Content in IE */ ?> </script>
</head>
<body class="root <?php print $body_classes; ?>">
  <div id="wrap">

    <h1 id="site-name"><?php print $site_name; ?></h1>
    <h2><a href="<?php print $front_page; ?>album">相册</a>/<a href="<?php print $front_page; ?>blog">日志</a></h2>
    <div id="footer">
      <?php print $footer_message; ?>
      <?php print $feed_icons; ?>
      <?php if (!empty($footer)): print $footer; endif; ?>
    </div>

  </div>  

    <?php print $closure; ?>

</body>
</html>

游客 的头像

(无主题)

forest 的头像

感谢你的视频教程,非常好。 我一边学习,一边实验。我想

感谢你的视频教程,非常好。

我一边学习,一边实验。我想在主页上显示的标题前面和后面各加一个小图标。前面的是作者图标,点击可以看到本作者文章列表。后边的是“打开新窗口来阅读”标签。

请问,要做出这个要用什么工具?

我看了views的用法,初步了解了theming。不知道要做出上面的效果是否需要写代码。

非常感谢!

无须猫 的头像

前面的是作者图标,点击可以看到本作者文章列表。 本作者文

前面的是作者图标,点击可以看到本作者文章列表。

本作者文章列表可以使用views来获得,新建个page,添加一个uid的argument即可。

我一边学习,一边实验。我想在主页上显示的标题前面和后面各加一个小图标。前面的是作者图标,点击可以看到本作者文章列表。后边的是“打开新窗口来阅读”标签。

编辑你主题下的node.tpl.php文件,把下面的代码加入合适的位置即可:

<?php if (!$page): ?>
  <h2><a href="/<?php print $uid ?>/content"><img src="你的图标地址" alt="此作者的所有文章" title="此作者的所有文章" /></a><a href="<?php print $node_url ?>" title="<?php print $title ?>"><?php print $title ?></a><a href="<?php print $node_url ?>" target="_blank"><img src="你的图标地址" alt="新窗口打开" title="新窗口打开" /></a></h2>
<?php endif; ?>

forest 的头像

我建立了一个新的content

我建立了一个新的content type用来做一些好文章的摘要, 并建立了一个field, 是这些摘要的原网站地址。我想增加一个“打开原文地址”的链接。我已经定义了“原文地址”为field_url, 可以正常显示,但是太长,不如只写出"阅读原文",并对"阅读原文"链接上原文地址。其实就是把你上文提到的$node_url该为新的变量field_url就可以了。但是不知道如何抓取自己定义的field, 即field_url。试了几次都不认。

对于自己创建的field应该如何抓取呢?

一晃离上次发贴已经一年,再次感谢。

forest 的头像

学习了theme系统,尝试建立node--type.tpl

学习了theme系统,尝试建立node--type.tpl.php, 在里面用通过下面的方式终于调用了新建立的变量

$content['field_work-type']['#items']['0']['value'];

对theme还是不熟悉,又遇到下面问题。

“阅读全文”自动放在下一行,不知道市值可以让“阅读全文”紧随内容的最后面,不分行。

多谢!

forest 的头像

多谢你的详细指导!我会按照这个思路做一下。

多谢你的详细指导!我会按照这个思路做一下。

游客 的头像

猫哥,怎么最简单的把相册页面的210H_SC图片像你这样排

猫哥,怎么最简单的把相册页面的210H_SC图片像你这样排列呀??

无须猫 的头像

布局和样式使用css来控制。

布局和样式使用css来控制。

游客 的头像

追加个问题...怎么让相册节点中照片的显示方式是Views

追加个问题...怎么让相册节点中照片的显示方式是Views中设置的呢,比如幻灯片之类的.还有怎么创建最新图片,随即图片之类的区块呢?完全新手,弱智问题,还请体谅了猫哥...

无须猫 的头像

看具体情况,可能需要修改模板。

看具体情况,可能需要修改模板。

游客 的头像

哦,谢拉!!

哦,谢拉!!

游客 的头像

求助,删除page.tpl.php进入admin啥都显示不了了。

求助,删除page.tpl.php进入admin啥都显示不了了。

无须猫 的头像

到modules/system/目录里重新复制一个page

到modules/system/目录里重新复制一个page.tpl.php到你的主题目录中即可。

ps.建议在此处(/admin/settings/admin)设个管理界面专用主题。

游客 的头像

启用DEVEL模块后出现

 

 

 

  • warning: include_once() [function.include]: Failed opening 'system.admin.inc' for inclusion (include_path='.;E:\xampp\php\pear\') in E:\xampp\htdocs\kongqh\sites\all\modules\devel\devel_themer.module on line 380.
  •  

     

    无须猫 的头像

    请参考此处的回复 http://xdrupal.org

    游客 的头像

    猫哥你好,在用户管理-权限页面中,我的页面怎么都加上标签了

    猫哥你好,在用户管理-权限页面中,我的页面怎么都加上标签了,就是这个样子:

    <span id="thmr_2" class="thmr_call"> admin_menu</span> 模块

    <span id="thmr_17" class="thmr_call"> block</span> 模块

    这是怎么回事呢?

    无须猫 的头像

    这是devel themer模块造成的,禁用此模块即可。

    这是devel themer模块造成的,禁用此模块即可。

    橡树 的头像

    猫哥,有个小小的问题,我开启了devel Theme

    猫哥,有个小小的问题,我开启了devel Theme developer 后,为什么Themer info出现在了左上角,怎么不跟你视频上的一样呀?

    无须猫 的头像

    难道新版本改过了? 你使用什么浏览器?有可能是ie不

    1. 难道新版本改过了?
    2. 你使用什么浏览器?有可能是ie不支持fixed的原因,不过我没在ie下使用过theme developer。猜的。
    橡树 的头像

    恩,对,是浏览器的问题,我用的是遨游,改成火狐就好了。谢谢

    恩,对,是浏览器的问题,我用的是遨游,改成火狐就好了。谢谢了!

    东方龙马 的头像

    猫哥的教程做的真好

    能看得出是很用心去做的东西,值得学习!赞一个!

    无须猫 的头像

    嘿嘿,谢谢捧场:)

    嘿嘿,谢谢捧场:)

    发表新评论

    此内容将保密,不会被其他人看见。
    • 自动将网址与电子邮件地址转变为链接。
    • 允许HTML标签:<a> <p> <span> <div> <h1> <h2> <h3> <h4> <blockcode> <h5> <h6> <img> <map> <area> <hr> <br> <br /> <ul> <ol> <li> <dl> <dt> <dd> <table> <tr> <td> <em> <b> <u> <i> <strong> <font> <del> <ins> <sub> <sup> <quote> <blockquote> <pre> <address> <code> <cite> <embed> <object> <param> <strike> <caption>
    • 自动断行和分段。
    • You can enable syntax highlighting of source code with the following tags: <code>, <blockcode>, <as>, <as3>, <asp>, <css>, <drupal5>, <drupal6>, <html>, <js>, <php>. Beside the tag style "<foo>" it is also possible to use "[foo]". PHP source code can also be enclosed in <?php ... ?> or <% ... %>.

    更多关於格式化选项的信息

    CAPTCHA
    请输入问题的答案。
    Fill in the blank