Product View Font and Size

[[email protected]]

Hi, I have default prestashop 1.5.x theme,

On product view page,

I want my short description shows in verdana font with 10pt size

and long description shows in verdana font with 12pt size,

I know I can change when I list the product, but I want this font and size default,

Can anyone help me,

See picture, what i want..

thanks

Alex

[Martin Uker K]

Hi,

 

This is basic CSS, I guess you aren't familiar with it and since I hate giving answer without people understanding...Here's a crash-course :

 

CSS (Cascading Style Sheet) is used to change Visual of a page without changing its structure (HTML). You will need to update a CSS file to achieve your goal.

 

Go in your template directory. Open the CSS directory and find the global.css. Open it and go to the end of the file. Add the following code :

 

.sheet {
font-size:12pt;
}

#short_description_content {
font-size: 10pt;
}

 

 

By th way, you should use pixel(px) value instead of point(pt) for supportability. PT are usually used for print css.

 

Martin

Edited July 11, 2013 by Martin Uker K (see edit history)

[vekia]

@[email protected] dont forget to let us know if the solution provided above works for you

[[email protected]]

Thank you, Martin

I can play around with css. but as per your instruction, it does not work.

Font stays same,

thanks

[Martin Uker K]

Hi,

 

I don't see any of the code on your global.css on "www.aatlu.com". You might have modified the wrong CSS or you didn't set compile off...

 

Martin

[[email protected]]

I tried and did not work, so I disable it,

But I have activated now,

http://aatlu.com/themes/yds-theme/css/global.css

i see it is over run by main CSS, or there is a span created in that div, and span value comes from product listing module.

I also tried

#short_description_content span{

font-family:Verdana;

font-size:20px

}

does not work,

let me know anything we can do?

Thanks

Alex

[Martin Uker K]

You want to BYPASS the instruction inline in your SPAN? (Exemple : you want to bypass this : <span style="font-size:10pt;">)

I am kinda angry at myself by writting this : Only the !important attribute in *.css file can help you in this situation. The rule in CSS goes around this :

1. inline style (In style tag's attribute)

2. Longest Correct path

3. ID

4. Class

5. Attribute selection

 

The only thing that can BYPASS this is having a !important after your css instruction value.

 

Exemple :

.sheets span {
   font-size:12pt !important;
}

 

I still recommend you to modify every products and remove the "span" in description (Might be long in your case I KNOW!) if that'S what you want.

 

Martin