编辑“Prestashop快速手册”

[[PrestaShop]],像所有的[[PHP]]脚本语言一样会加载本地[[服务器]]上的 index.php 文件。如果你的 Prestashop 商店程序是放在mystore.com，当客户端输入[[URL]] :  <nowiki>http://www.mystore.com</nowiki>, webserver会自动加载到index 这个页面。

为了了解咋们的Prestashop是如何运行的，我们需要去了解下index文件是如何去工作的。

==Index.php==
Prestashop index.php文件中包含着以下的代码 ：
<pre>
 <?php
 include(dirname(__FILE__).'/config/config.inc.php');
 include(dirname(__FILE__).'/header.php');
  
 $smarty->assign('HOOK_HOME', Module::hookExec('home'));
 $smarty->display(_PS_THEME_DIR_.'index.tpl');
  
 include(dirname(__FILE__).'/footer.php');
  
 ?>
</pre>

在 index.php 文件的开始包含着一个 config.inc.php 的文件，这个文件时主要处理我们的主要设置还有一些程序相关其它设置，config.inc.php 会检查是否所有的东西已经安装好了，并且确认了我们的默认模版和默认目录，还有路径、订单的状态还有其它的一些设置。或者现在你已经在抱怨着什么时候才能开始学习到相关的模版制作，现在我们只知道 index.php 中包含了什么而已。

然而，作为一个网页设计者，你可能需要及时地注意到了[[网页]]上的错误信息，因此现在就要用到刚才所提到的 config.inc.php 文件了，在这个文件最上面几行，你可以看到：
<pre>
  @ini_set('display_errors', 'off');
  你可以选择把它打开或关闭
  @ini_set('display_errors', 'on');
</pre>

现在你可以关闭错误信息报告了。不过要注意在下次正式安装前要吧它改回来。

==Header.php==
下一步，来看看 header.php 的代码：
<pre>
  <?php
   
  // P3P Policies (http://www.w3.org/TR/2002/REC-P3P-20020416/ compact_policies)
  header('P3P: CP="IDC DSP COR CURa ADMa OUR IND PHY ONL COM STA"');
   
  require_once(dirname(__FILE__).'/init.php');
   
  /* CSS */
  $css_files[_THEME_CSS_DIR_.'global.css'] = 'all';
   
  /* Hooks are voluntary out the initialize array (need those variables already assigned) */
  $smarty->assign(array(
      'HOOK_HEADER' => Module::hookExec('header'),
      'HOOK_LEFT_COLUMN' => Module::hookExec('leftColumn'),
      'HOOK_TOP' => Module::hookExec('top'),
      'static_token' => Tools::getToken(false),
      'token' => Tools::getToken(),
      'priceDisplayPrecision' => _PS_PRICE_DISPLAY_PRECISION_,
      'content_only' => intval(Tools::getValue('content_only'))
  ));
   
  if(isset($css_files) AND !empty($css_files)) $smarty->assign('css_files', $css_files);
  if(isset($js_files) AND !empty($js_files)) $smarty->assign('js_files', $js_files);
   
  /* Display a maintenance page if shop is closed */
  if (isset($maintenance) AND (!isset($_SERVER['REMOTE_ADDR']) OR $_SERVER['REMOTE_ADDR'] != Configuration::get('PS_MAINTENANCE_IP')))
  {
      header('HTTP/1.1 503 temporarily overloaded');
      $smarty->display(_PS_THEME_DIR_.'maintenance.tpl');
      exit;
  }
   
  $smarty->display(_PS_THEME_DIR_.'header.tpl');
   
  ?>

</pre>

接下来我们可以看到这句代码：

 $smarty->assign('HOOK_HOME', Module::hookExec('home'));

这里将会指定分配hook（我们通常都会第一时间把hook给指定分配了，你也可以指定哪些模块在你[[网站]]中出现）

 $smarty->display(_PS_THEME_DIR_.'index.tpl');

这一行代码是说明 index.tpl 相当于默认主题模版目录的位置（你可以定义或者添加你的主题，backoffice>> preferances>>appearance）

==Footer.php==

 include(dirname(__FILE__).'/footer.php');

