Smarty模板条件渲染问题：仅当$customtab.description非空时显示按钮

直接给你正确的实现代码，再说说你之前写法的问题：

正确代码 #

把Fullscreen按钮放在正确的条件判断里，只有当$customtab.description字段有内容时才渲染这个按钮：

<div id="custom-tab-{$customtab.id_tab|escape:'htmlall':'UTF-8'}" class="tab-pane fade in revealOnScroll animated fadeInUp">{$customtab.description nofilter}</div>
{hook h='displayAfterProductThumbs' product=$product}
{if !empty($customtab.description)}
<button onclick="iframetrailer()" id="buttoniframe">Fullscreen</button>
{/if}
</div>

你之前代码的问题 #

1. Smarty语法错误：{if !empty({$customtab.description)} 写法不对，Smarty在{if}条件里引用变量不用套{$}，直接写$customtab.description即可，而且你这里的括号配对也有误。
2. 逻辑完全颠倒：你想让字段有数据时显示按钮，但错误代码里反而添加了display: none样式隐藏按钮，还重复输出了一次按钮，导致不管字段有没有内容，按钮都会被错误隐藏。
3. DOM元素重复：原代码里已经有一个id="buttoniframe"的按钮，错误代码又重复添加了一次，同一个页面内ID不能重复，会导致后续JS操作出现异常。

如果不想直接不渲染按钮，而是用CSS控制显示隐藏，也可以这么写：

<div id="custom-tab-{$customtab.id_tab|escape:'htmlall':'UTF-8'}" class="tab-pane fade in revealOnScroll animated fadeInUp">{$customtab.description nofilter}</div>
{hook h='displayAfterProductThumbs' product=$product}
<button onclick="iframetrailer()" id="buttoniframe" class="{if empty($customtab.description)}hidden{/if}">Fullscreen</button>
</div>

然后在样式中定义：

.hidden { display: none; }

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