Gallery:外观主题:PGlightbox

来自站长百科
跳转至： 导航、​ 搜索

PGlightbox，PGtheme克隆版[ ]

该外观主题需要最新版本Gallery的支持，目前是2.2-SVN ，Core 1.1.16 Theme API 2.4和Core API 7.0是此外观主题安装所必需的，并能保证类似 虚拟相册的Gallery 2.2特色得以体现。使用Lightbox 2.0.2脚本相关，请见Gallery:How_to_implement_Lightbox_on_Gallery_2，其中给出了一些新用途。



相关信息[ ]

Pedro Gilberto's wonderfull theme inspired me from the early days of version 1, and I always tried to keep it up to date with my Gallery installation - and as you probably know me from the forum contributions, I really like living at the edge. I mean I try always the latest stuff. Is it the latest SQLplus release, Apache Versions not released yet or the latest SVN version of the Gallery code ... it's on my server ;)

Unfortunately, Pedro is sometimes a bit slow catching up (having a lot of other responsibilities I assume), so I had to adjust the PGtheme more than once to get it up to date - and added some gimmicks like the flying Exif- and Comment-Boxes. Finally with 2.2-SVN, I've added support for the Virtual Albums and added - thanks to a discussion in the forums - a Lightbox.


计划中的版本/即将面世...[ ]

目前版本是1.2.0 – 计划实现如'flying'特点的自定义字段...

外观[ ]

  • Root-Album.jpg
  • Travel.jpg

乍一看几乎就是PGtheme – 但内藏玄机...

  • Lbox.0.jpg
  • Lbox.0b.jpg
  • Lbox.1.jpg
  • Lbox.2.jpg
  • Slider.jpg

并允许使用Lightbox-Display链接到相片页面（Photo-Page），最后会在相片页面上弹出一个Lightbox（总是使用第三个重设尺寸图片-这是我能想到最适合的了）。

另外，我在相片现实中采用了最新的技巧，即弹出式导航图片。

  • Lbox.3.jpg

看起来跟Gallery2.2的Keyalbum契合得很好。

外观主题设定[ ]

不同设定值的示例可以在下面的Snapshot中找到：

更多 – 会尽快添加说明性文字的 ;)


全局设定[ ]

非标准外观主题和选项的选取有问题，即Imageblocks的。我的解决办法就是使用标准的如Matrix的外观主题作为默认，将Root-Album转到PGlightbox，并将此外观主题应用到根目录相册下的所有相册。这就能让Siteadmin完美运行了- 因为它使用的是标准的外观主题。

  • Global.jpg

总览[ ]

  • Overall.jpg
  • Overall2.jpg

相册[ ]

  • Album.jpg


相册项目[ ]

  • AlbumItems.jpg


相片[ ]

  • Photo.jpg


微型缩略图[ ]

  • Thumbs.jpg


区块[ ]

  • Blocks.jpg


动作[ ]

  • Actions.jpg
  • Actions2.jpg


选用文本[ ]

  • Alternate.jpg


幻灯片[ ]

允许PGtheme幻灯片的使用，符合得很完美，因为它直接来自该外观主题- 并允许在适当的地方显示小的幻灯片图标。


  • Slideshow.jpg

页脚[ ]

没什么特别的 – 仅有选择显示XHTML小标志的选项 –用在gallery中的认证，Gallery，捐赠和版权信息。

  • Footer.jpg

互动框架[ ]

以下的设定会向显示的相片添加图片作者的版权通告。色彩特地应本人最爱的PGsnow颜色包进行了优化。

  • Frames.jpg
  • Frames2.jpg

文件:Canvas.jpg

窍门和技巧[ ]

Lightbox弹出窗口的尺寸[ ]

Photo Lightbox弹出窗口目前总会使用第三可用的重设尺寸图片- 为的就是符合标准的17"屏幕，你应当按如下所示使用相册编辑来定义重设尺寸的图片：

  • Resize.jpg

相册页面上的Lightbox预览图[ ]

相册页面上Lightbox预览图的尺寸必须在theme.inc中直接定义。默认的800px设定使得Gallery不得不查找最符合的重设尺寸图片来显示。 800px是17"屏幕的最佳契合，如果你的屏幕更大些的话，将此设定为960px或1024px会更好。 

  
				/* 向子值添加resizedId */
				if ( $theme['children'] ){
				    foreach ( $theme['children'] as $key => $value ){
				        if ( $value['id'] ){
				            list($ret,$resizedIds) =  
                                                  GalleryCoreApi::fetchResizesByItemIds(array($value['id']));
				            if ($ret)
				                return $ret;
				        }
				        $theme['children'][$key]['resizedId'] = $value['id'];
				        if ( $resizedIds ){
				            /* 找到最佳的重设尺寸图片
				             * 
				             * 使用宽/高最大值=800; */
				            $lboxMaxEdge = 800;
				            $resizedEdge = NULL;
				            $resizedId = NULL;
				            foreach ( $resizedIds[$value['id']] as $resize ){
						$width = $resize->getWidth();
				                $height = $resize->getHeight();
				                $edge = ( $width > $height )? $width : $height;
				                if ( $edge <= $lboxMaxEdge ){
				                    if ( !isset($resizedEdge) ){
				                        $resizedId = $resize->getId();
				                        $resizedEdge = $edge;
				                    } else if ( $edge > $resizedEdge ){ 
				                        $resizedId = $resize->getId();
				                        $resizedEdge = $edge;
				                    } 
				                }
				            }
				            $theme['children'][$key]['resizedId'] = $resizedId;
				        }
				    }
				}

如何应其他颜色包的需要对Lightbox进行调整[ ]

