Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • August 26, 2016 at 9:32 am #678020
    Sadegh

    Hi,
    Please take a look at the test page in Private area.

    > In this page, I want to have a custom font (Dinar) for the button.
    –
    This is what I had already done to make that possible:
    1>> I have already upload 2 custom fonts in Enfold-Child folder, names are “IRANSans” + “Dinar” and I also added @font-face commands for these fonts in custom.css file in Enfold; exactly like the below code:

    @font-face {
font-family: 'IRANSans';
src: url('http://inomax.ir/wp-content/webfonts/IRANSansweb.eot');
src: url('http://inomax.ir/wp-content/webfonts/IRANSansweb.eot?#iefix') format('embedded-opentype'),
url('http://inomax.ir/wp-content/webfonts/IRANSansweb.woff2') format('woff2'),
url('http://inomax.ir/wp-content/webfonts/IRANSansweb.woff') format('woff'),
url('http://inomax.ir/wp-content/webfonts/IRANSansweb.ttf') format('truetype'),
url('http://inomax.ir/wp-content/webfonts/IRANSansweb.svg#IRANSans') format('svg');
}
fieldset label {
    font-family: "IRANSans" !important;
}
@font-face {
font-family: 'Dinar';
src: url('http://inomax.ir/wp-content/webfonts/dinar.eot');
src: url('http://inomax.ir/wp-content/webfonts/dinar.eot?#iefix') format('embedded-opentype'),
url('http://inomax.ir/wp-content/webfonts/dinar.woff2') format('woff2'),
url('http://inomax.ir/wp-content/webfonts/dinar.woff') format('woff'),
url('http://inomax.ir/wp-content/webfonts/dinar.ttf') format('truetype'),
url('http://inomax.ir/wp-content/webfonts/dinar.svg#IRANSans') format('svg');
}

    2>> “IRANSans” is now shows properly in the whole of the website, there is no problem with this font.
    3>> But for the button, I applied custom css class to that button element, the class name was choose as “test-pg-title”
    4>> I then add this below code to the Quick Css part:

    #top .test-pg-title a .avia_iconbox_title {
    font-family: 'Dinar' !important;
}

    But, the “button” is still doesn’t show the desired font, “Dinar”.

    Please let me know.
    Regards,
    Sadegh

    August 30, 2016 at 5:27 am #679263
    Ismael

    Hey Sadegh!

    Thank you for using Enfold.

    We got the following errors in the console. Please follow this documentation. http://kriesi.at/documentation/enfold/enable-cors/

    http://www.inomax.ir/wp-content/themes/enfold-child/webfonts/dinar.woff2 Failed to load resource: the server responded with a status of 404 (Not Found)
    2016-08-30 11:22:55.189 http://www.inomax.ir/wp-content/themes/enfold-child/webfonts/dinar.woff Failed to load resource: the server responded with a status of 404 (Not Found)
    2016-08-30 11:22:56.359 http://www.inomax.ir/wp-content/themes/enfold-child/webfonts/dinar.ttf Failed to load resource: the server responded with a status of 404 (Not Found)
    2016-08-30 11:22:57.352 (index):1 Redirect at origin ‘http://inomax.ir’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://www.inomax.ir’ is therefore not allowed access.
    2016-08-30 11:22:58.048 (index):1 Redirect at origin ‘http://inomax.ir’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://www.inomax.ir’ is therefore not allowed access.
    2016-08-30 11:22:58.801 (index):1 Redirect at origin ‘http://inomax.ir’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://www.inomax.ir’ is therefore not allowed access.

    Best regards,
    Ismael

    August 30, 2016 at 2:11 pm #679433
    Sadegh

    Hi Ismael,

    I already added that code to the .htaccess file. But still, it doesn’t work at all.

    <FilesMatch "\.(ttf|otf|woff)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>

    an image from .htaccess :
    .

    an image from webfonts folder in cpanel:
    .

    Regards,
    Sadegh

    • This reply was modified 8 years, 2 months ago by Sadegh.
    August 30, 2016 at 3:16 pm #679495
    Yigit

    Hey!

    Please change your CSS code to following one 

    @font-face {
font-family: 'IRANSans';
src: url('webfonts/IRANSansweb.eot');
src: url('webfonts/IRANSansweb.eot?#iefix') format('embedded-opentype'),
url('webfonts/IRANSansweb.woff2') format('woff2'),
url('webfonts/IRANSansweb.woff') format('woff'),
url('webfonts/IRANSansweb.ttf') format('truetype'),
url('webfonts/IRANSansweb.svg#IRANSans') format('svg');
}
fieldset label {
    font-family: "IRANSans" !important;
}
@font-face {
font-family: 'Dinar';
src: url('webfonts/dinar.eot');
src: url('webfonts/dinar.eot?#iefix') format('embedded-opentype'),
url('webfonts/dinar.woff2') format('woff2'),
url('webfonts/dinar.woff') format('woff'),
url('webfonts/dinar.ttf') format('truetype'),
url('webfonts/dinar.svg#IRANSans') format('svg');
}

    Cheers!
    Yigit

    August 30, 2016 at 3:41 pm #679519
    Sadegh

    Hey Yigit,

    Thanks a lot, the problem is solved.
    (another font -Koodak- has been uploaded for another try, and it cleared out that they have converted “Dinar” font wrongly into .eot/.woff/.ttf/.svg – sorry for that)

    (you may now close the thread please)

    Regards,
    Sadegh

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘custom font in custom css class’ is closed to new replies.