WordPress.org

1. Kai2810
   Member
   Posted 3 years ago #

   Hi guys,

   Have anyone tried implementing Nextgen Gallery slideshow for the header background image?

   I tried that...it didn't work...saying that it can't find the file.

   This the original CSS line

   #topbanner { height: 200px; border-bottom: 1px solid #999; background: url(images/bg/home_banner.png) no-repeat; }

   I tried changing it to this:

   #topbanner { height: 200px; border-bottom: 1px solid #999; background: url(http://www.mysite.com/wp-content/plugins/nextgen-gallery/nggshow.php) no-repeat; }

   The above line didn't work...

   I'm using the nggshow.php...thought that is the correct php file to point to.

   Any ideas?

2. Travel-Junkie
   Member
   Posted 3 years ago #

   well, the slideshow is basically flash, so you would need to include the php call to that function
   <?php echo nggShowSlideshow(galleryID,width,height) ?>

   ../nggshow.php on it's own won't accomplish anything cause the parameter to the image is missing, something like
   ?pid=2&width=250&height=150

3. Kai2810
   Member
   Posted 3 years ago #

   Thanks!!

   Works like a charm...

   But every page of my site has sort of a page title that sits on top of the header image and now it gets covered up by the slideshow.

   Here's the header code at the start of home.php
   

   <?php get_header(); ?>
   <div id="topbanner" class="column span-14"> <!-- start top banner -->
   <?php echo nggShowSlideshow(gallery1,965,200) ?>
   <div class="pagetitle">
   // home
   </div>
   </div> <!-- end top banner -->

   I tried placing the php code after
   <div class="pagetitle">
   and after
   

   // home
   </div>

   with the latter pushing the header below the page title.

   Here's the css for that header area.

   /* Top banner with rotating images
   -------------------------------------------------------------- */
   
   #topbanner { height: 200px; border-bottom: 1px solid #999; }
   #topbanner_arch { height: 70px; border-bottom: 1px solid #999; background: url(images/bg/archive_banner.png) no-repeat; }
   #topbanner_single { height: 70px; border-bottom: 1px solid #999; background: url(images/bg/single_banner.png) no-repeat; }
   #topbanner .pagetitle, #topbanner_arch .pagetitle, #topbanner_single .pagetitle { float: left; background: #fff; color: #000; font: 700 2em arial, sans-serif; text-transform: lowercase; letter-spacing: -0.036em; padding: 1px 5px 1px 0; margin: 20px 0 0 0; }

   any advice?

4. Kai2810
   Member
   Posted 3 years ago #

   Just tried using z-layers...didn't work too...

   <div id="topbanner" class="column span-14" style="z-index:1;">   <!-- start top banner -->
   <?php echo nggShowSlideshow(gallery1,960,200) ?>
   <div class="pagetitle" style="z-index:2;">
                   // home
               </div>
           </div>   <!-- end top banner -->

5. Kai2810
   Member
   Posted 3 years ago #

   help anyone?

Topic Closed

This topic has been closed to new replies.