Jump to content

Default font setting for Cube Cart v6


Big Gee

Recommended Posts

Just a 'quickie' this time!

I've noticed that the general font for the cart is dependent on the default font chosen for the browser that's being used to view the cart. As an example my Firefox browser is set to Arial, so on first viewing the contents of the Cube Cart I've set-up, in my Firefox browser, the type in the cart looked nice and neat - in Arial. I assumed this was the font displayed by Cube Cart in all browsers.

However on a different device, but still using Firefox the type on the various pages was Times New Roman (unless the user changes the default font in Firefox, then Firfox's default is Times New Roman).

What I would like to do is set the font in the cart so that it displays as Arial in all browsers, rather than depend on the default browser settings in individual browsers.

Can someone tell me where to do this please? I guess it's a CSS file somewhere. Just tell me the file name and where to find it and what edits I need to make, I'll do the rest, if it's possible! Thanks.

Kind regards,

G.

Link to comment
Share on other sites

Try adding this to the skin/css/cubecart.css file.

html * {
    font-family: arial, helvetica, sans-serif;
    -webkit-font-smoothing: antialiased;
}

html * {
    font-family: arial, helvetica, sans-serif;
    -webkit-font-smoothing: antialiased;
}

I've always used Ariel, but did not realize it would show up differently on different devices/browsers. So I'm not sure this will accomplish what you want.

Link to comment
Share on other sites

Know that font declarations are a skin parameter. It depends exclusively on the skin's programming.  CubeCart itself doesn't care.

For Foundation, the initial font family CSS rule is found in normalize.css, which sets a "sans-serif" font. The font "sans-serif" isn't a font actually, but an indication that the browser should use the browser's setting for the sans-serif designation. Your browser could be set for Arial.

In a later loaded file, foundation.css, the font family is set with "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif. The browser will use the earliest named font if computer has that font loaded.

In a later loaded file, cubecart.css, the font family is set with "Open Sans",sans-serif. The font "Open Sans" is fetched from fonts.googleapis.com. If this page resource is blacked, then the browser uses sans-serif (as discussed above).

Other skins may have other CSS files put in play, depending on the substyle, that affect the font family.

Link to comment
Share on other sites

Hmmm - the skin being used is Nota. I've been through the folders for this skin but I can't find anything that matches up to the .css files mentioned for the Foundation skin.

A bit of a tickly one, I expected (foolishly perhaps) that this would be a simple straightforward edit!

If anyone has come across this little problem using a Nota skin & knows the answer I'd be very pleased. It's not the end of the world, as it doesn't effect the functionality of the Cart, but it's nice to have things looking the way you want them to look.

Thanks,

G.

Link to comment
Share on other sites

OK - I've downloaded Nota and taken a look.

You may be able to make a comparable edit to the color folder/layout.php you are using. OR you may have to edit the styles/common.css file/

tml {
	margin: 0px;
	padding: 0px;
	font-family: Georgia, Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif," "Bitstream Vera Serif", "Liberation Serif", serif;
	font-size: 14px;
}

 

Link to comment
Share on other sites

As mentioned above, Nota (unless your copy of Nota has been customized) is, in common.css, setting the font family to the first found font in that list. If none of the named fonts are installed on the visitor's computer, the browser will use the font set in the browser's settings for the 'serif' designation -- typically Times Roman.

However, Nota also calls for all the CSS files found in CubeCart's folder /js/styles/. There could be many, many CSS files in that folder, and any of them could set the font family -- but specifically these CSS files are used to style the corresponding javascript plugin files. Therefore, I wouldn't look too closely at them.

For Nota, I suggest you add the named font you want your store to have at the beginning of the list shown above.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...