forum.coppermine-gallery.net

Support => cpg1.5 themes (visuals) => cpg1.5.x Support => cpg1.5 theme contributions => Topic started by: allvip on October 17, 2013, 02:38:38 pm

Title: zimbio theme
Post by: allvip on October 17, 2013, 02:38:38 pm
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 (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 (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 (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 (http://forum.coppermine-gallery.net/index.php?topic=76163.0)
Title: Re: zimbio theme
Post by: allvip on October 17, 2013, 02:40:54 pm
DEMO 1,2,3,4 - Image previews (screenshoots)

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

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

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

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

Title: Re: zimbio theme
Post by: Niecher on October 17, 2013, 02:53:14 pm
Hello Allvip,

I like it, great job.

Regards.
Title: Re: zimbio theme
Post by: allvip on October 17, 2013, 02:54:23 pm
thanks.
Title: Re: zimbio theme
Post by: allvip on October 18, 2013, 12:03:39 pm

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.


Title: Re: zimbio theme
Post by: allvip on October 18, 2013, 12:21:26 pm
1.I use bbcode in the Category description to have more description for categories and big images.

Title: Re: zimbio theme
Post by: allvip on October 18, 2013, 12:24:31 pm


1.bbcode Category description:

Code: [Select]
[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]
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]
Title: Re: zimbio theme
Post by: allvip on October 18, 2013, 02:15:06 pm
use  Picture navigation plugin for left right arrows for the image

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

open picture navigation plugin folder - open picture_navigation.js:

replace:

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

with:

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

replace:

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

with:

Code: [Select]
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.
Title: Re: zimbio theme
Post by: allvip on October 18, 2013, 03:12:23 pm
if you use Category thumbnail not bbcode to display images for gategory add:

Code: [Select]
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]
https://svn.code.sf.net/p/coppermine/code/trunk/cpg1.5.x/themes/curve/template.html $
Title: Re: zimbio theme
Post by: allvip on October 18, 2013, 03:38:56 pm
DOWNLOD