osompress / simple-social-icons

Plugin: Simple Social Icons
62 stars 33 forks source link

ModSecurity preventing fonts from loading #19

Closed nickcernis closed 9 years ago

nickcernis commented 9 years ago

Some hosts are running a ModSecurity rule that causes font requests to return a 403.

This is happening because the IcoMoon font generator's cache-busting query string begins with a hyphen, which triggers a match against the ModSecurity regex:

@font-face {
    font-family: 'ssi-icomoon';
    src:url('../font/ssi-icomoon.eot?-texv9a');
    src:url('../font/ssi-icomoon.eot?#iefix-texv9a') format('embedded-opentype'),
    url('../font/ssi-icomoon.woff?-texv9a') format('woff'),
    url('../font/ssi-icomoon.ttf?-texv9a') format('truetype'),
    url('../font/ssi-icomoon.svg?-texv9a#ssi-icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

I have reported this to Icomoon (the latest version of their app still uses the same format), but for now it would be worth considering starting the query string with a letter instead. e.g.:

@font-face {
    font-family: 'ssi-icomoon';
    src:url('../font/ssi-icomoon.eot?ssi-texv9a');
    src:url('../font/ssi-icomoon.eot?#iefix-texv9a') format('embedded-opentype'),
    url('../font/ssi-icomoon.woff?ssi-texv9a') format('woff'),
    url('../font/ssi-icomoon.ttf?ssi-texv9a') format('truetype'),
    url('../font/ssi-icomoon.svg?ssi-texv9a#ssi-icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}
nickcernis commented 9 years ago

IcoMoon just replied to say they've patched this issue, so future font stylesheets we generate won't trigger ModSecurity rules.

nathanrice commented 9 years ago

Do we need to regenerate the icons and push out an update?

bgardner commented 9 years ago

If so, I think @rafaltomal is the man to do it.

rafaltomal commented 9 years ago

I think @nickcernis can handle it since he updated the plugin with IcoMoon.

nickcernis commented 9 years ago

Since we haven't added any new icons, I've just updated the plugin's stylesheet to work around the ModSecurity glitch, rather than regenerating the fonts too. Hope that's okay.

The same fix worked when tested by a couple of helpful WP.org forum users.

bgardner commented 9 years ago

I think that is ok. We should plan to do an update after this with a few more possible icons that I know have been requested. (ie. Periscope, Medium)

nathanrice commented 9 years ago

Also, got a request for Paypal too.

nickcernis commented 9 years ago

Sounds great, @bgardner. I've been logging our most popular requests here and have added @nathanrice's PayPal vote too. A PayPal icon makes sense now they've launched https://www.paypal.me/.

IcoMoon supports importing your own vectors if we want to add anything that isn't available in the popular icon fonts yet (e.g. Goodreads).

bgardner commented 9 years ago

We will need to come up with a better UI, though -- because that widget interface is getting clunky with the social media platforms we already include. Also, in an ideal world, a user would be able to order them on the front end in any way they want, rather than the order we have listed in the interface. Same concept that @NicktheGeek did in Simple Share.