这一行代码include了我们的 footer.php文件，看下footer.php文件代码：
<pre>  
  <?php
   
  if (isset($smarty))
  {
      $smarty->assign(array(
          'HOOK_RIGHT_COLUMN' => Module::hookExec('rightColumn'),
          'HOOK_FOOTER' => Module::hookExec('footer'),
          'content_only' => intval(Tools::getValue('content_only'))));
      $smarty->display(_PS_THEME_DIR_.'footer.tpl');
  }
   
  ?>
</pre> 
尽管我们现在了解到了程序的配置设置，hooks还有不同的php文件包含，但是你会发现，目前为止，还没出现我们所熟悉的[[HTML]]代码。其实这个就是我们所有templates(tpl)的来源入口。tpl文件里面包含着HTML还有[[Smarty]]模版语言。这些tpl文件大多都在你的模版目录下，有些也在每个功能模块目录下。

现在来看看header.php文件，你会看到里面有这些代码：
<pre>
  $css_files[_THEME_CSS_DIR_.'global.css'] = 'all';
  if(isset($css_files) AND !empty($css_files)) $smarty->assign('css_files', $css_files);
  if(isset($js_files) AND !empty($js_files)) $smarty->assign('js_files', $js_files);
   
  $smarty->display(_PS_THEME_DIR_.'maintenance.tpl');  -  Will display a maintenance page called maintenance.tpl if your shop is closed */
   
  $smarty->display(_PS_THEME_DIR_.'header.tpl');
</pre>

我们的global.css和[[css]]、 [[javascript]]文件都被包含在这里，html的显示来自于header.tpl文件。

以此类推，index.php 和footer.php也有这对应的index.tpl和footer.tpl（其它的文件也是这样的命名规则）

现在目前看起来好像有点混乱了，不用担心，坚持下去，接下来会变得简单些的。
好了，从这里开始打段，总结下：index.php文件包含着header.php,index.tpl和footer.tpl,header.php和 footer.php的tpl文件也分别取自他们本身的文件名。

我们主要的HTML代码都来源于这三个tpl文件。

现在我们来打开header.tpl,index,tpl 还有footer.tpl,这里对于web设计师会相对熟悉点

==Header.tpl==
<pre>
   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="{$lang_iso}">
      <head>
          <base href="{$protocol}{$smarty.server.HTTP_HOST|escape:'htmlall':'UTF-8'}{$base_dir}" />
          <title>{$meta_title|escape:'htmlall':'UTF-8'}</title>
  {if isset($meta_description) AND $meta_description}
          <meta name="description" content="{$meta_description|escape:htmlall:'UTF-8'}" />
  {/if}
  {if isset($meta_keywords) AND $meta_keywords}
          <meta name="keywords" content="{$meta_keywords|escape:htmlall:'UTF-8'}" />
  {/if}
          <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
          <meta name="generator" content="PrestaShop" />
          <meta name="robots" content="{if isset($nobots)}no{/if}index,follow" />
          <link rel="icon" type="image/vnd.microsoft.icon" href="{$img_ps_dir}favicon.ico" />
          <link rel="shortcut icon" type="image/x-icon" href="{$img_ps_dir}favicon.ico" />
  {if isset($css_files)}
      {foreach from=$css_files key=css_uri item=media}
      <link href="{$css_uri}" rel="stylesheet" type="text/css" media="{$media}" />
      {/foreach}
  {/if}
          <script type="text/javascript" src="{$base_dir}js/tools.js"></script>
          <script type="text/javascript">
              var baseDir = '{$base_dir}';
              var static_token = '{$static_token}';
              var token = '{$token}';
              var priceDisplayPrecision = {$priceDisplayPrecision*$currency->decimals};
          </script>
          <script type="text/javascript" src="{$base_dir}js/jquery/jquery-1.2.6.pack.js"></script>
          <script type="text/javascript" src="{$base_dir}js/jquery/jquery.easing.1.3.js"></script>
  {if isset($js_files)}
      {foreach from=$js_files item=js_uri}
      <script type="text/javascript" src="{$js_uri}"></script>
      {/foreach}
  {/if}
          {$HOOK_HEADER}
      </head>
    
      <body {if $page_name}id="{$page_name|escape:'htmlall':'UTF-8'}"{/if}>
      {if !$content_only}
          <div id="page">
   
              <!-- Header -->
              <div>
                  <h1 id="logo"><a href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}"><img src="{$img_ps_dir}logo.jpg" 
