0
Welcome Guest! Login
0 items Join Now

SOLVED Adding and Using Fonts -Help???

Last Post
Search Topic
    • DanG's Avatar
    • DanG
    • Preeminent Rocketeer
    • Posts: 36750
    • Thanks: 3229
    • Custom work done

    SOLVED Adding and Using Fonts -Help???

    Posted 8 years 6 months ago
    • I need to give a THANK YOU to a member or MOD that can help me out.

      GOAL:
      In a just installed clean Sienna RocketLauncher 1.0.1 - Gantry 5.6.3 and Joomla 3.6.2 in my MAMP for WINDOWS I'm trying to assign in my custom.scss our Requiem font "montserrat" to some Titles.

      So I'm following " Adding a New Font to Your Theme "

      Here are my steps:

      - copied Requiems "montserrat" font folder to [JOOMLA-ROOT]\templates\rt_sienna\custom\fonts

      - created a custom file [JOOMLA-ROOT]\templates\rt_sienna\custom\scss\custom.scss

      - according to the Docs I placed this in that file:
      @import "vendor/bourbon/bourbon";
@import "nucleus/theme/mixins/typography";
@include import-font('montserrat’);

      When I apply:
      .g-owlcarousel-item-title {
    font-family: "montserrat";
}

      I end up with a Default serifed font :(

      Worse in the Template Manager when I manually Recompile the CSS I get this error:

      Oops, parse error: failed at `@include import-font('montserrat’);` gantry-theme://scss/custom.scss on line 9.

      So any clue as to what's happening here. This is now occuring on two local sites with PHP Version 5.6.8 and one remote site running PHP 7.0.

      Any info would be much appreciated.
    • Last Edit: 8 years 6 months ago by DanG.
    #1320483
    • Damir's Avatar
    • Damir
    • Preeminent Rocketeer
    • Posts: 22450
    • Thanks: 2679
    • Web Developer

    Re: SOLVED Adding and Using Fonts -Help???

    Posted 8 years 6 months ago
    #1320524
    • DanG's Avatar
    • DanG
    • Preeminent Rocketeer
    • Posts: 36750
    • Thanks: 3229
    • Custom work done

    Re: SOLVED Adding and Using Fonts -Help???

    Posted 8 years 6 months ago
    • Damir wrote:
      You are missing this:
      @include font-face('montserrat', 'gantry-theme://fonts/montserrat-webfont');
      Thanks Damir for looking at it but it's still not working:

      This image is hidden for guests.
      Please log in or register to see it.


      I guess I'm still a little confused as this Documentation states:

      Adding a New Font to Your Theme
             If you want to have local fonts load across your site, you can do so by completing these simple steps:

      and states I need to add this:
      @import "vendor/bourbon/bourbon";
@import "nucleus/theme/mixins/typography";
@include import-font('roboto’);

      Then as you've indicating later down in the Documentation it states:

      Installing a Custom Font: Example
      In this example, we will explain how you can add the custom free font Bloody to your Gantry template.

      where this states I need to add this:
      @import "vendor/bourbon/bourbon";
@include font-face('BloodyNormal', 'gantry-theme://fonts/BLOODY-webfont');

.font-family-bloody {
  font-family: 'BloodyNormal',Helvetica,Arial,sans-serif;
  font-weight: normal;
  font-style: normal;
}

      So whats the difference between these two scenarios?

      Now I've have in my custom.scss:
      @import "vendor/bourbon/bourbon";
@import "nucleus/theme/mixins/typography";
@include import-font('montserrat-webfont');
@include font-face('montserrat-webfont', 'gantry-theme://fonts/montserrat-webfont');
.font-family-montserrat {
  font-family: "montserrat-webfont", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  font-weight: normal;
  font-style: normal;
}

      and the parse error has stopped in the Template Manager
      This image is hidden for guests.
      Please log in or register to see it.


      The other issue with "@include font-face" FontSquirrel doesn't offer a Webfont Kit for Montserrat :(
      So I created my own WebFont Kit and it still doesn't work.

      So this means I can't use Montserrat like in Requiem as I believe there the font is called from Googleapis.
    • Last Edit: 8 years 6 months ago by DanG.
    #1320557
    • DanG's Avatar
    • DanG
    • Preeminent Rocketeer
    • Posts: 36750
    • Thanks: 3229
    • Custom work done

    Re: SOLVED Adding and Using Fonts -Help???

    Posted 8 years 6 months ago
    • Hi Damir

      You know Damir I shouldn't do this stuff late at night. The Documentation, as usual, is right on and I forgot I had an extra folder for the fonts in my SCSS pathing. Once I corrected it worked perfectly.

      Now maybe I can return the favour a little bit. In the http://docs.gantry.org/gantry5/tutorials/fonts#adding-a-new-font-to-your-theme you have this line for the required SCSS:
      @include import-font('roboto’);

      Ahead of roboto a backtick is used but after roboto your using a Right single quotation mark ;)
    #1320689

Time to create page: 0.063 seconds