Questions regarding sales screen

ewold

I'm setting up my trial, and so far I'm liking everything except one thing. When you click "buy" on the photograph the product catalog shows portrait photographs for the "wall art" and "paper prints" which I'm sure is great for portrait photographers, but is a little weird for fine art photographers. Is there any way I can change that? It just seems like maybe it's ruining the experience when you're trying to sell gritty or stark landscape or wildlife art and the samples look like they are photos of their kids having fun.

bethwold.smugmug.com

Hikin' Mike

I use this on my site. Add this to your site-wide theme's CSS:

/**
* Cart Page
************************************************/	
.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-wall-art {
	background-image: url('YourWebsiteHere/wall-art.jpg');
	}
	.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-wall-art:hover {
		background-image: url('YourWebsiteHere/wall-art-hover.jpg');
		}

.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-paper-prints {
	background-image: url('YourWebsiteHere/paper-prints.jpg');
	}
	.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-paper-prints:hover {
		background-image: url('YourWebsiteHere/paper-prints-hover.jpg');
		}

.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-keepsakes {
	background-image: url('YourWebsiteHere/keepsakes.jpg');
	}
	.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-keepsakes:hover  {
		background-image: url('YourWebsiteHere/keepsakes-hover.jpg');
		}

.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-downloads {
	background-image: url('YourWebsiteHere/downloads.jpg');
	}	
	.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-downloads:hover  {
		background-image: url('YourWebsiteHere/downloads-hover.jpg');
		}

.sm-user-ui .sm-addtocart-step-categories .sm-addtocart-product-list p {
	font-size: 32px;
	line-height: 0;
	font-weight: 700;
	text-transform: uppercase;
	}

.sm-user-ui .sm-addtocart-step-categories .sm-addtocart-product-list li .sm-fonticon {
	font-size: 36px;
	line-height: 1.5;
	font-weight: 700;
	}
	
.sm-user-ui .sm-addtocart-step-categories .sm-addtocart-product-list p,
.sm-user-ui .sm-addtocart-step-categories .sm-addtocart-product-list li .sm-fonticon {
    bottom: 42px;
	}	

Just edit your 'background-image' url.

ewold

Hikin' Mike wrote: »

I use this on my site. Add this to your site-wide theme's CSS:

/**
* Cart Page
************************************************/	
.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-wall-art {
	background-image: url('YourWebsiteHere/wall-art.jpg');
	}
	.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-wall-art:hover {
		background-image: url('YourWebsiteHere/wall-art-hover.jpg');
		}

.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-paper-prints {
	background-image: url('YourWebsiteHere/paper-prints.jpg');
	}
	.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-paper-prints:hover {
		background-image: url('YourWebsiteHere/paper-prints-hover.jpg');
		}

.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-keepsakes {
	background-image: url('YourWebsiteHere/keepsakes.jpg');
	}
	.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-keepsakes:hover  {
		background-image: url('YourWebsiteHere/keepsakes-hover.jpg');
		}

.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-downloads {
	background-image: url('YourWebsiteHere/downloads.jpg');
	}	
	.sm-user-ui .sm-addtocart-step-categories .sm-catalog-category-downloads:hover  {
		background-image: url('YourWebsiteHere/downloads-hover.jpg');
		}

.sm-user-ui .sm-addtocart-step-categories .sm-addtocart-product-list p {
	font-size: 32px;
	line-height: 0;
	font-weight: 700;
	text-transform: uppercase;
	}

.sm-user-ui .sm-addtocart-step-categories .sm-addtocart-product-list li .sm-fonticon {
	font-size: 36px;
	line-height: 1.5;
	font-weight: 700;
	}
	
.sm-user-ui .sm-addtocart-step-categories .sm-addtocart-product-list p,
.sm-user-ui .sm-addtocart-step-categories .sm-addtocart-product-list li .sm-fonticon {
    bottom: 42px;
	}	

Just edit your 'background-image' url.

Thanks! I got it working for one, and will get the other soon. Do you know if you need to have the hover?

Also is there anyway to change the pictures that come up with "See More..." I think changing just the wall art and paper products will be enough to make me happy but I always seem to want to tweek more.

Hikin' Mike

ewold wrote: »

Thanks! I got it working for one, and will get the other soon. Do you know if you need to have the hover?

Also is there anyway to change the pictures that come up with "See More..." I think changing just the wall art and paper products will be enough to make me happy but I always seem to want to tweek more.

No, I just added it because that's what I use/do.

Hikin' Mike

For your second question, I only offer two "products", so I don't know.

ewold

Thanks so much for the reply. My wall art and paper art looks the way I want it to. You've definitely helped!