alt="{$shop_name|escape:'htmlall':'UTF-8'}" /></a></h1>
                  <div id="header">
                      {$HOOK_TOP}
                  </div>
              </div>
   
              <!-- Left -->
              <div id="left_column" class="column">
                  {$HOOK_LEFT_COLUMN}
              </div>
   
              <!-- Center -->
              <div id="center_column">
      {/if}

</pre>

==Index.tpl==

  {$HOOK_HOME}

==Footer.tpl==
<pre>
     {if !$content_only}
              </div>
   
  <!-- Right -->
              <div id="right_column" class="column">
                  {$HOOK_RIGHT_COLUMN}
              </div>
   
  <!-- Footer -->
              <div id="footer">{$HOOK_FOOTER}</div>
          </div>
      {/if}
      </body>
  </html>
</pre>

现在我们来看看homepage的源文件：

'''Index.tpl'''
<pre>
    !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
      <base href="http://127.0.0.1/prestashop/" />
      <title>Prestashop demo</title>
      <meta name="description" content="Shop powered by PrestaShop" />
      <meta name="keywords" content="shop, prestashop" />
      <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
      <meta name="generator" content="PrestaShop" />
      <meta name="robots" content="index,follow" />
      <link rel="icon" type="image/vnd.microsoft.icon" href="/prestashop/img/favicon.ico" />
      <link rel="shortcut icon" type="image/x-icon" href="/prestashop/img/favicon.ico" />
      <link href="/prestashop/themes/commotion/css/global.css" rel="stylesheet" type="text/css" media="all" />
          <script type="text/javascript" src="/prestashop/js/tools.js"></script>
          <script type="text/javascript">
              var baseDir = '/prestashop/';
              var static_token = '8d6a4d79d983512d770333775a7d8d24';
              var token = '521aacf70fb52a35b4f94e01366c4c64';
              var priceDisplayPrecision = 2;
          </script>
          <script type="text/javascript" src="/prestashop/js/jquery/jquery-1.2.6.pack.js"></script>
          <script type="text/javascript" src="/prestashop/js/jquery/jquery.easing.1.3.js"></script>
    </head>
      <body id="index">
              <div id="page">
   
              <!-- Header -->
              <div>
                  <h1 id="logo"><a href="/prestashop/" title="Prestashop demo"><img src="/prestashop/img/logo.jpg" alt="Prestashop demo" /></a></h1>
                  <div id="header">
                    
                  </div>
              </div>
   
              <!-- Left -->
              <div id="left_column" class="column">
                
              </div>
   
              <!-- Center -->
              <div id="center_column">
                       </div>
   
  <!-- Right -->
              <div id="right_column" class="column">
                
              </div>
   
  <!-- Footer -->
              <div id="footer">
          </div>
          </div>
          </body>
  </html>
</pre>

可能你会注意到了index.tpl 只有一行{$HOOK_HOME}。这里是因为index文件只在homepage上显示我们所指定的模块，我们的目录还有产品页将会显示其它的模块。

当然，你可能也会发现我们每个页面都有一个不同的body id，方便了我们用css去定义他们单独的每个页面，或许你以后还想在body上加上些class，那么这句是从哪句代码得来的呢？看看 header.tpl，这段代码就是用来实现它的:
<pre>
 <body {if $page_name} 
 id="{$page_name|escape:'htmlall':'UTF-8'}"{/if}> and 
 it is this code that gets the page name. 
 So category.tpl will have the <body id="category">
</pre>

==相关条目==
*[[ECShop]]
*[[OpenCart]]
*[[ZenCart]]
*[[PrestaShop]]

==参考来源==
*[http://www.jackyon.com/?p=1442 参考来源]

[[category:PrestaShop|K]]