How to change Standard Font to Custom Font

[JanAtHome]

Hello
Im building on a new display with Dashticz.

screenshot.2968.jpg (67.48 KiB) Viewed 830 times

My old display is based on the standaard www frontpage.html

screenshot.2967.jpg (50.9 KiB) Viewed 830 times

I want to change the standard font to Orbitron (fonts.googleapis.com/css?family=Orbitron:700')
Can anybody help me to point out how i do that?

Here a part of the frontpage hmtl

Code: Select all

<title>Domoticz Monitor</title> 
 <meta name="apple-mobile-web-app-capable" content="yes" />
                <meta name="mobile-web-app-capable" content="yes" />
               <meta name="apple-mobile-web-app-status-bar-style" content="black" />
               <meta http-equiv="content-type" content="text/html; charset=utf-8" />
                <meta http-equiv="X-UA-Compatible" content="IE=edge" />
                <link rel="shortcut icon" href="/favicon.ico" />
	            <link rel="apple-touch-icon" href="images/touch-icon-iphone.png">
 <link href='http://fonts.googleapis.com/css?family=Orbitron:700' 
    <link href='http://fonts.googleapis.com/css?family=Arimo' rel='stylesheet' type='text/css'>
 <link href='http://fonts.googleapis.com/css?family=Open+Sans:600' rel='stylesheet' type='text/css'>

Here the cell text

Code: Select all

   #cell5,
    #cell12,
    #cell19
{
	font-family: Orbitron, serif;
	font-weight: bold;
	width: 500px;
	padding: 1px;
	border: 1px solid #333;
	border-radius: 5px;
	background-color: #070707;
	height: 160px;
	line-height: 160px; 		
	font-size: 160px;
	color: darkorange; //Kleur waardes van cellen
}

Here the new display , the orange part at the top.

Code: Select all

.block_270 .value { 
   font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
   font-weight: 900;
   font-size: 50px !important;
   text-align: top !important;
   color: Orange !important; 
  
}

.block_270 .title { 
   font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
   font-weight: 900;
   font-size: 90px !important;
   text-align: top !important;
   color: Orange !important; 
  

[JanAtHome]

No user that can give me tips?

[Lokonli]

No user that can give me tips?

Add the following to custom.js:

Code: Select all

$('<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Orbitron" />').appendTo('head');

Add the following to custom.css:

Code: Select all

body {
  font-family : orbitron;
}

And then most of Dashticz will be in the new font. For the parts that don't have the correct font you can add the class definition to custom.css as well.

[JanAtHome]

Tks i will try this tomorrow , and let no if its works.
I have add the lines and its works , thanks again.