Changing H1, H2, H3 output...

9 posts by 5 authors in: Forums > CMS Builder
Last Post: November 11, 2010   (RSS)

By mingyq - November 8, 2010

Hello

I'm trying to change the H1,H2,H3 headings to be unbolded. I've got this to work INSIDE the WYSIWYG, however it is still bolded on the actual website (even after I resave the page). Is there another CSS somewhere that controls the actual output?

The CSS INSIDE the WYSIWYG was found here:

cmsbuilder_2_06
--cmsAdmin
----3rdParty
------tine_mce
--------themes
----------advanced
------------shins
--------------default
----------------content.css

MingyQ

Re: [Jason] Changing H1, H2, H3 output...

By mingyq - November 8, 2010

Tried the WYSIWYG CSS already, must be somewhere in another CSS. Based on your answer I assume these are the only two CSS files in play for CMS Builder?

MingyQ

Re: [mingyq] Changing H1, H2, H3 output...

By Jason - November 8, 2010

Hi,

There are other css files used in CMS Builder. These are found in cmsAdmin/3rdParty/SimplaAdmin/css/

Is the issue you're having looking at your records inside CMS Builder, or when you output it to the screen. If you go to cmsAdmin/lib/wysiwyg.css you can add custom css classes to use in the WYSIWYG field so you can match what you're using on your website.

Hope this helps.
---------------------------------------------------
Jason Sauchuk - Project Manager
interactivetools.com

Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/

Re: [Jason] Changing H1, H2, H3 output...

By mingyq - November 8, 2010

It looks correct inside CMS Builder, but are still bolded as the output to the screen.

MingyQ

Re: [mingyq] Changing H1, H2, H3 output...

By Chris - November 8, 2010

Hi MingyQ,

CMS Builder doesn't set any CSS rules on your viewer pages. You'll need to supply the same CSS rules on your front end website that you're providing CMS Builder with for the WYSIWYG.

One way to do this that may work for you would be to include the cmsAdmin/lib/wysiwyg.css file from your front end pages. Otherwise, you can copy-and-paste the CSS between cmsAdmin/lib/wysiwyg.css and your front end CSS file.

I hope this helps. Please let me know if you have any questions.
All the best,
Chris

Re: [mingyq] Changing H1, H2, H3 output...

By zip222 - November 9, 2010

One other thing to note, by default almost every browser bolds all headings, and applies some amount of proportional sizing.

Re: [zip222] Changing H1, H2, H3 output...

By ginger - November 9, 2010

So, just to expand on what zip222 said, if you want a heading to "not be bold" you'll need to set its font-weight to normal.

ginger

Re: [ginger] Changing H1, H2, H3 output...

By mingyq - November 11, 2010

Thanks, all of this pointed me in the right direction. You basically change the CSS in the file I indicated in the first post (to display "correct" within CMS Builder) AND also create a new CSS file that you add in with your other CSS files (if you have any).

The file could be called: customheader.css and contains these statements (sample):

h1 {font-size: 2em;font-weight:normal}
h2 {font-size: 1.5em;font-weight:normal}
h3 {font-size: 1.17em;font-weight:normal}

This ensures the headings are unbolded in Explorer, Opera and Firefox (have not checked others, assume they are OK).

MingyQ