We've seen lots of helpful tips lately, and I thought it would be nice to have one place with those tricks many of us know from inventing and reinventing the wheel.

So, let's use this as a repository. If you have or have seen a useful trick, please post it here. You can do so by asking the person to post it here themselves or copy it here. Please do your best to provide credit where credit is due, but keep in mind that many tips were creations of many iterations as people added on their ideas.

So, here we go. The idea is that we can scan this thread and find something that helps us make better use of our time.

This thread is more about process than general "tips" like "make sure you fill out descriptions". That kind of tip is perfect for Diane's Learning Checklist

This thread is for the things like "To easily add new designs, create a hidden section as a template. Put 'test' images on each product in the right position, ....." and such.

I reserve the right to edit or consolidate if ideas get spread out.

Here we go.

I'll post one of my favorites.

Let's say I'm going to edit multiple products in a section individually such as image resizing.

Bad way: open the section, click the product to edit, go through the process, save, it takes you back to the section, find the next product to edit, repeat.

Better way:
Go to the section in my account. Let's call this the "original" section page.

Scroll down to the product I want to edit. Right-click and open that product page in a new window or new tab.

Do the edits and save like usual. When this tab/window reloads the section of products, close it and return to your "original" section page.

Now you can scroll to your next product to edit and repeat.

Expert trick: when you get real good at this, you can hit "Save" on the product and while it's doing the work and starting to reload the section page in that tab/window, go back to the "original" section and open your next one. By this time, the product you were editing should be done and you can close that tab/window.

What this saves is the reloading of a hundred or so thumbnails and trying to find where you last edited after the page reloads.

If you don't need to see your images for these edits, turning off images when working on your shop makes it even faster. You can just right-click to "Show Picture" (in IE) if you want to see a specific image.

quote:

Expert trick: when you get real good at this, you can hit "Save" on the product and while it's doing the work and starting to reload the section page in that tab/window, go back to the "original" section and open your next one. By this time, the product you were editing should be done and you can close that tab/window.

You actually don't even have to hit save and let the product page reload completely, I've found. It's enough to change the size with the dropdown, and once just the photo of the product reloads with the correct size, you can close the window/tab. At least, this works on Firefox, Flock and Chrome in WinXP and Firefox on Mac. (Those are all I've used, so there may be more!)

CP knows you changed it (as the server is alerted when you change the size, so the preview can change), so it's a done deal as soon as that happens. No need to save, just close the window/tab and move on.

At least, it works for me! Saves a lot of time/tabs too.

One I have just found, when I am working and need to upload pictures (either different sizes or simply need to upload some new designs), I will work in my favorite browser and upload in another one.

Since it's kind of risky working on the same computer, I only upload on the other browser, I do not attempt to work on both at the same time.

