UNITE Gallery-图片库插件（DLE 13及更高版本）

UNITE Gallery 简介

Unite Gallery是一个基于jquery库的多用途jаvascript库。它采用模块化技术构建，注重易用性和定制性。自定义图库，使用CSS更改其皮肤，甚至编写自己的主题都非常容易。但是，这个画廊非常强大，快速，并具有大多数现代功能，例如响应能力，触摸控制甚至缩放功能，这是一种独特的效果。

特点

图库读取的视频来自：Youtube，Vimeo，HTML5，Wistia和SoundCloud（没有视频，但仍然）响应式 - 适应所有屏幕，自动备份比例激活触摸 - 图库的每个部分都可以由响应式触摸屏设备控制 - 图库可以调整屏幕大小并对屏幕大小的变化做出反应。可换肤 - 允许您轻松地将外观更改为另一个CSS文件，而无需触摸主CSS库。可主题化 - 库具有不同的主题，每个主题都有自己的选项和功能，但它使用库缩放效果中的主要对象 - 库具有独特的缩放效果，可以使用触摸屏设备上的按钮，鼠标滚轮或捏合手势进行应用。从键盘（左，右箭头）大量选项。该库为库中的每个对象提供了大量选项，使自定义过程变得简单而有趣。强大的API - 使用图库API，您可以将图库集成到您网站的行为中，并将其与其他元素（如灯箱等）一起使用。

注意：在模块的压缩包中，有一个现成的模板用于显示图片库。但您需要先在“自定义字段”部分创建一个新的附加字段

第一步：将模块连接到网站模板

在 main.tpl 站点的主模板中，在</head> 之前添加以下代码：

代码语言：javascript

复制

<link href="{THEME}/assets/unitegallery/css/unite-gallery.css" rel="stylesheet">
<link href="{THEME}/assets/unitegallery/themes/default/ug-theme-default.css" rel="stylesheet">

第二步：激活库

需要在 main.tpl 站点的主模板中添加以下代码，在</body> 之前添加以下代码：

代码语言：javascript

复制

<script src="{THEME}/assets/unitegallery/js/unitegallery.min.js"></script>
<script src="{THEME}/assets/unitegallery/themes/grid/ug-theme-grid.js"></script>
{* activation du plug-in unitegallery *}

<script type="text/jаvascript">

jQuery(document).ready(function(){

jQuery("#galleryBase").unitegallery();

jQuery("#alterGallery").unitegallery({

gallery_autoplay:true,

slider_transition: "slide",

slider_control_zoom:false,

gallery_width:,

gallery_height:,

slider_scale_mode_fullscreen: "down",

gallery_theme: "grid",

theme_panel_position: "bottom",

gallery_control_thumbs_mousewheel:true

});

jQuery("#partsGallery").unitegallery({

gallery_autoplay:true,

slider_transition: "slide",

slider_scale_mode_media: "down",

theme_panel_position: "left"

});

});

</script>

例如

1. 前往 (fullstory.tpl), 添加代码以显示带有 ID 的已上传图库 画廊基地

代码语言：javascript

复制

 [xfgiven_manyfotos]{include file="assets/unitegallery/tpl/showfull-xfields.tpl"}[/xfgiven_manyfotos]

2. 前往 (fullstory.tpl) 添加代码以显示带有 ID 的已上传画廊 自动画廊

代码语言：javascript

复制

[xfgiven_manyfotos]{include file="assets/unitegallery/tpl/xfields_altergallery.tpl"}[/xfgiven_manyfotos]

3. 前往 (fullstory.tpl) 添加代码以显示带有 ID 的已上传画廊 零碎图库

代码语言：javascript

复制

[xfgiven_manyfotos]{include file="assets/unitegallery/tpl/xfields_partsgallery.tpl"}[/xfgiven_manyfotos]

此代码将显示通过附加字段加载的即用型图片库 画廊基地.如果附加字段为空，则此块将不会加载到模板中 fullstory.tpl.