Building a Dynamic P7 Image Gallery

Posted At : December 1, 2008 2:01 PM | Posted By : Tami
Related Categories: ColdFusion, HTML, Internet, snippets, Project Seven

Project Seven has great products for increasing the pinache and functionality of any website. Their Image Gallery creates a slideshow of images in a 'filmstrip' type of gallery. When HHWD created this for Aiken's Makin's website, it was instantly a huge hit.

Another client, with a CF8 website wanted the same functionality with their home tour. But it needed to be able to pull photos from two locations and build the image gallery on the fly.

Here is how to do this (after you first buy IG from P7):
1) In the page to build the Image Gallery, first create a 'dummy' image gallery, by allowing the code to set up a gallery using 2-3 images of your choice. This lets the P7 base code and CSS to be set up.
2) Update the code as follows. Since I needed to be able to display image, description, and alt tags, I first built an array of structures containing the image information to be displayed.

(first thing: before creating your image gallery and customizing it set a variable rowpernum = the number of tnails per row)

Heres the code

The idea is to determine the number of thumbnails per row, know the ending tnail for the current row (and if it is at the end of the array/recordset -- variable i) and know the actual tnail number you are on (-- variable j)

Comments (0) | Print | Send | del.icio.us | Digg It! | Linking Blogs | 982 Views

Coldfusion Support Help -- Ongoing support & Maintenance

Posted At : June 27, 2008 8:33 AM | Posted By : Tami
Related Categories: ColdFusion, HHWD, Internet, Databases, XP, Dreamweaver, Java/Jrun, snippets, Project Seven

HHWD is turning over the reins of a project to a new developer to provide onging development and support of a large international website project (entertainment based). The client has immediate needs and prefers a male developer, readily available for future project development.

If you are well versed in Coldfusion 8, CFIMAGE & CFCs Project Seven MySQL 5 SoThink DHTML menu Paypal Processing CSS based design

Please contact HHWD at 803-648-8556 or email us at hhd - at - honeyhousedesigns (you know the schpeal).

HHWD will assist in providing turnover of the project and provide the new developer with any technical questions regarding design and development.

The new developer will become the primary contact with the client and will NOT be in a sub-contract relationship. The pay is nice, the project in very interesting. It simply no longer fits our business model for projects.

Comments (0) | Print | Send | del.icio.us | Digg It! | Linking Blogs | 1096 Views

Creating a Dynamic Slide Show Using P7 & Coldfusion

Posted At : January 5, 2008 2:00 AM | Posted By : Tami
Related Categories: CSS, ColdFusion, Internet, browsers, Project Seven

Ever like the Project Seven Slide Show magic but want to use the functionality of Coldfusion to fill in the thumbnails and images? Well, ok... lets do it.

Open your page to place slide show in and create the basic slide show, filling in a default directory and selecting an image. This creates directories and code populates the default SSM code on your page.

Once this is created, you can go back in and edit it to fill images in from a query. Interestingly, you only need to update the

  • area with the query output to have the updates reflected both in the thumbnails and the larger images.

    With respect to P7's code, I won't be cutting/pasting the entire SMM code here, but will only show snippets of strategic locations for place your outputed query.

    Once the SMM code is built, find the p7ssm_thumb_section div. Looping through your query/array/list with

  • tag will update your thumbnails.


    <div class="p7ssm_thumb_section">
    <ul>
    <cfoutput query='foo'>
    <li><a href="#foophoto#"><img src="#foophoto#" alt='#fooname#'/></a></li>
    </cfoutput>
    </ul>
    <br class="p7ssm_clearThumbs" />
    </div>

    To update the starting image from the 'default' one you used when you set up SMM, go down a tad further in the code, and edit the p7ssm_fsimg div.


    <cfoutput>
    <div id="p7ssm_fsimg">
    <a id="p7ssm_fslink"><img id="p7ssm_im" name="p7ssm_im" src="#foo.foophoto#" /></a>
    </div>
    </cfoutput>

    See an example of this here: Click on a Dog to see SMM
    This is a site in development due to be rolled out to production soon. As such, the FireFox formatting is still wonky as the client site is validated against IE6 first, and is still being adjusted for more modern browsers.

    • Comments (0) | Print | Send | del.icio.us | Digg It! | Linking Blogs | 1145 Views
    BlogCFC was created by Raymond Camden. This blog is running version 5.9.1.002. Contact HHWD