Okay
  Public Ticket #1408585
Fonts are not loading - bad Google links
Open

Comments

  • nezzazvoni started the conversation

    Hello,

    we have a problem - the polytechnic website load fonts in a weird fashion - half of the users we spoke to see Open Sans as we intended, half see Times New Roman which is very bad for overall experience.

    We tried to investigate into the problem and found faulty CSS links:

    https://fonts.googleapis.com/css?family=Open\2bSans\3a300,300italic,regular,italic,600,600italic,700,700italic,800,800italic

    https://fonts.googleapis.com/css?family=Open+Sans%F0%BA%8C%80,300italic,regular,italic,600,600italic,700,700italic,800,800italic

    The link should look something like this:

    https://fonts.googleapis.com/css?family=Open+Sans:400,700,800

    I am not an expert, but it seems, that the theme replaces "+" for "\2b" and ":" for "\3a" which causes problems, mainly on Apple and mobile devices in general.

    Can you help us solving the issue?

  •  112
    Charles replied

    Hi nezzazvoni, 

    Thanks for the heads up, and I apologize for the delay over the holiday. I appreciate you looking into the issue and providing that information. Can you provide where you are seeing this call rooted, for example, in a specific stylesheet? The theme's primary fonts that are being loaded are Roboto Slab and Raleway.

    To be able to help, I need some additional information to help illustrate the issue, including the browsers that you are experiencing the issue on, a single element as an example, and any other relevant information (like if the element is being controlled with an option on the backend).

    Kind Regards,

    Charles

  • nezzazvoni replied

    Hi,

    please see the enclosed screenshot. I don't know which css file exactly causes the problem, but the fonts with the error are the same we choose in the theme options drop-down menus.

    Regarding the browsers - this is the strange one - we experienced the issue on Mac as well as on PC, mostly Chrome but also Safari. We can't see any pattern at this. Some Win10 Chrome machines works, some don't etc.

    In the meantime, we added our own code into the custom css field, which solves the problem for the end user, but we would certainly have this problem solved on the theme level...

    Please see https://www.spseplzen.cz - this is the site in question.

    Best regards

    Attached files:  style.png

  •  112
    Charles replied

    Hi nezzazvoni, 

    I am working on replicating this on my end. In the mean time, try the following: 

    1 - Update the "Styles" plugin to the latest version. You should be able to do this right in the Plugins panel. Here is some additional information on this plugin/updates - https://wordpress.org/plugins/styles/#developers

    2 - Confirm which version of the "Styles: Polytechnic" you are running.

    3 - Run through these Standard Troubleshooting Steps to ensure that your there aren't any unknown influences/conflicts.

    Kind Regards,
    Charles

  • nezzazvoni replied

    Hi,

    1. the Styles are up to date
    2. Styles: Polytechnic is version 1.4
    3. I run through all of it, but nothing works. We have up to date WP, I re-downloaded and re-installed the theme etc.

    The problem with the Google Fonts starts to show up right after I activate the Styles and Styles: Polytechnic plugins, even if all other plugins are disabled (including Visual Composer which renders the page unusable of course).

    This leads me to the conclusion, that the problem is caused by something else than plugin incompatibility or older version of the theme or WP.

    Kind regards,

    Karel

  •  112
    Charles replied

    Hi Karel, 

    Thanks for the update. I am still not clear how you are modifying the fonts. Are you doing this in Appearance > Customize? If so, this would require the Styles and Styles: Polytechnic plugins, since these are responsible for adding these options, and for loading the google fonts via the Styles plugin stylesheet generation.

    Unfortunately, that isn't an indication that these plugins are the issue, or life would be a lot simpler It also doesn't rule them out. Because of this, and since you're still experiencing issue, I'm going to need to recommend running through the Standard Troubleshooting Steps non-the-less: specifically, deactivating non-theme-included plugins and any other potential customizations. 

    From there, you're welcome to provide a temp login (as a private response) and I'd be happy to take a look to see if anything jumps out at me. I would essentially login, attempt to alter an option (in the footer to be safe), save, clear cache, etc. while mirroring this on the demo to see if there is some other difference to provide insight into your specific issue.

    To be clear, this is working on the demo, and on my testing environments, and I don't have any other reports of this, so at this time I have to approach this as an isolated incident until I can take a closer look at your setup.

    For example, I've temporarily updated the sub-footer text for the demo to Droid Serif - please check this on your machines to confirm that it's loading: http://polytechnic.themeisland.net

    Side note: The Styles plugin does all of the heavy lifting, the Styles: Polytechnic plugin simply adds the options and css rules based on the Styles plugin. So if there is an issue with the one of these, it's likely to be Styles. I have check their reports, and don't see any issue reported.

    Kind Regards,
    Charles

    Support Policy

    Attached files:  screenshot-polytechnic.themeisland.net-2018-01-03-20-06-31.png

  •   nezzazvoni replied privately
  •  112
    Charles replied

    Hi Karel,

    Thanks for the information.

    I've spent some time looking into this, and even went as far as testing the stock Styles plugin with the Twenty Fifteen theme and Styles: Twenty Fifteen plugin (which is supported by this plugin). It seems there is a bug in the actual Styles plugin. I've narrowed down the section of code responsible (https://github.com/stylesplugin/styles/issues/58), but I've read some posts where the author may no longer be supporting this plugin. If that is true, I may need to rip and replace this plugin in all of my themes, or find a solution for this plugin.

    In any case, you can still use this to add font styles pretty quickly, and the font's seem to still be loading on my end using Windows browsers. I'd need to check Mac, but if you are having issues, simply loading the fonts with @import should be fine. Not ideal, but will still work. 

    I'll try to keep you posted with any updates. If you happen to look into the plugin to see where the parsing issue is occurring, I'm all ears. 

    Let me know if that helps, and I appreciate you bringing this to my attention.

    Kind Regards,
    Charles

  • nezzazvoni replied

    Hi,

    yes, the @import is how I solved this issue before and it works fine. It would be just nice to have it all sorted out.

    Please keep me posted. Thanks