在液体中创建自定义块标签

时间:2015-08-13 22:08:03

标签: html ruby-on-rails template-engine liquid

我正在尝试制作一个自定义标记{% render-slider, ['image1.jpg', 'image2.jpg',...] %},该标记会转换为以下html代码。

<div class="slider">
    <a href="#" class="unslider-arrow prev icon-chevron-with-circle-left"></a>
    <a href="#" class="unslider-arrow next icon-chevron-with-circle-right"></a>
    <ul>
        <% images.each do |image| %>
            <li style="background-image: url(<%= asset_path image %>);">
        <% end %>
       </li>
    </ul>
</div>

这将在博客网站上使用,以便用户可以使用此自定义标记,同时制作博客帖子,为他们的图片生成特定的布局 - 他们在博客帖子中的感觉。 我一直在谷歌阅读和阅读几个小时,但对于像我这样的初学者来说,文档并不容易。 到目前为止,我已经有了这个(这可能是完全错误的):

class FillSlider < Liquid::Block
def initialize(tag_name, images, tokens)
    super
    @images = images
end
def render(context)
    **template filled with images**
end

正如您所看到的,我一直在编写渲染方法。我知道它必须是这样的东西,但我不能把它们放在一起......

<div class="slider">
    <a href="#" class="unslider-arrow prev icon-chevron-with-circle-left"></a>
    <a href="#" class="unslider-arrow next icon-chevron-with-circle-right"></a>
    <ul>
        {% for image in images%}
            <li style="background-image: url({{image}});">
        {% end %}
       </li>
    </ul>
</div>

任何人都可以帮助我吗?如果你在使用asset_path帮助器时遇到问题,请不要让它阻止你,这是我们稍后可以解决的问题,现在我只想知道应该如何构建这个自定义标记。

0 个答案:

没有答案