 Groups: ProSeller
Joined: 3/31/2008 Posts: 552
|
I love the idea of having control over what your store looks like. My problem is I have no clue what to do with CSS. I know a lil HTML and can usually tweak my store layout to fit my needs but have no idea how to start one from scratch Think I'll wait on mine till I know what Im doing
|
|
 Groups: Member
Joined: 6/11/2008 Posts: 634
|
Changing the background is a pretty straight forward process.
I would like information (coding) on how to change (add image) to the sidepod - involving a top image, background column image and a bottom image.
|
|
Groups:
Joined: 1/13/2009 Posts: 851
|
For a footer, you could use this CSS: Code:#myfooter { width:900px; height:100px; margin-left: auto; margin-right:auto; background-image: url(yourimageurlhere); }
Then up in the layout section, put: Code:<div id="myfooter"></div> right AFTER the line that says Obviously change the height to whatever you need, but it should be 900px wide. You can do the same thing for a header, and that would go in the layout section ABOVE the line that starts: Code:<div id="main" class="clearfix">
|
|
 Groups: Member
Joined: 6/11/2008 Posts: 634
|
ThreadPuppy wrote:For a footer, you could use this CSS:
[code]#myfooter { width:900px; height:100px; margin-left: auto; margin-right:auto; background-image: url(yourimageurlhere); Hey thanks ThreadPuppy.
There is a way to customize just the pod elements themselves as in the http://www.zazzle.com/retropolis_travel example given on the Zazzle Blog.
|
|
Groups:
Joined: 1/13/2009 Posts: 851
|
That sidepod is a little too involved to explain with just a quick bit of code. I wouldn't recommend trying that unless you know what you're doing.
|
|
 Groups: Member
Joined: 6/11/2008 Posts: 634
|
I couldn't have designed an ecommerce website without getting involved - I'm not afraid of involved.
|
|
Groups:
Joined: 1/13/2009 Posts: 851
|
It's too involved for me to give some quick bit of code to copy and paste. It's certainly not too involved to accomplish. The menu sidepod is id="group_1" class="sidePod". You would have to set a background for that in the CSS section. If you want an image above the menu it would go above the navpane placeholder. An image below the menu would go below the navpane placeholder.
|
|
 Groups:
Joined: 6/9/2008 Posts: 222
|
Big fat thank you. Thank You.
|
|
 Groups: ProSeller
Joined: 5/3/2009 Posts: 101
|
ThreadPuppy wrote:It's too involved for me to give some quick bit of code to copy and paste. It's certainly not too involved to accomplish. The menu sidepod is id="group_1" class="sidePod". You would have to set a background for that in the CSS section. If you want an image above the menu it would go above the navpane placeholder. An image below the menu would go below the navpane placeholder.
It's even a little more complicated than that. I had to create a div of my own to change the width of the module content - just making it slightly narrower - and then reset it before the navpanel finished itself off. You can change the order of the modules in the sidebar (which I did) but you can't affect the content of the modules, and I don't think you can insert anything new between them. Though I'm not as smart as I look. You can change the appearance of the horizontal bar that's used in the sidebar, but this will also affect (at least) the horizontal bar in comments sections. Something that looks great in the sidebar make look silly elsewhere. Also, another thing I did was to make this version of the sidebar appear on every page. By default, pages like your Fan Club and About page get a shorter version of the sidebar. That's possible by putting a single version of the sidebar in every template in the "Layout" box.
|
|
 Groups: Member
Joined: 1/15/2009 Posts: 151
|
This is GREAT thanks a lot, I will have to have a play (but backup my code first)
|
|
 Groups: Member
Joined: 6/11/2008 Posts: 634
|
Quote:It's even a little more complicated than that. I had to create a div of my own to change the width of the module content - just making it slightly narrower - and then reset it before the navpanel finished itself off... WOW - your gallery is so pretty.BlockQuote Products Resume KitSPLAT BlacKin the Public DomainImages Magical on Zazzle
|
|
 Groups: Member
Joined: 4/23/2009 Posts: 76
|
ThreadPuppy wrote:For a footer, you could use this CSS: Code:#myfooter { width:900px; height:100px; margin-left: auto; margin-right:auto; background-image: url(yourimageurlhere); }
ThreadPuppy, can you give me an idea where to place this lil gem of a code? I've tried to place it everywhere I thought it might go but I cant get it to work for me. So frustrating. Im...Plug...Plug...Plugin' along.
|
|
Groups:
Joined: 1/13/2009 Posts: 851
|
MilitaryDesigns wrote:ThreadPuppy wrote:For a footer, you could use this CSS: Code:#myfooter { width:900px; height:100px; margin-left: auto; margin-right:auto; background-image: url(yourimageurlhere); }
ThreadPuppy, can you give me an idea where to place this lil gem of a code? I've tried to place it everywhere I thought it might go but I cant get it to work for me. So frustrating. Im...Plug...Plug...Plugin' along. That part would go in the CSS section with the other CSS definitions. Then, to call it, in the layout section you would add <div id="myfooter"></div> in the layout section after <!--end main -->
|
|
 Groups: Member
