Inkedpress.com - new custom eCommerce website launched today!

Built with a highly customized CartWeaver ColdFusion back end and a slick jQuery / javascript image selector routine, the Inked Press site allows the user to enter any word or phrase, and select from a gallery of images to represent each letter, building a custom "Picture Font" personalized photo frame.

This was a fun project from start to finish, and everybody involved is pleased with the outcome. The custom image selection routine for building the Picture Fonts was my first 'heavy' usage of jQuery... and it made the entire process such a pleasant experience, I am already hungry for another custom js site!

I just spent a few minutes tweaking the way the default Cartweaver categories search form works - it is fairly basic form javascript, but I think it might be useful to others...

This site is in progress - client has added (and named, sometimes a bit off-spelling) his products, and the CW functions are all up and working.
http://enchanted-light.com/Results.cfm?secondary=17

Rather than the standard secondary category functions, with this site we wanted a 'keyword' search function, much like the tags commonly assigned to blog posts. Most of his photos have multiple secondary categories assigned, so a picture of a river by a mountain for example, would show up under both rivers and mountains. you get the idea.

Cartweaver's search function allows for all sorts of configurations in the call for the search (see the default index.cfm page when you install CW... here is a sample - this is all the default search types plus a few custom ones I keep around... in this case we're working from the one labeled "All form defaults used"). I have the call to the search tag in place in my 'results' page, and have opted to turn off the text box search and the main category search, simply leaving the 'secondary' category search and a submit button with a value of "Go".

anyway... rather than requiring the viewer to select the option and click the submit button to run the search, I thought it would be slick if the select box auto-submitted the form when changed. So... in the cw tag that handles the search function, I simply added this to the <select> dropdown code

onchange="document.<cfoutput>#attributes.formid#</cfoutput>.submit()"

so the whole line for the select now looks like this:
 <select name="secondary" id="<cfoutput>#attributes.formid#</cfoutput>-secondary" onchange="document.<cfoutput>#attributes.formid#</cfoutput>.submit()">

(Note, I could have hand-coded the attributes.formID part since I am only using this once in the page, but this method is copying the ID given to the form by cartweaver through the FormID variable)

However... this alone does not work... because...
the default name for the submit button is - can you guess? - "submit", and , left to itself, my javascript code above makes the browser think its trying to do something with that button, rather than submit the form. So the easy fix - rename the submit button to "btnSubmit".

<input name="btnSubmit" type="submit" class="formButton" value="<cfoutput>#attributes.buttonlabel#</cfoutput>"> 

I could also have just removed (commented out) the submit button, since the dropdown now submits the form when changed, but if javascript is disabled, you need the button, so renaming it is the easy fix.

That's a long post for a short mod... hope it helps somebody some time.

A very nice CartWeaver user contacted me for some help with her product images - basically, she wanted to add more images per product (easier than ever in CW3) and, most importantly, she wanted a way to let her clients upload a single image, and have the thumbnails and other sizes made automatically.

I set up a demo version of the add-on, saving a copy of the modified CW code so I can use it again for my own clients. ( That link shows a default product page with a very basic multiple image javascript display... in theory, the finished product would be much nicer. A demo of the admin is here ( use admin/admin to log in)

I added an automatic uploader / image resizer, and set up her images table in the CartWeaver database to handle 5 images for each product, with 4 sizes for tiny preview, details thumbnail, large image, and zoom.

In the CartWeaver admin, she simply uploads a single image file for each photo slot, and the thumbnails are made on the server (instead of a separate upload slot for each image size). Otherwise, it works and looks exactly like the regular CartWeaver admin.

On the display side, the single results page composes the mouseover image swap display for 1 to 5 mages, whatever is available.

The way this code works, any number of images and any number of sizes for each can be used - and any type of gallery, lightbox, list or display of the images can be populated from the image query.

Updated spring 2008: Now using CFimage for super fast, high quality resizing on the fly with more accurate height/width scaling.

The resizer works with both tall and wide images, with a maximum width and height set in the database for each size of image.

Each image upload slot can have its own set of sizes and max w/h dimensions, so the possibilities are almost endless.

The CW site I was working on was on a CF7 server, so instead of using the onboard CFimage functions in CF8, I went with Massimo Foti's tmt_img.cfc  - so in theory it should work on any server, running any recent version of ColdFusion.

Contact me directly to log in and test the admin on that demo site, or if you are interested in using this code on your own CartWeaver (or other) sites.