Jump to content
Csl

The C in Csl stands for Coding (Tutorial)

Recommended Posts

Valucre-compatible fonts that aren't in the editor!

Code for changing the fonts is below. Just insert the font name exactly as it's written in the 'Font Name Here' and use the HTML guide above!

Edit: this doesn't seem to work on mobile or occasionally goes wonky.

<div style="font-family:Font Name Here">
  <p>text here</p>
</div>

Palatino Linotype

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


Book Antiqua

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


Arial Narrow

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


Garamond

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


Century Gothic

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


Segoe UI

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


Perpetua

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


Rockwell

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


Papyrus

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.

of all the web safe fonts it had to be this


Monotype Corsiva

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


Brush Script MT

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.

calligraphy yo


Goudy Old Style

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


Bodoni MT

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

This is italics

This is bold

This is italics and bold

This is small caps.


 

Edited by Csl

Share this post


Link to post
Share on other sites

Static scroll images (aka, scrolly pictures)

Disclaimer: doesn't work on mobile

This is a neat way to show huge, hd images without filling up the page or make static backgrounds. Basically the image remains static even though you scroll down

Below is a condensed example from the Taen lore article

The Jungle

[ QUADRANT I - JUNGLE | PRIMAS FOREST; PERSISTENT SILVAGENITUS COVER ]
The Wetlands

[ QUADRANT II - SWAMP | MUSKEG MARSH; NOXIOUS GROUND FOG ]
Sierra Ossa

[ QUADRANT III - MOUNTAIN | MOUNTAIN RANGE; REALITY INSTABILITY ]
The Barrens

[ QUADRANT IV - DESERT | SEMI-ARID STEPPE; SPATIO-TEMPORAL ANOMALIES ]

 

Now here's an example of just a picture

 

Picture template:

<div style="background-image: url(URL); background-size: 100%; width:100%; margin:auto; height:400px; background-attachment:fixed;"></div>

You can toy with the width and height of the container.

>>I'll add a template for background parallax for posts here later.

Edited by Csl

Share this post


Link to post
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.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...