XSitePro Website Design Software Message Board

XSite Pro should provide an easy way to set the default font for a website. (The lack of this feature is likely another shortcoming of the Pinedit editor.) I once thought that I could do this by editing both xsp_styles.css files and replacing all occurances of Verdana with Tahoma or Helvetica. While this works for already published sites, XSite Pro will flip the font back to Verdana the next time the website is loaded in XSite Pro.

Many of us do not want to use Verdana. Sure, we can change the font by adding a script to Global Scripts. We also want to be able to work with our preferred font in the Design editor without having to add a lot of code bloat by having to set every paragraph to our preferred font.

Being able to set a default font would be a welcome improvement.

_________________
XSitePro runs great on HostGator (WordPress does, too)

I do this using CSS in Global Scripts > HEAD section. For example:It works perfectly, but most XSitePro owners have no experience with CSS, so I agree that future versions should have some way of setting this.

If you're wondering why I added the "td" tag to the CSS, it's because text added to table cells won't automatically inherit the new font from the BODY tag. If the text in the table is not wrapped in a "p" tag or a "div" tag (both of which I have added to the list of selectors), it will use XSitePro's default Verdana font. I'm compensating for that by adding the "td" tag to the list of selectors.

If you want your headings to use the new font, too, add the "H1," "H2", etc. selectors to the CSS. Example:You can still style the headings separately in the CSS. Example:Inline elements like span tags, blockquotes and hyperlinks will use the new font automatically, but you can also add them to the CSS, if you wish. Example:There's another list tag besides "ol" and "ul" that most people don't ever use. It's called "dl" (Definition List). Add it if you use it. Example:

_________________
Andrea Wilson

1. Custom XSitePro Templates. XSitePro Consulting and Training. FREE TIPS!

2. Off-the-Shelf XSitePro Templates! Versatile designs. Easy to manage and maintain!

3. AllWebMenus Pro and XSitePro Work Perfectly Together! NEW!

Thanks Andrea, this is great information for those of us who know how to use it and why it works.
It would be a big improvement if XSite Pro provided a better way to change/extend the CSS.

Until then, I'll add this code to my XSite Pro CSS snippet library. I've started adding classes to various website structures so that I can use them to reduce the amount and complexity of the HTML code required.

_________________
XSitePro runs great on HostGator (WordPress does, too)

Hi Andrea

I've put this code in Other>Global Scripts>In The Head Section of the page:

<style>
body, p, td, ul, ol, div {font-family: Georgia, Times, "Times New Roman", serif;}
</style>
<style>
body, td, p, ul, ol, li {font-size: 12pt}
</style>

But when i come back to webpage>design section I still saw Verdana & 10 pt??

Thx for enlightening me.

Ebe

First of all, you don't need/want two sets of style tags, so you would do the CSS like this:You may still see Verdana 10pt in the Design view, but try Previewing the page. The Preview will pick up the custom CSS.

_________________
Andrea Wilson

1. Custom XSitePro Templates. XSitePro Consulting and Training. FREE TIPS!

2. Off-the-Shelf XSitePro Templates! Versatile designs. Easy to manage and maintain!

3. AllWebMenus Pro and XSitePro Work Perfectly Together! NEW!