Add this code to your header.tpl, before "<body>":
.
Then, in styleshett.css, asign font-family to your elements.
Code: Select all
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=YOUR-FONT-NAME">
Then, in styleshett.css, asign font-family to your elements.
dropbox.com - 2GB free online storage.
How custom is the font? If it is one created by/for you and only you have, the only way you can use it is in images since no one viewing your site will have that font and be able to see it. If it is a different font that is on most peoples computers (ie comes with windows), then you can specify it as given above.
Running Opencart v3.0.3.2 with multi-stores and the default template from https://www.labeshops.com which has links to all my stores.
Code: Select all
@font-face {
font-family: yourfont;
src: url('yourfonturol/yourfont.ttf');
}
Opencart Templates, Modules, Themes & Custom Development | ShopThemer
In addition to what other have said - you can do it - you need to make sure you cater for all devicesXyph3r wrote:have you tried this?Code: Select all
@font-face { font-family: yourfont; src: url('yourfonturol/yourfont.ttf'); }
Using DJGross as an example
font-family: 'DJGrossNormal';
src: url('DJGROSS-webfont.eot');
src: url('DJGROSS-webfont.eot?#iefix') format('embedded-opentype'),
url('DJGROSS-webfont.woff') format('woff'),
url('DJGROSS-webfont.ttf') format('truetype'),
url('DJGROSS-webfont.svg#DJGrossNormal') format('svg');
font-weight: normal;
font-style: normal;
Font squirrel is a good resource
Okay, let's say you have these:
(1) Your own latest-version .ttf of your own specially tweaked and dearly held LesNessmanRedWigglers1.ttf but browser settings might prevent its being displayed and some older operating systems won't run the newer .ttf anyway;
(2) Fallback to on-line but older version .ttf of original LesNessmanRedWigglers2.ttf but notwithstanding browser settings the wkrp server is usually down because Johnny and Venus spend too much time visiting Jennifer out front, and some newer operating systems won't run the older .ttf anyway;
(3) Preference that people see SOMETHING legible that they will probably but not necessarily have on their own machines, and that probably shipped with their operating systems but owing to personal preferences they may have uninstalled, and some operating sytems won't run any .ttf anyway.
You then need to define some of the fonts (not all) and specify your preferred sequence for
"style='color:#000000; font-family:LesNessmanRedWigglers1,LesNessmanRedWigglers2,TimesNewRoman,Times,serif;'"
or similarly several other fonts ending the train with ",non-serif;' " so that probably all comers will load at least A font.
We cannot control the availability or lack of fonts on the web or in all machines, but we can spell out the sequence of our choices for dealing with the inevitability that even TimesNewRoman and Arial are not everywhere on the electronic planet.
(1) Your own latest-version .ttf of your own specially tweaked and dearly held LesNessmanRedWigglers1.ttf but browser settings might prevent its being displayed and some older operating systems won't run the newer .ttf anyway;
(2) Fallback to on-line but older version .ttf of original LesNessmanRedWigglers2.ttf but notwithstanding browser settings the wkrp server is usually down because Johnny and Venus spend too much time visiting Jennifer out front, and some newer operating systems won't run the older .ttf anyway;
(3) Preference that people see SOMETHING legible that they will probably but not necessarily have on their own machines, and that probably shipped with their operating systems but owing to personal preferences they may have uninstalled, and some operating sytems won't run any .ttf anyway.
You then need to define some of the fonts (not all) and specify your preferred sequence for
"style='color:#000000; font-family:LesNessmanRedWigglers1,LesNessmanRedWigglers2,TimesNewRoman,Times,serif;'"
or similarly several other fonts ending the train with ",non-serif;' " so that probably all comers will load at least A font.
We cannot control the availability or lack of fonts on the web or in all machines, but we can spell out the sequence of our choices for dealing with the inevitability that even TimesNewRoman and Arial are not everywhere on the electronic planet.
Yes this method works great!Xyph3r wrote:have you tried this?Code: Select all
@font-face { font-family: yourfont; src: url('yourfonturol/yourfont.ttf'); }
Thank You.
Check it on another machine that doesn't have the font, pwood. You can see it. If it is on-line (G. or anywhere) it will be visible unless its own server is down or slowed by traffic. If it is neither on a user's machine nor accessible elsewhere, it won't show. You want visitors to see something readable even if it is not your first choice. That is the reason for font-family fallbacks through a series of fonts that you can list in decreasing order of your own preference ending in the generic default serif or sans-serif that every machine will have -- a readable traditional font, whichever it happens to be.
I did not know that I could change the font so easily. And what about changing the font inside the admin? Could I make it more beautiful to my client or it's not possible? Should I just copy/paste the Google Fonts resource?
Faço criação de site e loja virtual
As with Xyph3r's code above, it isn't in admin, it's in files that call the fonts. Those will generally be .css and .tpl files.
If you want your client to see "beautiful" then be sure that "beautiful" is either accessible on-line (such as a G.F. URL) or loaded on your client's computer. The fallbacks work if the URL (G.F. or anything else) is inaccessible or if the client doesn't have the font.
The web does not yet have "embedded fonts" but that is being worked on. Embedding fonts involves not only the technology to do it, but the intellectual property rights in fonts (and those are not at all trivial).
If you want your client to see "beautiful" then be sure that "beautiful" is either accessible on-line (such as a G.F. URL) or loaded on your client's computer. The fallbacks work if the URL (G.F. or anything else) is inaccessible or if the client doesn't have the font.
The web does not yet have "embedded fonts" but that is being worked on. Embedding fonts involves not only the technology to do it, but the intellectual property rights in fonts (and those are not at all trivial).
Where I must place this code to add a new font in my site
Code: Select all
@font-face {
font-family: yourfont;
src: url('yourfonturol/yourfont.ttf');
}
Where I must place this code to add a new font in my siteXyph3r wrote: ↑Mon Jun 24, 2013 8:04 pmhave you tried this?Code: Select all
@font-face { font-family: yourfont; src: url('yourfonturol/yourfont.ttf'); }
Who is online
Users browsing this forum: No registered users and 79 guests