1. SYSOPONLINE
  2. Sherlock Holmes
  3. Commercial Templates
  4. Sunday, 04 July 2021
  5.  Subscribe via email
Hello Ciaran,

how can I use embedded fonts?

I downloaded the font "Bilbo Swash Caps" from https://google-webfonts-helper.herokuapp.com/fonts/bilbo-swash-caps?subsets=latin and saved it in the Fonts folder.

I have integrated it via a custom.css:

/* bilbo-swash-caps-regular - latin */
@font-face {
font-family: 'Bilbo Swash Caps';
font-style: normal;
font-weight: 400;
src: url('/http://astrid-schuenemann.com/templates/j51_jasmine/fonts/bilbo-swash-caps-v15-latin-regular.eot'); /* IE9 Compat Modes */
src: local(''),
url('/http://astrid-schuenemann.de/templates/j51_jasmine/fonts/bilbo-swash-caps-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('/http://astrid-schuenemann.de/templates/j51_jasmine/fonts/bilbo-swash-caps-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('/http://astrid-schuenemann.de/templates/j51_jasmine/fonts/bilbo-swash-caps-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
url('/http://astrid-schuenemann.de/templates/j51_jasmine/fonts/bilbo-swash-caps-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('/http://astrid-schuenemann.de/templates/j51_jasmine/fonts/bilbo-swash-caps-v15-latin-regular.svg#BilboSwashCaps') format('svg'); /* Legacy iOS */
}

I can't select these via the editor though?
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

May I suggest sending temporary administration access to your Joomla installation to info@joomla51.com and we will edit your template to include this font in the font dropdown. For our reference please paste a link to this post in your email.

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
Hello Ciaran,

I think I have managed to do it myself.

I have inserted the font under elements\googlefonts.php
$googleFonts['Bilbo Swash Caps'] = 'Bilbo Swash Caps';

and then uploaded it via FTP to /http://astrid-schuenemann.de/templates/j51_jasmine/fonts.

I mean if you now call http://www.astrid-schuenemann.de the fonts are not loaded from google.



but I have another problem. I want to add a gradient to the background of the module position Bottom-3:


background: rgb(62,160,185);
background: linear-gradient(180deg, rgba(62,160,185,0.7091037098433124) 0%, rgba(62,160,185,1) 100%);


I added the following code via custom.css:


#container_bottom3_modules {
background-color: #3ea0b9;
background: rgb(255,255,255);
background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(62,160,185,1) 100%);
background-position-x: 0%;
background-position-y: 0%;
background-size: auto;
}


But it doesn't take it over.

Translated with http://www.DeepL.com/Translator (free version)
  1. more than a month ago
  2. Commercial Templates
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Looking at the source of your site, it appears that your custom CSS is not been added to the page. Some possible reasons may be...

1. You have multiple template styles and have added your CSS to a style that is not assigned.
2. There is an error in your CSS prior to this (Try moving the above CSS to the top of the field.

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 3
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!