Default font for CMS Article and Article Preview pages

[ged]

Is it possible to override CMS' article and article preview pages' fonts? I'm using "!imporant" tag in CSS templates but nothing changes.

I think I'm missing correct variables even if I'm using FireBug. Can you help me please? Thank you very much. :)

[Lynne]

We would need a link to your CMS to see what is going on. And what font are you trying to change it to? And only in the article/preview area?

[tbworld]

Seems like your modified CSS is working. Your new properties are applied to the browser when I analyze your page. Seems obvious, but shut off your browser cache for testing -- just in case.

[ged]

I've created a default theme (named VB.ORG) for you to see.

Following CSS codes are the changes that I've made (vbcms.css):

.cms_article_txt_content {
font-family: verdana !important;
font-size: 12px !important;
}

.article {
font-family: verdana !important;
font-size: 12px !important;
}

I've added these two lines in each classes. It works if you use default font but it doesn't work on user customised fonts. For example, if a user decides to use 4px impact font, these codes doesn't override it.

I'm trying to use a single theme on my site but I couldn't solve this problem.

Thank you.

[Lynne]

Try adding it for <span> also:

.cms_article_txt_content, .cms_article_txt_content span {
font-family: verdana !important;
font-size: 12px !important;
}

.article, .article span {
font-family: verdana !important;
font-size: 12px !important;
}

[ged]

Actually, it didn't work. If you look at last two posts in my CMS page, they aren't affected. :(

[Lynne]

I'm not seeing it in your additional.css template at all. Did you remove the CSS from there?

[ged]

No, it's stored in filesystem. But I didn't make these changes in additional.css, I've added your lines to vbcms.css. These classes were in this file.

Did I do it wrong?

[tbworld]

I was going to post the same changes @Lynne suggested, then I forgot to create the post the other day, so her suggestion does work as it has been tested.

In general when you are testing out new CSS you want to post at the end of the CSS chain. In this case that is 'additional.css' template (a @lynne invention). Revert the vbcms.css template and re-add the code to the 'additional.css' templage, the way @Lynne suggested. The advantage being that you can always see your latest changes altogether.

Caution - Make a backup of your vbcms.css template or save a download copy of it. Then do the 'revert' -- just in case you made other changes.

There are many reasons for not doing it this way, but for now lets not confuse you.

[ged]

Sorry for being late, I had a flu and had to rest a while. :)

I've added these things as you said, but nothing's changed. Customised fonts are still not affected. :(

[tbworld]

Sorry for being late, I had a flu and had to rest a while. :)

I've added these things as you said, but nothing's changed. Customised fonts are still not affected. :(

It is working when I visit your page. I can see the font-type applied from additional.css
Clear your browser and CMS cache.

[Lynne]

You are going to have to go through and add in every type of option they can add. If they can do bold, then add a b and set the font-weight to normal. If italics, then add an i and set font-decoration to normal. example adding in b below:
.cms_article_txt_content, .cms_article_txt_content span, .cms_article_txt_content font, .cms_article_txt_content b {
font-family: verdana !important;
font-size: 12px !important;
font-weight:normal !important;
}

[ged]

Thank you very much Lynne. It's now working! :)

I've got another question about CMS. I've got some widgets on my front page, and as you see, they are on content pages too. How can I disable some of them when a user views full article?

[Lynne]

The article will have the same layout as the section it is in. If you want the articles to have a different layout, then you need to put them in a different section.

[ged]

But then wouldn't it affect the view of the front page?

I want an article show on front page (which has layout A) and when viewing it on full mode, I want to show a layout B to user.

I don't want user to see every front page module when reading / commenting an article.

NOTE: I've solved the problem. :)