40% OFF FOR NEW LICENSES AND RENEWALS →

Google Fonts is a site where there are several types of fonts, from the most used to the lesser known, with it you have the option of downloading the font, or even import links from each font and use them within your site, system, or even within Scriptcase. In this post we will be teaching how to use those fonts in Scriptcase in a fast and easy way:

Step 01 – Visit Google Fonts website: https://www.google.com/fonts

Step 02 – Choose the font of your interest and click “Quick-use”:
001

 

Step 03 – Choose the types of fonts you want and select the check box:
002

 

Step 04 – Choose the way you want to put the font in your website or system, in this example we will use the “@import”, so this way we will be taking the import code to add within CSS, so click at @import and copy the two lines available:
003

Okay, we already have the import code to use within Scriptcase. Then we will access it.

In this example we created a control screen with 3 text fields and 1 HTML image. We will open the onLoadAll event.

 

Step 05 – We need to open the tags <style> </style> to add the CSS. For this:

?>
<style>
</style>
<?php

 

Step 06 – We will paste the import code of Google Fonts site:

?>
<style>
@import url(https://fonts.googleapis.com/css?family=Overlock);
</style>
<?php

Step 07 – In the title of the application (the place is where we will make the change of the font style), we will add a <span> tag with a class before the text that will be the title, so (do not forget to close the tag after the title </span>):
Layout Scriptcase

 

Step 08 – Back in the onLoadAll event, now add the CSS code that will be responsible for changing the font style:

?>
<style>
@import url(https://fonts.googleapis.com/css?family=Overlock);
span.font-cab {
font-family: 'Overlock', cursive;
}
</style>
<?php

That’s it: with these changes we will have the change of the font, you can now use your creativity and change your applications with different fonts of Google Fonts and leave your site or system with a more attractive layout.

This change was made to the fields too, check how was the result:

008

 

One thing is for sure, you can bring to Scriptcase anything that you are able to do outside Scriptcase but you will have less effort. Give Scriptcase a chance and use it for 20 days for free at www.scriptcase.net

You might also like…

Cache technique in PHP

Cache technique in PHP In this example we will check the actual optimization using a small scri...

A look at Scriptcase 9

In a daily basis this tool has given me great satisfaction, and very good and fast results in terms ...

Deep Data: Is it possible when you’re non-profit?

Evan Liebovitch talks about deep data and how to document the needs of a non-profit while using Scri...

Comment this post

Get new posts, resources, offers and more each week.

We will use the information you provide to update you about our Newsletter and Special Offers. You can unsubscribe any time you want by clinck in a link in the footer of any email you receive from us, or by contacting us at sales@scriptcase.net. Learn more about our Privacy Police.