prod info

[mex]

Hi

How do you add css to the product info page?
What about javascript can that be added ( I forgot I reason why you would )?
The add to cart button how do you move that?

[gjh42]

You don't exactly add CSS to the product info page. You find tags (IDs, classes, img or a links...) in the code for the page, and change or add declarations in your stylesheet.css to affect them. It is possible to add new tags to the code if there is none available to work on.
Javascript can be added. Look at some of the existing examples to guide you.

Admin > Catalog > Product Types > Product-General > edit layout and most elements can be moved. It is also possible to move many elements using CSS.

[mex]

For example how do i get the tags for combo boxes or the cart buttons in the prod info page. From there I can change in a style sheet?

[mex]

Ok If i set a background color to a prod info page, I set a <div> at top and bottom on information in product information page. I set the color easy enough but it ony appears in the description and not the whole prod content page.
I am still lokking butI want the whole prod info page to look as a 1 block of background color.

[gjh42]

Try a view source on your page. You will see
<div class="centerColumn" id="productGeneral">
above the product info section. That class or ID would be a place to hang styling in your stylesheet.

I suggest you get the Firefox browser and its Web Developer extension. That will allow you to see and manipulate many aspects of your site. Try the Outline > Outline current element button, or Information > Display element information. CSS > Edit CSS will allow you to see effects of stylesheet edits instantly.

[mex]

I thought you just edit the stylesheet.css in your customs folder?

I know what you are saying as I am setting the style for every prod info page, as I modify that page with the id under where the page starts.

That file when I page source isn't a single file is it , as it is pulled from a collection of files.

[jettrue]

I thought you just edit the stylesheet.css in your customs folder?

I know what you are saying as I am setting the style for every prod info page, as I modify that page with the id under where the page starts.

That file when I page source isn't a single file is it , as it is pulled from a collection of files.

No, you do not need to set the style for every product info page. You actually could not do that.

Right click on your page, and choose "view source". This section:
<div class="centerColumn" id="productGeneral

will be in the "view source" for every product page. This is the css tag that you would edit in the stylesheet, that would give you a background color for every product page.

You can open up your stylesheet.css and add something like this
#productGeneral {
background-color:#333333;
}

[mex]

Ok that works thanks. I soent 30 mins on firefox firebug where the CSS file works and can be edited with changes then suddenly fails to load css code on firebug....your way is good.

The background color is changed on every prod info page now, can you add stylesheets to specific prod information?

There are a few combo boxes i want moved which from the source file has it id='atrrib-4', so do I just add the id to the style sheet and change location for it there? (it looks like it is nested in a dozen other tags).

I wouldn't add javascript to the style sheet and still not sure about that yet.

[jettrue]

can you add stylesheets to specific prod information?

Yes, there is a way, here is a little bit on it, but you may want do a search on "product specific stylesheet" or "Page specific stylesheet"
http://www.zen-cart.com/forum/showpo...3&postcount=15

There are a few combo boxes i want moved which from the source file has it id='atrrib-4', so do I just add the id to the style sheet and change location for it there? (it looks like it is nested in a dozen other tags).

May be silly of me to ask, but what are combo boxes? Can you be more specific? I don't know what you're speaking of.

I wouldn't add javascript to the style sheet and still not sure about that yet.

No. javascript goes in your includes/templates/YOUR_TEMPLATE/jscript/ folder. What do you need extra jscript for?

[mex]

Hi,

combo boxes are option boxes and are drop down boxes where you click on them and other option values drop down appear in . eg in default install graphic cards the prod items have these at bottom of the page . They are defined in option name and values in admin.
On the page view source i get the id of them so i take it i can change them from
stylesheet.css

I need javascript for a drop down menu (suckerfish type).


So all i need is the id from the page source, goto stylesheet.css to edit css from anywhere.