Tagged: , , , , ,

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • February 15, 2015 at 5:40 am #396282
    DalandanUX

    Hello,

    My site (http://amusementUX.com) uses custom fonts, which I purchased from MyFonts, and the Enfold theme. Tonight, I updated from an earlier version (2.9.2) to 3.0.8 after the contact form stopped working. The contact form works now, but the update broke all of the fonts on my website. I now get only the system-default sans-serif and serif fonts.

    If I recall correctly, several months ago when I was having problems first getting the fonts to display, I made an edit to header.php. However, I can’t remember what that edit was.

    In Firebug, when I change this:

    <link media="all" type="text/css" href="http://amusementux.com/wp-content/themes/enfold-child/style.css?ver=2" id="avia-style-css" rel="stylesheet">

    to this:

    <link media="all" type="text/css" href="http://amusementux.com/wp-content/themes/enfold-child/AUX_plus_SVG.css" id="myfonts-css" rel="stylesheet">

<link media="all" type="text/css" href="http://amusementux.com/wp-content/themes/enfold-child/style.css?ver=2" id="avia-style-css" rel="stylesheet">

    all of the fonts work. However, my site’s users are not using Firebug, and they need to be able to see the correct fonts without changing the code in my website.

    Can you let me know what change I need to make (to header.php or otherwise) to get the fonts to show up properly?

    Thanks,
    David

    February 15, 2015 at 5:45 am #396283
    DalandanUX

    Looks like I found it here: Using web fonts in WordPress without using Cufon.

    The site appears to be working now.

    However, is there a way to make it so that I don’t have to do this after every theme update?

    I’m using a child theme of Enfold, by the way.

    February 16, 2015 at 12:09 pm #396623
    Rikard

    Hi!

    If the changes you made were in your child theme’s header.php then they should not have been overwritten. The easiest way to add custom CSS in Enfold though would be to paste it the in the Quick CSS box in theme options.

    Sorry for your headaches and great that you got a fix to your problem :)

    Regards,
    Rikard

    February 16, 2015 at 3:27 pm #396744
    DalandanUX

    Hi Rikard,

    The child theme only has a functions.php, its style.css, and the AUX_plus_SVG.css stylesheet (needed for making the MyFonts fonts work). It doesn’t have copies of the other Enfold .php files.

    Should I just copy Enfold’s current header.php (with my change) into the child theme’s main directory?

    A couple questions too, if I do that: Would that ensure that I don’t have to make this change again when the theme updates? And if the theme updates, will the changes that I need be able to sync to my child theme properly too?

    I’m not totally sure if my fix is the right fix because I’ve encountered some instances where text is overflowing its boundaries, where it wasn’t prior to the theme update and its grid changes. I’ve applied a temporary fix for the most glaring example of this (my homepage’s 7 How can we help? buttons), but you may be able to see this in the site’s footer (look for the rotating Tweets feed). This may be a font rendering / stylesheet order issue, but I’m still trying to figure this out.

    Thanks,
    David

    February 16, 2015 at 8:05 pm #397022
    Elliott

    Hey!

    You can add this to your child themes functions.php file to insert stuff into your header.

    add_action( 'wp_head', 'enfold_customization_add_meta' );
function enfold_customization_add_meta() {
?>
<link media="all" type="text/css" href="http://amusementux.com/wp-content/themes/enfold-child/AUX_plus_SVG.css" id="myfonts-css" rel="stylesheet">
<?php
}

    You wouldn’t need the second line.

    Can you take a screenshot of the second problem and send us a link to your page?

    Best regards,
    Elliott

    February 17, 2015 at 1:32 am #397190
    DalandanUX

    Hi Elliott,

    Thanks. Moving the modification to the child theme per your instructions worked.

    Here’s the screenshot you requested: http://easycaptures.com/fs/uploaded/747/2557903229.jpg. The bug still exists after making the code change above, so I think it got introduced by the grid changes between 2.9.2 and 3.0.8.

    In Firebug, the bug goes away if I disable the following style, but changing something this global would break a lot of other things in the theme:

    * {
   box-sizing: border-box;
 }

    So instead of doing that, I added this style in Firebug and was able to fix the issue:

    .rotatingtweets, .rotatingtweet {
    max-width: 100%;
}

    It seems like something is just causing the Rotating Tweets plugin to not play well with the recent theme updates. In general, it seems like the site’s grid columns are much narrower now than they were in 2.9.2 (really noticeable at larger resolutions like mine, 1920×1080). Is there a way to get the wider layout back?

    I’ve updated my style.css on the FTP server with the above change. It should show up on the site shortly.

    David

    February 17, 2015 at 11:52 am #397383
    Ismael

    Hey!

    I checked the site, the rotating tweeter feed looks good. Glad you fixed it.

    Cheers!
    Ismael

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.