zimbio theme

[allvip]

I made my first theme

with this theme I just want to prove that coppermine can look like a famous website (I choosed zimbio.com).

DEMO 1 index page that looks like zimbio home page: http://www.zimbio.com

DEMO 2 albums thumbnails page that looks like this zimbio page: http://www.zimbio.com/pictures/MOrHP2NZzAx/Shakira+Performs+Bryant+Park/browse :

DEMO 3 display media page that looks like this zimbio page: http://www.zimbio.com/pictures/MOrHP2NZzAx/Shakira+Performs+Bryant+Park/T3AaGxL3R5q :

Coppermine crops the images randomly when exact width and height is set in config for thumbnails.

The filmstrip can have smaller images but you have to edit coppermine files.
tutorial for small filmstrip images: http://forum.coppermine-gallery.net/index.php?topic=76163.0

[allvip]

DEMO 1,2,3,4 - Image previews (screenshoots)

DEMO 1 index- http://www.imagebam.com/image/cbb9aa315587849

DEMO 2 album thumbs- http://www.imagebam.com/image/4fb8a9315587864

DEMO 3 display media- http://www.imagebam.com/image/117b05315587874

DEMO 4 category- http://www.imagebam.com/image/3b3934315587880

[Niecher]

Hello Allvip,

I like it, great job.

Regards.

[allvip]

thanks.

[allvip]

the carousel is not included because it belongs to  zimbio but you can download a jquery carousel from google.
paste your jquery carousel html code in theme.php under function pageheader div customHeader.

[allvip]

1.I use bbcode in the Category description to have more description for categories and big images.

[allvip]

1.bbcode Category description:

Code Select Expand


[img]http://www.allvip.us/cpg/z/themes/zimbio/imgs_cat/beyonce.jpg[/img]

'Bey Good': Go Behind  the Scenes of Beyonce's Latin American Tour

[url=http://www.allvip.us/cpg/z/index.php?cat=2]It's more than just the music.[/url]


2.bbcode image description:

Code Select Expand


In This Photo: [url=http://www.allvip.us/cpg/z/thumbnails.php?album=2]Shakira[/url]
Shakira performs at the T-Mobil public promo concert held at Bryant Park.
[color=grey](October 10, 2013 - Source: Steve Sands/Bauer Griffin) [/color]


[allvip]

use  Picture navigation plugin for left right arrows for the image

http://forum.coppermine-gallery.net/index.php/topic,68456.0.html

open picture navigation plugin folder - open picture_navigation.js:

replace:

Code Select Expand


if ($('.navmenu_pic img[src*=prev]').parent().attr('href') != 'javascript:;') {
        icon_prev = $('.navmenu_pic img[src*=prev]').parent().html().match(/src="(.*?)"/);


with:

Code Select Expand


if ($('.navmenu_pic img[src*=prev]').parent().attr('href') != 'javascript:;') {
        icon_prev = $('.navmenu_pic img[src*=start]').parent().html().match(/src="(.*?)"/);


replace:

Code Select Expand


if ($('.navmenu_pic img[src*=next]').parent().attr('href') != 'javascript:;') {
        icon_next = $('.navmenu_pic img[src*=next]').parent().html().match(/src="(.*?)"/);


with:

Code Select Expand


if ($('.navmenu_pic img[src*=next]').parent().attr('href') != 'javascript:;') {
        icon_next = $('.navmenu_pic img[src*=end]').parent().html().match(/src="(.*?)"/);


this way the plugin will take the return to start and skip to end images.
I don't know how to edit the plugin to use customs images for the arrows.

[allvip]

if you use Category thumbnail not bbcode to display images for gategory add:

Code Select Expand


display:block;


to .catlink in style.css

IMPORTANT In template.html I forgot to change one word.Change curve with zimbio in the line below:

Code Select Expand

https://svn.code.sf.net/p/coppermine/code/trunk/cpg1.5.x/themes/curve/template.html $


[allvip]

DOWNLOD