Joined: 4/23/2009 Posts: 76
|
ThreadPuppy wrote:MilitaryDesigns wrote:ThreadPuppy wrote:For a footer, you could use this CSS: Code:#myfooter { width:900px; height:100px; margin-left: auto; margin-right:auto; background-image: url(yourimageurlhere); }
ThreadPuppy, can you give me an idea where to place this lil gem of a code? I've tried to place it everywhere I thought it might go but I cant get it to work for me. So frustrating. Im...Plug...Plug...Plugin' along. That part would go in the CSS section with the other CSS definitions. Then, to call it, in the layout section you would add <div id="myfooter"></div> in the layout section after <!--end main --> Thank you but I still have no idea where exactly to place the top code in my CSS section. I keep getting an error msg when I place it where I think it should go. Now the key word is..."Where I think it should go"
|
|
 Groups: Member
Joined: 4/23/2009 Posts: 13
|
I hope this is the right place to ask a general newbie-type question. How is this ability to customize one's store different from the Zazzle store builder? Is it along the lines of the ZSB being a template while this is coding from scratch?
I'm trying to get a general idea so I can figure out which way to proceed; if it's better for me to start with the ZSB or with this. I mean, I'm going to have to learn CSS anyway, and I will probably want a very customized store as the end result.
(Just thinking out loud. There's been a lot of THAT the last couple of weeks.)
|
|
 Groups: ProSeller, Zazzle Employee
Joined: 5/29/2006 Posts: 226 Location: San Jose
|
Zazzle Store Builder allows you to build a website outside of Zazzle.com (for example, if you own your own domain, you can build a site that showcases your Zazzle products using Store Builder). Advanced Store Customization, on the other hand, is a tool to let you customize the store that's hosted on Zazzle.com (the term "store" is new. It used to be "gallery"). Using both tools, you can create a more seamless experience by making your outside website look just like your Zazzle hosted store. Hope this helps!
|
|
 Groups: Member
Joined: 2/5/2009 Posts: 416 Location: Lake Norman Area
|
I finally toyed with this tonight, and thought of keeping things the way they ended up, but now want to make changes... Can anyone explain to me how to give the storefront products (the boxes) a transparent background? While I was playing around I managed to get everything else transparent, but the white behind the products wouldn't go away, so I took the transparency off the other stuff. If this should have been asked elsewhere, please move it to the correct place. Thanks!
|
|
 Groups: Member
Joined: 4/23/2009 Posts: 13
|
ecaggiani wrote:Zazzle Store Builder allows you to build a website outside of Zazzle.com (for example, if you own your own domain, you can build a site that showcases your Zazzle products using Store Builder). Advanced Store Customization, on the other hand, is a tool to let you customize the store that's hosted on Zazzle.com (the term "store" is new. It used to be "gallery"). Using both tools, you can create a more seamless experience by making your outside website look just like your Zazzle hosted store. Hope this helps! Or, for me, make my Zazzle store look like my site. But, yes that does help, thank you! (And I feel kind of duh now, like I shoulda known that, but, I am new here.)
|
|
 Groups: Member
Joined: 2/5/2009 Posts: 416 Location: Lake Norman Area
|
ecaggiani wrote:Zazzle Store Builder allows you to build a website outside of Zazzle.com (for example, if you own your own domain, you can build a site that showcases your Zazzle products using Store Builder). Advanced Store Customization, on the other hand, is a tool to let you customize the store that's hosted on Zazzle.com (the term "store" is new. It used to be "gallery"). Using both tools, you can create a more seamless experience by making your outside website look just like your Zazzle hosted store. Hope this helps! I'd like to make at least one of my stores look like my offsite, but I seem to be doing it wrong. Could someone walk me through it (using layman terms, please) or post a step by step tutorial here in the forums to show how it is done. I can't pay anyone to do my store(s), plus I like doing things myself... I just think I am missing something here and, with my luck, it is probably the simplest of all things! lol
|
|
 Groups: Member
Joined: 7/24/2009 Posts: 6
|
This should be fun. I have seen some creative sites on Zazzle.
|
|
|
Guest |