Google fonts etc.

[msman0]

Hello, we have in germany a problem if the site loads automatically fonts etc. from Server outside germany (EU).
See here (only in german)

Is it possible to store the google fonts an the other resources like the weathericons from cloudflare on the local webserver?

Thank you
Regards.

[roe-dl]

When I started to write the privacy statement for my website I realized that problem and downloaded all those fonts etc. to the local server and changed header.html.tmpl like this:

##        <link rel='dns-prefetch' href='//fonts.googleapis.com' />
##        <link rel='dns-prefetch' href='//stackpath.bootstrapcdn.com' />
##        <link rel='dns-prefetch' href='//cdnjs.cloudflare.com' />

##        <link rel='stylesheet' href='//fonts.googleapis.com/css?family=Roboto%3A300%2C400%2C700&#038;ver=1.0' type='text/css' media='all' />
        <link rel='stylesheet' href='$relative_url/lib/css/font-Roboto-300-400-700-v1.0' type='text/css' media='all' />
##        <link rel='stylesheet' href='//stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' type='text/css' media='all' />
        <link rel='stylesheet' href='$relative_url/lib/css/font-awesome.min.css' type='text/css' media='all' />
##        <link rel='stylesheet' href='//cdnjs.cloudflare.com/ajax/libs/weather-icons/2.0.9/css/weather-icons.min.css?ver=4.7.4' type='text/css' media='all' />
        <link rel='stylesheet' href='$relative_url/lib/css/weather-icons.min.css?ver=4.7.4' type='text/css' media='all' />
##        <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
##        <link rel="stylesheet" href="$relative_url/lib/css/jquery-ui.css">
##        <link rel='stylesheet' href='//stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css' type='text/css' media='all' />
        <link rel='stylesheet' href='$relative_url/lib/css/bootstrap.min.css' type='text/css' media='all' />
...

##        <script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
##        <script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
##        <script type='text/javascript' src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment-with-locales.min.js"></script>
##        <script type='text/javascript' src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.33/moment-timezone-with-data.min.js"></script>

        <script type='text/javascript' src="$relative_url/lib/js/jquery.min.js"></script>
##        <script type='text/javascript' src="$relative_url/lib/js/jquery-ui.min.js"></script>
        <script type='text/javascript' src="$relative_url/lib/js/moment-with-locales.min.js"></script>
        <script type='text/javascript' src="$relative_url/lib/js/moment-timezone-with-data.min.js"></script>
...
##        <script type='text/javascript' src='//stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js'></script>
        <script type='text/javascript' src='$relative_url/lib/js/bootstrap.min.js'></script>

The lines with the 2 # signs at the beginning are the original lines, that are commented out by this. The next or previous line is the replacement.

In skin.conf at copy_always I added lib/*.

In the directory of the Belchertown skin I created an additional directory lib and in there css, font, fonts, js and downloaded the files from Google etc. there.

...$ ls lib/*
lib/css:
bootstrap.min.css      font-Roboto-300-400-700-v1.0   weather-icons.min.css
bootstrap.min.css.map  font-Roboto-300-400-700-v1.0~
font-awesome.min.css   jquery-ui.css

lib/font:
weathericons-regular-webfont.svg  weathericons-regular-webfont.woff
weathericons-regular-webfont.ttf  weathericons-regular-webfont.woff2

lib/fonts:
fontawesome-webfont.eot  fontawesome-webfont.ttf   fontawesome-webfont.woff2
fontawesome-webfont.svg  fontawesome-webfont.woff  roboto

lib/js:
bootstrap.min.js  moment-timezone-with-data.min.js  skymap.js
jquery.min.js     moment-with-locales.min.js
jquery-ui.min.js  paho-mqtt.min.js

[c0by85]

Big thank you, but typos have crept in. Perfect as always @roe-dl

E.G.:

## <link rel="stylesheet" href="$relative_url/lib/css/jquery-ui.css">

should be

<link rel="stylesheet" href="$relative_url/lib/css/jquery-ui.css">

[roe-dl]

JQuery UI is not really needed, see issue #736. So you can comment it out.

[msman0]

Thank you very much for the explanation. Sorry but I'm not so familiar with it. Where can I download the files? I only found the links to css files.

[roe-dl]

I just created a ZIP file containing those files. You can download it by:

wget https://www.woellsdorf-wetter.de/lib.zip

[msman0]

Thank you very much. I have downloaded the file and will now try to install. Best regards!

[msman0]

Great work roe-dl! I have installed it and it work. Thank you very much for your help.

[pannetron]

Do the Highcharts license agreements permit us to download those files? That solution is best for me, I hope it's permitted!