Member
Member
halinab   14-08-2010, 23:10
#1

I've managed to integrate zenphoto with a wordpress theme but would like to get the slideshow component working.... the procedure sais to include printSlideShowJS in the head but how do i do that with an integerated wordpress theme...have attempted a few things but its not working correctly..
blog.halinasplace.net.au/blog

Administrator
Administrator
acrylian   15-08-2010, 08:23
#2

Note that the instruction for that is meant for Zenphoto themes. I never tried or even know if that would work within a Wordpress theme at all.

You will have to call the Zenphoto template functions and the slideshow plugin functions. But since the "Zenphoto as a plugin" way described on our site does not work wiht current Wordpress versions you might be out of luck.

In short you have to figure it out yourself, sorry.

Member
Member
halinab   15-08-2010, 08:25
#3

I've given up on trying to get slideshow to work but have copied zpgallerific colorbox use of the slideshow and have managed to get most of it working but the css components...some help to get the tumbnails going accross the top and the slideshow
down the bottom would be appreciated.... also the comments have not worked since putting the js in the header of wp code

this is the code

`

[*]

                        /images/video-placeholder.jpg" title="">

                        " title="">







                                " title="">
                                " title=" ">

`
and this is the css

`
ul.thumbs,#image-stat ul {clear: both;margin: 0;padding: 0;}
ul.thumbs li,#image-stat li{float: left;padding: 0;margin: 5px 10px 5px 0;list-style: none;}
ul#no-gal-ul,#image-stat ul{margin:0 auto 20px auto;text-align:center;width:820px;}
ul.thumbs li.no-gal-li{}
a.thumb,#image-stat a {padding: 2px;display: block;border: 1px solid #4a4a4a;}
ul.thumbs li.selected a.thumb {background: #fff;}
a.thumb:focus,#image-stat a:focus {outline: none;}
a.thumb:hover,#image-stat a:hover {border: 1px solid #ccc;}
ul.thumbs img,#image-stat img {border: none;display: block;}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {border-color: #4a4a4a;
-moz-border-radius:3px;-khtml-border-radius:3px;-webkit-border-radius:3px;}
div.pagination {clear: both;}
div.navigation div.top {margin-bottom: 12px;height: 11px;}
div.navigation div.bottom {padding-top:5px;}
div.navigation a.prev {}
div.navigation a.next {}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {display: block;float: left;margin-right: 2px;padding: 2px 7px 2px 7px;border: 1px solid;}
div.pagination a:hover {text-decoration: none;background-color: #000;border-color:#ccc;}
div.pagination span.current {font-weight: bold;background-color: #fff;border-color: #fff;color: #222;}
div.pagination span.ellipsis {border: none;padding: 5px 0 3px 2px;}

div.caption {position:relative;top:0;left:0;height:25px;width: 50px;}
div.caption-container {position:relative;height:25px;width: 50px;}
`

Administrator
Administrator
fretzl   15-08-2010, 08:59
#4

Looks like the slideshow itself is working just fine.
You'll need to make some adjustments in your layout and/or CSS to keep it from moving up and down.

Member
Member
halinab   15-08-2010, 09:09
#5

i copied the code from zpgallerific, i'm not strong on css which parts do i need to look at to fix the layout...i've fiddled with some parts so far...

`

[*]

                        /images/video-placeholder.jpg" title="">

                        " title="">







                                " title="">
                                " title=" ">

`
and this is the css

`
ul.thumbs,#image-stat ul {clear: both;margin: 0;padding: 0;}
ul.thumbs li,#image-stat li{float: left;padding: 0;margin: 5px 10px 5px 0;list-style: none;}
ul#no-gal-ul,#image-stat ul{margin:0 auto 20px auto;text-align:center;width:820px;}
ul.thumbs li.no-gal-li{}
a.thumb,#image-stat a {padding: 2px;display: block;border: 1px solid #4a4a4a;}
ul.thumbs li.selected a.thumb {background: #fff;}
a.thumb:focus,#image-stat a:focus {outline: none;}
a.thumb:hover,#image-stat a:hover {border: 1px solid #ccc;}
ul.thumbs img,#image-stat img {border: none;display: block;}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {border-color: #4a4a4a;
-moz-border-radius:3px;-khtml-border-radius:3px;-webkit-border-radius:3px;}
div.pagination {clear: both;}
div.navigation div.top {margin-bottom: 12px;height: 11px;}
div.navigation div.bottom {padding-top:5px;}
div.navigation a.prev {}
div.navigation a.next {}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {display: block;float: left;margin-right: 2px;padding: 2px 7px 2px 7px;border: 1px solid;}
div.pagination a:hover {text-decoration: none;background-color: #000;border-color:#ccc;}
div.pagination span.current {font-weight: bold;background-color: #fff;border-color: #fff;color: #222;}
div.pagination span.ellipsis {border: none;padding: 5px 0 3px 2px;}

div.caption {position:relative;top:0;left:0;height:25px;width: 50px;}
div.caption-container {position:relative;height:25px;width: 50px;}
`

Administrator
Administrator
fretzl   15-08-2010, 10:19
#6

Like acrylian said [i]you have to figure that out yourself[/i], sorry.
And yes, it will require some learning ;-)

Member
Member
halinab   16-08-2010, 08:29
#7

took some time to go through the css - but after i included all the js in the header of wordpress that zpgallerific used and then copied the code and the relevent css bits i got it going...still probably needs some tweeking but its pretty much there

  
Powered By MyBB, © 2002-2026 MyBB Group.
Made with by Curves UI.