0

我想知道是否有办法去除 EE 模板系统创建的额外空白并生成“更漂亮”的标记。

我喜欢让我的模板保持可读性。我经常在多年后重返工作岗位,不得不跟随其他开发人员的工作,或者作为团队的一员工作,当一切都井井有条并嵌套时,这会更容易。

问题是 EE 保留了所有的制表符和换行符,当你有很多条件等时,它会导致丑陋的代码。例如,这个:

<div class="
    event {if event_all_day}all_day{/if} 
    {if event_multi_day}multi_day{/if} 
    {if event_first_day}first_day{/if} 
    {if event_last_day}last_day{/if} 
    {if all_day_event_index_difference > 0}index_difference_{all_day_event_index_difference}{/if}
">
    {if event_multi_day} 
        <a href="{path='calendar_main/event'}/{event_id}/">{event_title}</a>
    {if:else}
        <a href="{path='calendar_main/event'}/{if edited_occurrence}{event_parent_id}{if:else}{event_id}{/if}/" title="{event_title}">{event_title}</a>
    {/if}
</div>

渲染成这样:

<div class="
                                         event all_day 
                                         multi_day 


                                                                               ">

                                         <a href="http://www.downtownmuncie.org/calendar_main/event/1832/">Minnetrista Glass Show</a>
                                                                       </div>

围绕 EE 标签的每个制表符和换行符都被保留,所以我在<div>和之间留了一英里的空白</div>

性能方面,这并不意味着什么。文件大小的增加可能存在争议,但可以忽略不计。在尝试使用 Firebug 浏览代码时,这也是一个障碍。

但最重要的是,它看起来很草率。

一个建议是相应地调整模板,如下所示:

<div class="event {if event_all_day}all_day {/if}{if event_multi_day}multi_day {/if}{if event_first_day}first_day {/if}{if event_last_day}last_day {/if}{if all_day_event_index_difference > 0} index_difference_{all_day_event_index_difference}{/if}">
    {if event_multi_day}<a href="{path='calendar_main/event'}/{event_id}/">{event_title}</a>{if:else}<a href="{path='calendar_main/event'}/{if edited_occurrence}{event_parent_id}{if:else}{event_id}{/if}/" title="{event_title}">{event_title}</a>{/if}
</div>

这不是一个真正可行的解决方案。考虑到整洁的模板和整洁的代码之间的选择,我不得不选择前者。

有没有办法两者兼得?

4

4 回答 4

2

tidy_template假设您有 2.4.0 或更高版本,则在 EE中有使用template_post_parse钩子的扩展。

https://github.com/sjelfull/sf.tidy_template.ee_addon

于 2012-08-16T18:32:50.443 回答
0

我不确定您是在寻找自动解决方案还是手动解决方案。我不知道任何自动的东西,但我相信更棒的人可以提供帮助。我是手册的粉丝,所以在我的 EE 模板上使用“真正的”编辑器,使用FF 中的 It's All Text在这些文本区域和我的编辑器之间建立连接。那时,您可以在模板上施加您的理念所规定的任何空白规则。

于 2012-08-14T11:17:42.660 回答
0

Jesse Bunch 的 AutoMin for EE具有 HTML 压缩功能。它不会像 HTMLTidy 那样美化您的缩进,但会删除所有空格以减小文件大小。

于 2012-08-14T13:47:52.363 回答
0

这是未经测试的,但在类似的情况下(老实说,不记得它是否是 EE)我已将空格放在服务器端代码中。因此:

<div class="event {if
    event_all_day}all_day {/if}{if
    event_multi_day}multi_day {/if}{if
    event_first_day}first_day {/if}{if
    event_last_day }last_day {/if}{if
    all_day_event_index_difference > 0}index_difference_{all_day_event_index_difference{/if}
">
    {if
        event_multi_day}<a href="{path='calendar_main/event'}/{event_id}/">{event_title}</a>
    {if:else
    }<a href="{path='calendar_main/event'}/{if edited_occurrence}{event_parent_id}{if:else
    }     {event_id}{/if}/" title="{event_title}">{event_title}</a>
    {/if}
</div>
于 2012-08-15T00:47:38.697 回答