首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >自动添加Nivo

自动添加Nivo
EN

Stack Overflow用户
提问于 2016-01-17 04:38:55
回答 1查看 442关注 0票数 0

我在我的站点中使用尼沃灯箱,我的所有图像都以这样的方式与这个插件集成:

代码语言:javascript
复制
<div class="portfolio-item">
<div class="portfolio-thumb ">
<a class="lightbox" data-lightbox-type="ajax" title="Strategic Planning Tahun Buku 2016 - 2020" href="{{ asset('images/tentang_cu.jpg') }}">
    <div class="thumb-overlay"><i class="fa fa-arrows-alt"></i></div>
    <img src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
         data-src="{{ asset('images/tentang_cu.jpg') }}" width="800" height="450">
</a>
</div>

有了这一点,我还添加了一些CSS样式,使图像掩蔽给用户一个线索,这个图像可以在中查看。

我的问题是:

在我的文章视图中,我有一个使用summernote的文本编辑器,其中有一个图像。那么,如何用这个html/样式自动添加它呢?添加<div class="portfolio-item">等就像这样?

因为我想在我的网站上保持一致,所有的图像都可以使用Nivo查看。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-01-17 08:01:16

作为wordpress插件,我认为你应该制作wordpress图片集,然后在那里叫那些图片库,如

我引用你提供的链接:

设立画廊 默认情况下,Nivo将只显示单个项目。要使用prev/next导航创建一个条目库,您需要向链接中添加一个data库属性。例如:

代码语言:javascript
复制
<a href="image1_large.jpg" data-lightbox-gallery="gallery1">
    <img src="image1_thumb.jpg" alt="" /> </a> <a href="image2_large.jpg" data-lightbox-gallery="gallery1">
    <img src="image2_thumb.jpg" alt="" /> </a> <a href="image3_large.jpg" data-lightbox-gallery="gallery1">
    <img src="image3_thumb.jpg" alt="" /> </a>
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/34835163

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档