PGlightbox外观主题为了迎合PGsnow颜色包而进行了高度的优化。如果你要应用其他颜色包的话，就需要做一些调整。

图标[ ]

有特殊的图标，即对PGsnow\images\set1 and -set1\3d_on中的eCard功能，你需要复制到新的颜色包位置(ecard.gif & ecardon.gif).

Lightbox CSS[ ]

位于\PGlightbox\images\lb\css中的Lightbox-CSS也需要做一些调整， 

  

#outerImageContainer{
	position: relative;
	'''background-color: #f4f4f4;'''
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}
#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	'''background-color: #f4f4f4;'''
	margin: 0 auto;
	line-height: 1.4em;
	}
#imageData{
	padding:0 10px;
	'''background-color: #f4f4f4;'''
	}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; '''background-color: #f4f4f4;''' }	
#imageData #caption{ font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color=777; 
            '''background-color: #f4f4f4;'''}
#imageData #numberDisplay{
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 9px;
  color: #333;
	display: block; 
	clear: left; 
	padding-bottom: 1.0em; 
	'''background-color: #f4f4f4;'''
}			
#imageData #bottomNavClose{ background: url(../../close.gif) no-repeat; background-color: #f4f4f4; width: 22px; float: right; padding-bottom: 2.4em;}	
	
...
		
#'''overlay'''{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	'''background-color: #fff;'''
	filter:alpha(opacity=100);
	-moz-opacity: 1.0;
	opacity: 1.0;
	}

将它们设得更暗些 – 如overlay为#000 (黑色)，就会变成暗灰 – 使用已应用的透明度...

飞动的评论[ ]

要启用相片和相册页面上的飞动评论效果，你需要激活

BLOCKS :::

"BLOCKS :: 在相片页面上显示一个"Blocks"按钮（当被点击时，被选取看会显示：包含EXIF，评论等）" 并添加

外观主题设定（Theme Settings） :::

"相片页面上显示的区块" - '添加评论（Add Comment）'。


跳过'评论添加确认（Add Comment Confirmation）'[ ]

对于飞动效果评论来说，你可能想跳过"评论已添加"确认页面。 对"AddComment.inc"模块的语句行稍作修改就可以达成了。 找到"modules\comment\AddComment.inc"文件，搜索其中的字串： "/* 现在就将用户送至确认页面*/" 接着修改 

  		
       /* 现在就将用户送至确认页面*/
	$redirect['view'] = 'comment.CommentChangeConfirmation';
	$redirect['itemId'] = (int)$itemId;
	$status['added'] = 1;
    }

to 

  
       /*现在就将用户送至确认页面*/
	$redirect['view'] = 'core.ShowItem';
	$redirect['itemId'] = (int)$itemId;
	$status['added'] = 1;
    }

压缩文件[ ]

附带的ZIP文件包含所有需要的文件，但请注意，这是Gallery2.2的初次试用版- 所以你可能会碰到问题，这些问题在此讨论或直接放到论坛上讨论都可以。

9月6日[ ]

更新：06.09.2006 – 按照SVN-Revision 14460已更新album.tpl和photo.tpl 

core.EmergencyEditItemLink区块的check*Blocks参量现已不再使用；
新格式是checkBlocks="sidebar,album"; 在包括具有区块列表而不是边栏.相册.相片的
carbon在内的所有外观主题中使用。将这些外观主题的Core API
设为7.10

9月7日[ ]

更新: 07.09.2006 – 在相片页面上实现了'发送eCard图标'，并修复了顶部导航中可用购物车的显示问题。"添加至购物车（Add Item to Cart）" vs "购买（Purchase Item）"。 添加了含有标准模块的归档文件，如PGcolorpacks，PGimageframes和PGslideshow.

文件:Ecard.jpg


9月14日[ ]

更新: 14.09.2006 – 实现了TripTracker.net – 相册页面的幻灯片

文件:Slider.jpg


10月1日[ ]

更新: 01.10.2006 - 1.1.3 实现的飞动效果的评论框，并修复了一些有关权限的小问题（相片页面上的Lightbox弹出窗口对游客不可见）。相册项目上的飞动效果评论能够起效，但仅首个评论的格式图标有戏。尚未寻得解决办法。

文件:Comment.jpg


10月6日[ ]

更新: 06.10.2006 - 1.1.4 弹出窗口和对话框的合理堆叠，鼠标悬停事件中，鼠标箭头变动表明'飞动效果对话框'。相片页面上的框架和画框可以再次具有Shadow-Image框架了。

文件:Stack.jpg

和

文件:Proper.jpg


10月18日[ ]

更新: 18.10.2006 - 1.1.5 添加了可启用/禁用Java幻灯片的开关，以及在相册链接上显示'g2_enterAlbum='的开关， 在所有管理页面上重新启用边栏动作并调整了部分阻碍Lightbox开关的$theme.params


11月19日[ ]

更新: 19.11.2006 - 1.2.0 修复了若干被遗忘的本地文件引用（感谢这些测试者们;)）并转到了Lightbox 2.0.2+，它带有更好了屏幕缩放（填充）特点。




目前版本可在用户贡献页面找到或直接点此下载。 类似幻灯片，图片框和颜色包的模块仍可用于PGlightbox，我为了诸位的便利对它们进行了添加，点此下载。

鸣谢[ ]

衷心感谢Pedro为此外观主题的实现付出了努力，感谢你设计此外观主题的主要部分！ 希望你不介意我们使用你的框架... 如果你喜欢此外观主题，请在我的访客簿上留名或在lf-photodesign.de上留言。你们的反馈会得到很高的重视。

嗯，还有，把访客簿做成Gallery模块这主意如何呢？

取自“https://www.zzbaike.com/wiki/Gallery:外观主题:PGlightbox?oldid=14615”