Results 1 to 4 of 4

Thread: can I have 2 photo albums independently on same page

  1. #1
    Join Date
    Jul 2011
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default can I have 2 photo albums independently on same page

    1) Script Title: PHP Photo Album script v2.11

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...photoalbum.htm

    3) Describe problem:
    Not a problem, a question: I have this thing working, but I was wondering if I could have more of this independently on the right side of the page: http://www.vytasornamental.net/vceiling.htm you can see a space on right side I would like to fill also with a row of thumbs and a little bit smaller 150pixel wide that would work just like the ones on the left. is that possible and if so, how?

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Sure, the same images or different ones?

    If it's the same images, you just make a copy of:

    Code:
    <div id="second_album">
    <script type="text/javascript">
    
    new phpimagealbum({
    	albumvar: ceilingdesigns, //ID of photo album to display (based on getpics.php?id=xxx)
    	dimensions: [1,6],
    	sortby: ["file", "asc"], //["file" or "date", "asc" or "desc"]
    	autodesc: " ", //Auto add a description beneath each picture? (use keyword %i for image position, %d for image date)
    	showsourceorder: false, //Show source order of each picture? (helpful during set up stage)
    	onphotoclick:function(thumbref, thumbindex, thumbfilename){
    		 thumbnailviewer.loadimage("http://www.vytasornamental.net/images/large/" + thumbfilename, "fit2screen")
    
    	}
    })
    
    </script>
    </div>
    Place it where you want it to show up. Put it in a container division with a unique id as highlighted above then use an additional child selector in ddphpalbum.css to change the size of its thumbnails:

    Code:
    #second_album .photodiv img{ /*CSS for each image tag*/
    width: 100px;
    }
    If you want different images put a getalbumpics.php file in the folder with those images. Make another:

    Code:
    <script type="text/javascript" src="http://www.vytasornamental.net/images/ceiling2/getalbumpics.php?id=ceilingdesigns2"></script>
    tag for example that points to it and use a different ?id= name. Use that in your second call to new phpimagealbum():

    Code:
    <script type="text/javascript">
    
    new phpimagealbum({
    	albumvar: ceilingdesigns2, //ID of photo album to display (based on getpics.php?id=xxx)
    	dimensions: [1,6],
    	sortby: ["file", "asc"], //["file" or "date", "asc" or "desc"]
    	autodesc: " ", //Auto add a description beneath each picture? (use keyword %i for image position, %d for image date)
    	showsourceorder: false, //Show source order of each picture? (helpful during set up stage)
    	onphotoclick:function(thumbref, thumbindex, thumbfilename){
    		 thumbnailviewer.loadimage("http://www.vytasornamental.net/images/large/" + thumbfilename, "fit2screen")
    
    	}
    })
    
    </script>
    If the thumbnail images are already the size you want, you can forget about the unique container and styles. But it can still be used to get a different look for anything inside the second album.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Jul 2011
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanx a lot! how about where it says on the bottom in yellow background "page1" is there a way to remove that notification "page1"?

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    In the ddphpalbum.css file add the highlighted:

    Code:
    /* ######### CSS for PHP Photo Album itself ######### */
    
    .photodiv{ /*CSS for DIV containing each image*/
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
    }
    
    .photodiv img{ /*CSS for each image tag*/
    border: 0;
    width: 200px;
    height: 106px;
    cursor: hand;
    cursor: pointer;
    }
    
    .albumnavlinks{ /*CSS for DIV containing the navigational links*/
    display: none;
    }
    
    .albumnavlinks a{ /*CSS for each navigational link*/
    margin-right: 5px;
    padding: 1px 5px;
    border: 1px solid #9aafe5;
    text-decoration: none; 
    color: #2e6ab1;
    font-weight: bold;
    }
    That will get rid of it for all albums on a page. Or if you just want to get rid of it for one of the albums use instead:

    Code:
    #phpphotoalbum2_paginate {
    display: none;
    }
    See the red 2? That's for the second album. For the first it would be a 1.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •