: _syntax
Main reference
Ask your question below
Google has a nifty API for embedding custom fonts on your web site, where the user doesn't have to have the font installed. There's a long list of nice ones to choose from. How can I include the requisite style sheet link on my wikidot page?
You may put the code inside an [[html]] block, try pasting the block below on one of your wikidot pages:
[[html]]
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine">
<style>
gfont {
font-family: 'Tangerine', serif;
font-size: 48px;
}
</style>
</head>
<gfont> Making the Web Beautiful!</gfont>
[[/html]]
I tried and it looks just the same as in Google Web Font ́s page.
Nice, will use it, but with caution :-)
Maybe it would be nice if wikidot created a [[gfont family=Tangerine]] tag.
A - S I M P L E - P L A N by ARTiZEN a startingpoint for simple wikidot solutions.
I thought it would be possible to use elsewhere on my wiki a "html-block" ( or "code" block ?) to get the stylesheets from google and everwherey on my wiki I can use than the
[[span style="font-family:Tangerine;"]] ( or other fonts if I need them!)
… wherever I need it.
AS I have learned - I can use the html-block#s URL which I can get from the rendered page - open iframe only…)
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
This does not work in IE (8) ! ( I know it is old, but the company needs it)
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
Have a look on http://helmuti-pdorf.wikidot.com/style-sheets and the used code.
I have only "imported" in the module CSS the stylesheet from google…
Edit: this does not work in IE (8) … ( IE 9 I have no experience)
Edit2: This does work in FF (8) , but not on my IE (8) on "Vista" … I have no idea why.. I am sure this should work!
Windows Vista - IE Version 8.0.6001.19170 ( 256 bit version)
Edit: The "shadow" is not as expected.. ?
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
It worked fine for me in IE8 as well as my usual Firefox, Chrome, Safari and Opera and IE9. This is it on IE8 at http://vineyard.wikidot.com/edible-plants:main
gfont-ie8.pngRob Elliott - Strathpeffer, Scotland - Wikidot first line support & community admin team.
Thanks, Rob, for clarification!
My friends told me that this works or them,,, but not on my system.. ?
And the shadow is not working as I want..
Edit: I have seen YOUR Page is shown correctly on my IE (8) !
Now it is interesting what I am doing wrong
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
Thanks Rob,
after looking at your -template I found it … a typo in my span..
But the shadow is not working as I wanted it
Is this a CSS 3 level command?
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
No idea, I copied it from you! A nice solution which I will use quite a lot I think because it's easier than @font-face.
Yes, the shadow is CSS3.
Rob Elliott - Strathpeffer, Scotland - Wikidot first line support & community admin team.
Yes, it was confusing me more than I wanted.. sorry for the work of demonstration!
And bad, the shadow is not (yet) working on my IE (8), but on FF(8) not working too!
Edit: The shadow works in the manner that the 2 px numbers are working but the color not..
I have tried it now with "text-shadow:3px 16px;" ( direction "right" and "down") looks "strange".
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
To give a short and clear reply:
You can use such font families on every page f your wiki with inserting a module CSS for importing the style sheet like this code:
[[module CSS]]
@import url(http://fonts.googleapis.com/css?family=Tangerine);
[[/module]]
This is a test with css-google style sheet font "Tangerine"
@@[[span style="font-family:'Tangerine', serif;font-size: 48px;"]]Making the Web Beautiful![[/span]]@@:
[[span style="font-family:'Tangerine', serif;font-size: 48px;"]]Making the Web Beautiful![[/span]]
And normal back...
and with **text-shadow: 16px 16px;**:
@@[[span style="font-family:'Tangerine', serif;font-size: 48px;text-shadow: 3px 16px;"]]Making the Web Beautiful![[/span]]@@:
[[span style="font-family:'Tangerine', serif;font-size: 48px;text-shadow:3px 16px ;"]]Making the Web Beautiful![[/span]]
You can use the imported style in all [[div style="....]] and in [[span style="...]]
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?