Welcome to Minilist

Introducing Minilist, a new way to have small pictures of all products from the parent section shown under the current product:

You can see this in action at: Ukulele Shirt World .

Setting it up

As with most of my addons, Minilist uses unobtrusive javascript to pull a list of images from the parent section and display them. To install Minilist, you will need to add the following to your Base HTML:

The headtext variable is the text displayed above the images and can be set to anything you like. The newsize variable is the height and width of the images. The smaller the number the smaller the images.

Style It

Minilist is completely styleable using CSS as well, so you can have it fit in exactly with your store. Use the following in your Custom CSS:

One Final note

Minilist requires that your store has a breadcrumb in it. If you don't have a breadcrumb, you will need to add one to the base HTML using the ##breadcrumb## tag.

As part of my ongoing commitment to make Printfection the best place to be for store holders, I bring to you TeePlates Themer .

Themer is a completely visual Printfection theme customisation tool that allows you the store holder to select all of the aspects of your store's look and feel without needing to know any CSS or doing any coding.

Just point, click and select the colors, fonts, borders and backgrounds that you want, and once you are happy, download all the generated CSS that you need to have your store looking just right.

Watch an Introductory Video

Themer is designed to work with the "Sandbox" printfection theme, so all you need to do is select that theme and then paste the downloaded CSS into the custom CSS for your store.

Join the community

It's more than just a design tool though, it is in fact a community driven site that allows people to create, publish and share their created themes. With your support, Themer can become a very large repository of free Printfection themes.

Thankfully, someone has already created a great slideshow that I was able to tune up for Printfection use. Based on Malsup's Jquery Cycle plugin, the new improved slideshow is here. You can now choose from a wide range of transitions and can have as many slideshows on a page as you would like.

Here are some examples of the transitions available:

The implementation is slightly different to the previous model and does require you to choos some options, however I don't think anyone will find it too hard.

Code Block 1

Firstly, add the following HTML to your store's base HTML:

I will explain the various options further down, but first you will need to add the actual images to your base HTML. The following can be placed anywhere within your store that you like:

Code Block 2

You can use any images you like, shirts, banners, whatever. You should of course have each slide the sam size in pixels.

The final thing that you will want to do is add some CSS to keep everything nice and neat:

The height and width in this CSS should match your image / slide size.

Options

Within the source code above, you will see a number of configuration options, fx, speed, timeout, random, pause. These control the look of your slideshow and can be used in the following ways:

fx: 'option', - This can be any one of the following and will define the type of transition between slides:

• fade
• fadeZoom
• scrollUp
• scrollDown
• scrollLeft
• scrollRight
• scrollHorz
• scrollVert
• shuffle
• slideX
• slideY
• turnUp
• turnDown
• turnLeft
• turnRight
• zoom

speed: 1500, - This is the time it takes for one slide to turn into another in milliseconds. The larger the number the slower the transition.

timeout: 3000, - This is the time that each slide is visible before moving to the next in milliseconds.

pause: 1 - If set to 1 the slide show will pause when a user hovers the mouse over the slideshow. Set it to 0 to ignore the hover

Want multiple Slide Shows?

If you wish to have more than one slide show, all you need to do is add another lot of HTML from Code Block 2 above. Rename the ID in the second slideshow to be sshow2 or whatever you like and then add another configuration into code block 1 so that you end up with something like this:

You will also need to add some CSS for sshow2, that sets the height and width as well.

Image sets have now been added to your image basket so that you can logically group all of your images and manage them as groups. Casey has posted a brief FAQ that gives you more of an idea. Go into your Store management console and you will find it under My Images. Happy organising!!

A Favicon is one of the smallest images you will every create at only 16 x 16 pixels in size, yet if you get it right, it will be instantly recognisable. A favicon can be either a Gif image or and .ico file. There are plenty of tools out there to create such an image, however the one that I use is a simple, free webservice at http://www.favicon.cc . You can create an icon completely from scratch using their simple grid based tool, or you can upload a file to be sampled and converted. Either way, the control that you have over the final result is terrific.

To give you some inspiration or at least a head start, click on the yellow rubber ducky to see some of the favicons that I have created for you to use.

To get you chosen favicon onto your store, just add the following HTML: to your Base HTML in the store admin Custom HTML page