Another tip (since I seem to have killed Teesed's thread )

If you have time-sensitive material (current events, last minute holiday design, etc.) it *seems* that designs in sections created via the copy tool take a bit longer to hit the Marketplace. Therefore, for those designs, I use the import feature rather than copy.

I have personally tested some designs during the election with designs uploaded and set up the same day, one with copy and one with import. The designs I imported showed up within hours while the designs I imported took about a day or two.

Using your "Section Descriptions" as an html page (from this discussion)

If you would like to have just a page on your premium shop with something other than products, just create a new section, then put just about anything you want in the "Section Description".

This can be useful for putting in affiliate banners, a newsletter signup, a "blog" of sorts, a helpful article about your niche that attracts visitors and search engines, etc!

Organizing your image basket

OK, this is for more than premium shops, but hey...

There are several ways to organize your image basket. The important thing is that you DO organize it from the beginning - or now, whichever comes first.

I got a tip to organize mine into folders by shop name, then section number.

So, I have a folder called "Teesed: Humor" and one called "Teesed: Holidays". If I decide to further break those down, I could have "Teesed: Holidays: Christmas", etc. This makes it very easy to find my images since I usually know what section it's in and in which store.

I also have a "_ to be done" folder where I upload designs I have done, but don't have the time to put them onto products yet. Then I have an easy way to know what I still have to do. When I put them on something, I move them to the appropriate folder. The reason there's a "_" at the beginning of that folder name is to make it first in the alphabetical list.

If you have another way to organize, post below and I'll move them into this post with credit.

My folder system looks something like this:

01-Shopid-Topic-Subtopic

Like:

01-Pfoinkle-Holiday-Christmas
01-Pfoinkle-Holiday-NewYears
01-Pfoinkle-Sports-Baseball
02-BabyShop-Girls-PrettyInPink
02-BabyShop-Girls-Tomboys

When I'm working quite a bit on a particular section, I will rename the folder to start with "00" -- which bumps it to the top of the list for easy access.

Create a section template based on the image size you're most likely to use and all the products that take that image size (e.g. 12 inch by 12 inch)

Import this into other sections, then delete all the male, female or children's items so that you've now got three new templates: one for men, one for women, one for children

Make backups of these (again by importing into new sections) and label them as backup sections. Rearrange your sections so that these are at the bottom of all your sections. It would be SOO easy to delete or badly damage one of your section templates.

The following will add a neat box at the top of your page saying Warning! You need cookies enabled for this shopping cart to work! Click here for instructions! (if your users don't have cookies turned on - if they do have cookies turned on, nothing appears)

Add this code towards the top of your header.

Change the width as required. Margin-left:auto and margin-right:auto don't seem to work in IE so play around with the numbers.

If you turn cookies off in your browser and go to my signature you should see it working.

 

<!--  COOKIE TESTER AND WARNING FOR CART 
This file retrieved from the JS-Examples archives
http://www.js-examples.com
1000s of free ready to use scripts, tutorials, forums.
Author: JS-Examples - http://www.js-examples.com/
-->
<script type=text/javascript>
// cookie construct

function Cookie(document,name,hours,path,domain,secure) {
  // any VAR in "this" that does not start with a "$" will
  // be written into the cookie (read from also)
  this.$doc  = document
  this.$name = name
  if (hours)  this.$expiration=new Date((new Date()).getTime()+hours*3600000); else this.$expiration = null
  if (path)   this.$path   = path;                                             else this.$path       = null
  if (domain) this.$domain = domain;                                           else this.$domain     = null
  if (secure) this.$secure = true;                                             else this.$secure     = false
}

function CookieWrite() {
  var cookieval=""
  for(var prop in this) {
    if ((prop.charAt(0) == '$') || ((typeof this[prop]) == 'function') || prop == '') continue
	if (cookieval != "") cookieval += '&'
	cookieval+=prop+":"+escape(this[prop])
  }
  var cookie=this.$name+"="+cookieval
  if (this.$expiration) cookie+='; expires=' + this.$expiration.toGMTString()
  if (this.$path)       cookie+='; path='    + this.$path
  if (this.$domain)     cookie+='; domain='  + this.$domain
  if (this.$secure)     cookie+='; secure'
  this.$doc.cookie=cookie
}

function CookieRead() {
  var allcookies=this.$doc.cookie
  if (allcookies=="") {
    return false
  }
  var start= allcookies.indexOf(this.$name+'=')
  if (start== -1) {
    return false
  }
  start += this.$name.length+1
  var end=allcookies.indexOf(';',start)
  if (end == -1) end=allcookies.length
  var cookieval = allcookies.substring(start,end)
  var a = cookieval.split('&')
  for (var i=0;i < a.length;i++) a[i]=a[i].split(':')
  for (var i=0;i < a.length;i++) this[a[i][0]]=unescape(a[i][1])
  return true
}

function CookieDelete() {
  var cookie = this.$name+'='
  if (this.$path)   cookie+='; path='+this.$path
  if (this.$domain) cookie+='; domain='+this.$domain
  cookie+='; expires=Fri, 02-Jan-1970 00:00:00 GMT'  // MAKE IT EXPIRE!
  this.$doc.cookie=cookie
}

new Cookie()
Cookie.prototype.write = CookieWrite
Cookie.prototype.del   = CookieDelete
Cookie.prototype.read  = CookieRead

// end cookie construct

var myCookie = new Cookie(document,"myName",240)
myCookie.test="test";
myCookie.write();
if (!myCookie.read() || myCookie.test!="test")
    document.write("<h5 style=\"border:1px solid red;font-size:14px;width:900px;margin-left:20px;text-align:center;\">
Warning! You need cookies enabled for this shopping cart to work!
Click <a href=\"http://www.google.com/cookies.html\" style=\"font-size:14px;\">here</a> for instructions </h5>");
else
    document.write("");
</script> <!-- Note that margin-left:auto;margin-right:auto; doesn't seem to work in IE-->

 

This message has been edited. Last edited by: SunshineAndBeaches,

Don't want to seem to be taking over this thread, but since no one else is contributing right now ...


The following code will alter the CP top bar, making the text (but not the logo background) transparent and allowing you to alter the width. It would be nice if the logo backgound could be made transparent, but I've emailed the CP team and for some reason I've been told it won't be happening. A shame, as it would make the top bar look much more professional.

The logo background is currently white, as can be seen by giving the containing cell a red background.

Put the following code in the head section (where all your CSS styles are)

 <style type="text/css"><!--

.cafepressbar, .cafepressbar td, .cafepressbar td table, .cafepressbar td table td
{
border: 0px none !important;
background: #ffffff !important;
}

//--></style>

Put the following in the header section

  <script language="JavaScript" type="text/javascript">document.body.getElementsByTagName("table")[0].className="
cafepressbar";
</script>

This uses javascript (so doesn't work if javascript is turned off - you just get the standard white bar). It 'fools' the browser into thinking that the very first table has a class of cafepressbar.

The original code was found here:
http://www.cafepress.com/hecticstudios/517052#topbar

To take this further, you can move the CP logo to the right of the page, so that it doesn't sit bang above your own logo.

This works in IE7,Firefox 3.04 and IE 6 (according to the screenshot at http://ipinfo.info/netrenderer/index.php) which is essentially 90% plus of browsers.

In the head section, add this

  
<style type="text/css">
<!--

.cafepressbar {position:relative;width:600px;margin-left:auto !important;margin-right:auto !important;}

.cafepressbar, .cafepressbar td, .cafepressbar td table, .cafepressbar td table td
{
border: 0px none !important;
background:transparent !important;
}

.cafepressbar td td img {position:absolute !important;left:600px !important;top:0px !important;padding-left:200px;}

//-->
</style>

In the header section, as before add this:

<script language="JavaScript" type="text/javascript">document.body.getElementsByTagName("table")[0].className="
cafepressbar";
</script>  

I split the code to prevent the screen scrolling horizontally

I'll see if I can add my signature so that you can see what it does

Update: The top bar now contains ids that can be controlled via css. See here:

http://forums.cafepress.com/ev...=347107703#347107703

Does anyone know how can link back my store from any subsection to my own URL, I would not like to use my cafepress shop home.

Can someone help me?

I'm sorry but there are no instructions on the templates page on how to use the templates. I can edit html but am pretty unsure of how to use one of the templates and still wind up with category search on the left and pages listing all the products with a single design. Is everything totally manual once I go in that direction. Need a step by step
Thanks