PrestaShop 1.6头部添加Facebook Pixel触发Smarty语法错误

运行环境：PrestaShop v1.6.1.10
在站点头部区域添加Facebook Pixel代码时触发致命错误，经确认存在语法解析问题，具体报错信息如下：

Fatal error: Uncaught --> Smarty Compiler: Syntax error in template "/shop/themes/default-bootstrap/header.tpl" on line 86 "{if(f.fbq)return;n=f.fbq=function(){n.callMethod?" - Unexpected ".", expected one of: "","" , ")" <-- thrown in /shop/tools/smarty/sysplugins/smarty_internal_templatecompilerbase.php on line 86

已尝试以下排查操作，问题均未解决：

• 禁用HTML minifer
• 清空站点缓存
  初步判断为Smarty模板编译器无法识别新版Facebook Pixel的代码语法，需要对应修复方案。

报错核心原因是PrestaShop 1.6自带的Smarty模板引擎，默认会把模板文件里的{、}识别成自身语法的起始/结束标记。添加的Facebook Pixel代码开头就是{if(f.fbq)return;...片段，刚好撞上Smarty自带的{if}标签规则，编译器直接把这段JS代码当成Smarty语法解析，自然就抛出语法错误。

方案一：用Smarty字面量标签包裹Pixel代码（推荐） #

Smarty提供的{literal}标签作用是标记范围内的内容不需要做模板语法解析，直接原样输出，完全不会影响JS代码的正常运行，是改动最小的处理方式。
操作很简单：把整段Facebook Pixel代码放在{literal}和{/literal}标签中间即可，参考结构如下：

{literal}
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'你的Pixel脚本加载地址');
fbq('init', '你的像素ID');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="你的Pixel无脚本追踪地址"
/></noscript>
{/literal}

如果需要在Pixel代码里插入Smarty动态变量（比如订单金额、商品ID这类转化参数），可以临时闭合{literal}标签输出变量，再重新开标签包裹剩余JS内容，参考写法：

{literal}
fbq('track', 'Purchase', {
  value: {/literal}{$order.total_paid_tax_incl}{literal},
  currency: '{/literal}{$currency.iso_code}{literal}'
});
{/literal}

方案二：把Pixel代码存为独立静态JS文件引入 #

把Facebook Pixel的JS逻辑单独存为.js后缀的静态文件，上传到站点主题的JS资源目录，在header.tpl里通过普通script标签引入这个静态文件就行。Smarty不会解析外部引入的静态JS文件内容，不会触发编译错误。

改完模板文件后，必须再次清空PrestaShop全站缓存，可以通过后台「高级参数-性能」页面操作清空，也可以手动删除/shop/var/cache/目录下的所有文件，避免旧的模板编译缓存导致修改不生效。

内容的提问来源于stack exchange，提问作者Peeter