Speed booster does not plays well enough for me.
Without it my score is 97 and with it 85!
I’ve got a few questions on Pagespeed that hopefully some of you can answer.
1 – I’m trying to figure out the best way to improve my server response time. It varies anywhere from 0.4 seconds to 0.8 seconds. I upgraded to a Liquidweb SSD VPS with 3 GB of RAM hoping that would take care of it, but it didn’t – it made it through a heavy day of 30,000+ pageviews, but I still can’t seem to get the response time down. I’ve disabled plugins, but to no avail.
2 – I’m running W3 Total Cache along with Tagdiv speedbooster, and I am still getting the render-blocking CSS and Javascript errors. I’m assuming I can edit the plugin file to get rid of these, correct?
3 – I have a pagespeed score of 61 on one of my posts and I believe it’s related to all of the calls to fetch Gravatars for comments. On a page with few comments, the pagespeed score increases. Here’s a screenshot:
Lots of comments (Pagespeed Link):
Few comments (Pagespeed Link):
I would think that the only difference here is all of the external calls to Gravatar. It seems like there has to be a better way to display 200 blank images rather than calling 200 separate URL’s to obtain the same image – Also, Google is complaining that they aren’t “compressed” enough…
Thanks for any help you can offer! I’m hoping to get up to at least upper 70’s or 80 on mobile. I have Adsense, Google Analytics, and Piwik Analytics going so I know that will prevent me from getting too high.
You can use the garavatar caching solutions i mentioned, unless using disqus
You can optimize delivery of google fonts by loading css from your style sheet
Check site with gtmetrix to see what server elements you have not addressed, since you should have at least. 80 if you have setup server side compression and htaccess elements, etc.
Tagdiv speedbooster plugin helps with the js,css stuff.
Sorry, I missed the Gravatar info that appeared before posting. I’m going to look into a way to get a local file instead of the “blank” gravatars from the external site.
Also, Shashank’s site is down to a 66 mobile/90 desktop for me on this page:
http://www.styzic.com/iphone-6-plus-blender-video/872/
It seems like Newspaper is getting hammered a lot more lately on Pagespeed for serving the 700px wide featured image to mobile phones… Any idea if we can get a custom thumbnail for mobile that’s only 300 px wide? I’m sure that would take a lot of work since the mobile site is anything from 240 px all the way up to 767 px…
COPYING THIS FROM OTHER THREAD FOR THOSE WHO HAVE ASKED ME COUPLE OF TIMES ABOUT REMOVING GOOGLE FONTS FROM FUNCTIONS.php … ref: Newspaper 4.2/4.2.2 — not tested with 4.3, but presumably same idea:
————copied from other thread ————–
Hi,
okay I think in 4.2 here is what my edited functions.php looks like
lines 38 -> 59
/* ----------------------------------------------------------------------------
CSS - front end
*/
function td_load_css() {
//google fonts
if ((defined('TD_DEPLOY_MODE') and (TD_DEPLOY_MODE == 'demo' /*or TD_DEPLOY_MODE == 'dev' */)) or defined('TD_SPEED_BOOSTER')) { //on demo and dev we load only the latin fonts
//modify this collection if you want to optimize the fonts loaded
//collection url -> : http://www.google.com/fonts#ReviewPlace:refine/Collection:PT+Sans:400,700,400italic|Ubuntu:400,400italic|Open+Sans:400italic,400|Oswald:400,700|Roboto+Condensed:400italic,700italic,400,700
//wp_enqueue_style('google-font-rest', td_global::$http_or_https . '://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic|Ubuntu:400,400italic|Open+Sans:400italic,400|Oswald:400,700|Roboto+Condensed:400italic,700italic,400,700'); //used on menus/small text
}
//add the google style link for fonts used by user
$td_fonts_css_files = td_util::get_option('td_fonts_css_files');
if(!empty($td_fonts_css_files)) {
wp_enqueue_style('google-fonts-style', td_global::$http_or_https . $td_fonts_css_files);
}
//bootstrap - custom built - it was generated via compilation of /external/bootstrap-master/less/bootstrap.lessYou will note I didn’t remove 44-49, I commented it out with //
I did not remove the code which is there *if* somebody selects fonts from the admin panel, which I think is what you were doing; and then it would crash.
And I DELETED this
$td_user_fonts_list = array();
$td_user_fonts_db = td_util::get_option('td_fonts');
if(!empty($td_user_fonts_db)) {
foreach($td_user_fonts_db as $td_font_setting_key => $td_font_setting_val) {
if(!empty($td_font_setting_val) and !empty($td_font_setting_val['font_family'])) {
$td_user_fonts_list[] = $td_font_setting_val['font_family'];
}
}
}
if(!in_array('g_438', $td_user_fonts_list)) {//'g_438', //Open Sans
wp_enqueue_style('google-font-opensans', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic'); //used on menus/small text
}
if(!in_array('g_617', $td_user_fonts_list)) {//'g_617', //Ubuntu
wp_enqueue_style('google-font-ubuntu', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700,300italic,400italic,500italic,700italic&subset=latin,cyrillic-ext,greek-ext,greek,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_453', $td_user_fonts_list)) {//'g_453', //PT Sans
wp_enqueue_style('google-font-pt-sans', td_global::$http_or_https . '://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic&subset=latin,cyrillic-ext,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_445', $td_user_fonts_list)) {//'g_445', //Oswald
wp_enqueue_style('google-font-oswald', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Oswald:400,300,700&subset=latin,latin-ext'); //used on content
}
if(!in_array('g_521', $td_user_fonts_list)) {//'g_521', //Roboto
wp_enqueue_style('google-roboto-cond', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400italic,700italic,400,300,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_639', $td_user_fonts_list)) {//'g_639', //Vollkorn
wp_enqueue_style('google-vollkorn', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Vollkorn:400italic,700italic,400,700'); //used on quoates classic
}
}
I try to add some cache to my site. Using QUICK CACHE or WP FASTEST CACHE i get 42/100 on mobile and 50/100 on desktop on both, and without cache plugin too on google page speed test.
adding
add_filter( ‘jpeg_quality’, create_function( ”, ‘return 50;’ ) );
in functions.php as recommended i get.
Parse error: syntax error, unexpected T_LNUMBER in /home/site/public_html/wp-content/themes/Newspaper/functions.php on line 1553
So I installed W3 total cache.
Following the video from anterior posts https://www.youtube.com/watch?v=u0G6pk2mX4M when i enable minify with newspaper 4.4 i get blanc page. Hard times today… with only page cache from W3 I still have 49 / 100 … pff.
I disabled W3, installed speed-booster-pack.2.6 adn disabled td-speed-booster. Like in the video, when I activate Load CSS asincronius and I load site… guess what. Problems. Is loading with tabs list or something, can’t explain, and then loads. Issue anyway… will try more settings.
I don’t think Google wants us to have awful image quality on our sites. I think they just want images to be as small as they can be at their current quality and sized correctly for the display device.
For example, the theme is serving 700 pixel wide images on smartphones where the viewport is 320 css pixels, which Google doesn’t like.
The other thing they don’t like is having wasted bytes in an image. I am compressing all of my images at JPEG quality 90 in pixelmator. I then run them through JPEGOptim, jpegtran, and jpegrescan at a quality of 90 and the file size drops by about half. Then I upload them and Google tells me they can still be a few KB smaller… I don’t care about that so much as I care about serving the wrong dimension of thumbnails to visitors.
I wish the theme made different thumbnails for iPad landscape, iPad portrait, and mobile phone so that we wouldn’t be serving oversized images, which Google hates, take a look at the image below:
When I had the retina plugin enabled for mobiles, it was trying to serve a 1490×966 image on the mobile phone. I had to disable that plugin for mobiles, because newspaper is delivering an image larger than a standard 2x retina image for all mobile phones regardless of whether or not they have the pixels to display the entire image.
I guess I’ll focus on the other things I can do something about, but I wish this would be addressed in a theme update if it’s possible with the bootstrap framework…
@Christopher – What php are you running? I’m using suphp and it is incompatible with eaccelerator. Do you think that I would get much of an improvement if I switched to DSO? Liquidweb is willing to do this for me, and they said they could revert back if there’s any problems.
I’m wondering if you think I would gain much in terms of server response time, or if I should just leave well enough alone. My server response time is usually around 500 ms, which Google seems to not like…
@tcdraper
we’re running PHP Version5.4.22; apache, centos 6x, plesk/parallels, all the built in modern accelerators, apc/memcache, mod_pagespeed, and just last night got “mod_spdy” working on Plesk, which was fun since my data folk had never done it before and was team effort.
We’re right now (literally) working to connect mod_pagespeed to SPDY properly so we can have mod_pagespeed load and compress/cache images and other https elements when the pages are loaded 100% https.
Not using Amazon S3 CDN at moment as I can’t mentally deal with the sharding setup when all of us working on this project have never done this before and there is *NOT* a simple “how to” book on this!
I think we were getting something like 330 msec or something, and Google thinks initial response should be under 200-300. (Sigh.) We have a 300kb static page with 10 elements loading dynamically via server side includes in 1.3 seconds total, and pagespeed of 96 without CDN or caching application, and that’s not good enough? BAH!
So, far the https optimizations built into server seem to work fine for desktop, lose a point, page load goes from 1.4 to 1.5 seconds total. So, will be testing that with mod_spdy active, and then with mod_spdy PLUS mod_pagespeed to see if we can enhance the times overall.
ANyway… kind of rambling there. No real advice for you. We have a dedicated multicore XEON server, 32GB RAM, with its own gigabit switch so we don’t have to deal with a lot of the shenanigans of VPS and shared hosting. But, $650/mo. isn’t exactly cheap, either.
That wasn’t a very good answer, was it ? 🙂
@tcdraper
the general reason themes don’t make multiple thumbnails for the sizes you’re talking about, is that when an iPad changes from portrait to landscape it’s not technically reloading the page, just refreshing the viewport and the cached stylesheet is applied; otherwise it would be *worse* for mobile since the images would need to actually be reloaded — ever carry an iPad across the room in unlock mode and have it flip back and forth from portrait to landscape; well, you’d be reloading the images in different sizes more than once.
So, one aspect of “responsive” design (good and bad), is that it’s better to load a 25kb image once than load the 25kb image once and the 12kb image together and switch those out on viewport. Better to load the 25kb image ONCE, then resize to fit the aspect you’re looking at when you look at it.
The other benefit of using the larger image is for retina/HD displays on a mobile device which have higher pixel count than desktop; so again, if you do the pixel math, a 700×500 image on a screen with double the pixel count, loaded half size, would still provide the same number of pixels when shown half size — without having to load alternate retina/HD version of image or use “image stacks.”
This is actually one of the cool things about mod_pagespeed … if you have an image loading over and over at 80% size, it will cache the image at THAT SIZE and serve up the smaller image to people who keep requesting it vs loading the larger image and scaling it.
That was mostly anecdotal … but just some techie crap in case you were curious 🙂
That was a great answer! It makes my 3GB SSD server with 2 cores look like a slowpoke.
I think Google thinks anything above a 70 score is pretty good, and they are just nitpicking when you get up in the 90’s. Sounds like you have a pretty intense job with that server – good luck!
This is actually one of the cool things about mod_pagespeed … if you have an image loading over and over at 80% size, it will cache the image at THAT SIZE and serve up the smaller image to people who keep requesting it vs loading the larger image and scaling it.
So let’s say an iPhone is requesting that 745 pixel wide image, with mod_pagespeed, it will know that the iPhone can only display a 640 px wide image and then serve it a new thumbnail?
That’s pretty cool if true. Thanks!
Well, basically it is serving up an image at smaller size and so caches the “scaled” size as part of the “rewrite” images module.
Sometimes it doesn’t work if the optimized image would be larger in size than the original, which is funny since I usually optimize stuff very much in the extreme.
But:
ModPagespeedEnableFilters resize_images
This attempts to resize any image that is larger than the size called for by the width= and height= attributes on the tag or an inline style= attribute. The original image is replaced only if the image file is smaller after resizing. Image resizing is lossy by nature, regardless of image file format.
Note: It also strips color profiles and metadata even if strip_image_color_profile and strip_image_meta_data are disabled.
Note: If both resize_images and resize_rendered_image_dimensions are enabled then resize_rendered_image_dimensions takes precedence.
Partnered with:
ModPagespeedEnableFilters insert_image_dimensions
This flag inserts width= and height= attributes into tags that lack them and sets them to the image’s width and height. Note that this can cause image stretching or shrinking if CSS rules specify only one image dimension (see Risks below).
So, one of those things to play with for super advanced users, like removing width=500 height=375 and simply using style=”width:90%;height:auto” can do some interesting things.
Eventually this stuff will be built in to everything, since rewrites on the fly solve numerous responsive design issues.
AND: we just now got mod_spdy and mod_pagespeed working together!!!! WOOHOOOOO!!! Doom will ensue! (kidding)
So, one aspect of “responsive” design (good and bad), is that it’s better to load a 25kb image once than load the 25kb image once and the 12kb image together and switch those out on viewport. Better to load the 25kb image ONCE, then resize to fit the aspect you’re looking at when you look at it.
I agree it’s best to load the image only once. All I’m saying (and is what I believe Google Pagespeed is saying) is that we should request the version of the image that is best fit to the screen at it’s current orientation, and then if the device changes the viewport, the image will be resized locally, which is essentially what newspaper does now at a certain level.
For example, if I load my homepage and resize the browser window down to 767 pixels, I see this image which is only 326px wide being displayed at over 700 px wide WITHOUT reloading the image, as seen in the screenshot below, second image down:
Does that make sense? If someone really was bothered by the pixelated images, they’d probably realize that they could simply re-orient their device to how they loaded the page or simply reload the page. It seems terribly inefficient to me to have every single person download a high-resolution image on the off-chance that they will flip from portrait to landscape while viewing the page…
The other benefit of using the larger image is for retina/HD displays on a mobile device which have higher pixel count than desktop; so again, if you do the pixel math, a 700×500 image on a screen with double the pixel count, loaded half size, would still provide the same number of pixels when shown half size — without having to load alternate retina/HD version of image or use “image stacks.”
I agree, it does look nice on “Retina” phone screens, which is why I disabled my retina plugin on mobile devices. I think it would simply be a better solution to have Newspaper serve a 300 px wide image, and then allow the retina plugin to substitute the @2x version, rather than serving everyone the hi-res image.
Doesn’t that seem more efficient?
Still cracks me up that response time of 0.22 seconds is “slow” …. sheesh.
As to the “most efficient” way to load the images; you’d have to play with that yourself and figure out what works the best for “all uses” … I don’t know how much of a tradeoff it would be to have to constantly do if/then loading of different images based on the mobile size with gallery type layouts. Lot of queries.
But, my personal thing would be to actually turn off the images for mobile except for the single featured image on the page, and for home page just show tiny thumbnails 100×100 or whatever for the list of stories.
So, on posts you’d see ONLY the single small 300px image and no other images, much like the Apple “reader” mode except with a single image (featured image).
I never test speed of “home page” as that isn’t relevant for most SERPS anyway, since the content is changing and you want your posts found under the topics not the home page anyway.
Eliminate render-blocking JavaScript and CSS in above-the-fold content
Your page has 6 blocking CSS resources. This causes a delay in rendering your page.
None of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.
Optimize CSS Delivery of the following:
http://fonts.googleapis.com/…-ext,greek,vietnamese,latin-ext,cyrillic
http://fonts.googleapis.com/…c-ext,greek-ext,greek,latin-ext,cyrillic
http://fonts.googleapis.com/…et=latin,cyrillic-ext,latin-ext,cyrillic
http://fonts.googleapis.com/…swald:400,300,700&subset=latin,latin-ext
http://fonts.googleapis.com/…-ext,greek,vietnamese,latin-ext,cyrillic
http://fonts.googleapis.com/…ily=Vollkorn:400italic,700italic,400,700How To fix this ?
Yes, you need to load the google fonts css at end of your style.css file and remove calls to google from your functions.php file
Chris how about this render blocking warning? 🙁
https://developers.google.com/speed/pagespeed/insights/?url=www.styzic.com
Christopher Simmons, and how to do that ?
Google is a great search tool… as this is a common practice easily researched which has nothing to do with this theme. Learning these kinds of tricks is part of basic web development using Google fonts. 😉
However, the basics are
1) search/replace all font mentions in the style.css to use the Google font you wish to use; in my case ‘Open Sans’
2) go to the Google fonts site, and find the font you want in the weights you want, in my case ‘Open Sans’ and get the code from them to place into your website
https://www.google.com/fonts#UsePlace:use/Collection:Open+Sans
in my case, normal, normal italic, bold, bold italic
3) choosing the above gives you code you’d normally place in the head of your web doc, or footer for some setups
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700' rel='stylesheet' type='text/css'>
The above is essentially what the theme loads except has various hooks and functions to let you select those in the admin panel; however you want to actually instead, take that CSS and put at bottom of your own style.css file and it can be done after minification (if you’re doing that) so you don’t minify this code.
So, basically take that URL and open in a web browser; which should download it to your hard drive;
4) then, open that and it will give you the CSS
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans'), local('OpenSans'), url(http://fonts.gstatic.com/s/opensans/v10/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
src: local('Open Sans Bold'), local('OpenSans-Bold'), url(http://fonts.gstatic.com/s/opensans/v10/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
src: local('Open Sans Italic'), local('OpenSans-Italic'), url(http://fonts.gstatic.com/s/opensans/v10/xjAJXh38I15wypJXxuGMBobN6UDyHWBl620a-IRfuBk.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'), url(http://fonts.gstatic.com/s/opensans/v10/PRmiXeptR36kaC0GEAetxjqR_3kx9_hJXbbyU8S6IN0.woff) format('woff');
}
PLACE the above, or comparable code for the fonts you’re using, into bottom of your CSS file. If you’re running your site as https, then change URL to https.
5) using the info from my previous post in this thread; remove the section in the functions.php file which loads the Google fonts – so the old “calls” to the Google fonts won’t “print” on your HTML pages.
6) finally, if necessary, make sure you have all the font selections in the theme panel set to “default” as choosing any Google font won’t work, obviously
And obviously you would want to ensure your caching is off, mod_Pagespeed is ‘off’ if using that, and you’d likely need to clear your cache in your web browser and hit refresh couple of times to see the site properly with the change.
Kaboom! Mischief managed.
How do I know what font I am using ?
I found the code. What to do here, to remove the fonts I don’t use ?
/* ----------------------------------------------------------------------------
CSS - front end
*/
function td_load_css() {
//google fonts
if ((defined('TD_DEPLOY_MODE') and (TD_DEPLOY_MODE == 'demo' /*or TD_DEPLOY_MODE == 'dev' */)) or defined('TD_SPEED_BOOSTER')) { //on demo and dev we load only the latin fonts
//modify this collection if you want to optimize the fonts loaded
//collection url -> : http://www.google.com/fonts#ReviewPlace:refine/Collection:PT+Sans:400,700,400italic|Ubuntu:400,400italic|Open+Sans:400italic,400|Oswald:400,700|Roboto+Condensed:400italic,700italic,400,700
wp_enqueue_style('google-font-rest', td_global::$http_or_https . '://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic|Ubuntu:400,400italic|Open+Sans:400italic,400|Oswald:400,700|Roboto+Condensed:400italic,700italic,400,700'); //used on menus/small text
} else {
$td_user_fonts_list = array();
$td_user_fonts_db = td_util::get_option('td_fonts');
if(!empty($td_user_fonts_db)) {
foreach($td_user_fonts_db as $td_font_setting_key => $td_font_setting_val) {
if(!empty($td_font_setting_val) and !empty($td_font_setting_val['font_family'])) {
$td_user_fonts_list[] = $td_font_setting_val['font_family'];
}
}
}
if(!in_array('g_438', $td_user_fonts_list)) {//'g_438', //Open Sans
wp_enqueue_style('google-font-opensans', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic'); //used on menus/small text
}
if(!in_array('g_617', $td_user_fonts_list)) {//'g_617', //Ubuntu
wp_enqueue_style('google-font-ubuntu', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700,300italic,400italic,500italic,700italic&subset=latin,cyrillic-ext,greek-ext,greek,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_453', $td_user_fonts_list)) {//'g_453', //PT Sans
wp_enqueue_style('google-font-pt-sans', td_global::$http_or_https . '://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic&subset=latin,cyrillic-ext,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_445', $td_user_fonts_list)) {//'g_445', //Oswald
wp_enqueue_style('google-font-oswald', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Oswald:400,300,700&subset=latin,latin-ext'); //used on content
}
if(!in_array('g_521', $td_user_fonts_list)) {//'g_521', //Roboto
wp_enqueue_style('google-roboto-cond', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400italic,700italic,400,300,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_639', $td_user_fonts_list)) {//'g_639', //Vollkorn
wp_enqueue_style('google-vollkorn', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Vollkorn:400italic,700italic,400,700'); //used on quoates classic
}
}
//add the google style link for fonts used by user
$td_fonts_css_files = td_util::get_option('td_fonts_css_files');
if(!empty($td_fonts_css_files)) {
wp_enqueue_style('google-fonts-style', td_global::$http_or_https . $td_fonts_css_files);
}
//bootstrap - custom built - it was generated via compilation of /external/bootstrap-master/less/bootstrap.less
wp_enqueue_style('td-bootstrap', get_template_directory_uri() . '/includes/wp_booster/external/bootstrap/td-bootstrap.css', '', TD_THEME_VERSION, 'all' );
//main theme style - set the TD_DEBUG_USE_LESS flag in /includes/app/td_config.php and the theme will load the less files and compile them for you
if (TD_DEBUG_USE_LESS) {
wp_enqueue_style('td-theme', get_template_directory_uri() . '/td_less_style.css.php', array('td-bootstrap'), TD_THEME_VERSION, 'all' );
//wp_enqueue_style('td-theme', get_template_directory_uri() . '/style.less', array('td-bootstrap'), TD_THEME_VERSION, 'all' );
} else {
wp_enqueue_style('td-theme', get_stylesheet_uri(), array('td-bootstrap'), TD_THEME_VERSION, 'all' );
}
}
add_action('wp_enqueue_scripts', 'td_load_css');
If I remove as you mentioned above
$td_user_fonts_list = array();
$td_user_fonts_db = td_util::get_option('td_fonts');
if(!empty($td_user_fonts_db)) {
foreach($td_user_fonts_db as $td_font_setting_key => $td_font_setting_val) {
if(!empty($td_font_setting_val) and !empty($td_font_setting_val['font_family'])) {
$td_user_fonts_list[] = $td_font_setting_val['font_family'];
}
}
}
if(!in_array('g_438', $td_user_fonts_list)) {//'g_438', //Open Sans
wp_enqueue_style('google-font-opensans', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic'); //used on menus/small text
}
if(!in_array('g_617', $td_user_fonts_list)) {//'g_617', //Ubuntu
wp_enqueue_style('google-font-ubuntu', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700,300italic,400italic,500italic,700italic&subset=latin,cyrillic-ext,greek-ext,greek,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_453', $td_user_fonts_list)) {//'g_453', //PT Sans
wp_enqueue_style('google-font-pt-sans', td_global::$http_or_https . '://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic&subset=latin,cyrillic-ext,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_445', $td_user_fonts_list)) {//'g_445', //Oswald
wp_enqueue_style('google-font-oswald', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Oswald:400,300,700&subset=latin,latin-ext'); //used on content
}
if(!in_array('g_521', $td_user_fonts_list)) {//'g_521', //Roboto
wp_enqueue_style('google-roboto-cond', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400italic,700italic,400,300,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_639', $td_user_fonts_list)) {//'g_639', //Vollkorn
wp_enqueue_style('google-vollkorn', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Vollkorn:400italic,700italic,400,700'); //used on quoates classic
}
}I get
Parse error: syntax error, unexpected $end in /home/site/public_html/wp-content/themes/Newspaper/functions.php on line 1505
You need to *decide* what fonts you wish to use for the theme.
If all of this is beyond you, then you can simply stick with the standard font usage as most sites do. What we’re talking about here is somewhat advanced; and if it doesn’t make sense, then you should likely skip this and worry about other necessary site optimizations.
If you look at my code from functions.php in 4.4 version of theme, you will also need to comment out the line that calls the Google fonts (using // ):
/* ----------------------------------------------------------------------------
CSS - front end
*/
function td_load_css() {
//google fonts
if ((defined('TD_DEPLOY_MODE') and (TD_DEPLOY_MODE == 'demo' /*or TD_DEPLOY_MODE == 'dev' */)) or defined('TD_SPEED_BOOSTER')) { //on demo and dev we load only the latin fonts
//modify this collection if you want to optimize the fonts loaded
//collection url -> : http://www.google.com/fonts#ReviewPlace:refine/Collection:PT+Sans:400,700,400italic|Ubuntu:400,400italic|Open+Sans:400italic,400|Oswald:400,700|Roboto+Condensed:400italic,700italic,400,700
//wp_enqueue_style('google-font-rest', td_global::$http_or_https . '://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic|Ubuntu:400,400italic|Open+Sans:400italic,400|Oswald:400,700|Roboto+Condensed:400italic,700italic,400,700'); //used on menus/small text
}and I deleted this
$td_user_fonts_list = array();
$td_user_fonts_db = td_util::get_option('td_fonts');
if(!empty($td_user_fonts_db)) {
foreach($td_user_fonts_db as $td_font_setting_key => $td_font_setting_val) {
if(!empty($td_font_setting_val) and !empty($td_font_setting_val['font_family'])) {
$td_user_fonts_list[] = $td_font_setting_val['font_family'];
}
}
}
if(!in_array('g_438', $td_user_fonts_list)) {//'g_438', //Open Sans
wp_enqueue_style('google-font-opensans', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic'); //used on menus/small text
}
if(!in_array('g_617', $td_user_fonts_list)) {//'g_617', //Ubuntu
wp_enqueue_style('google-font-ubuntu', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700,300italic,400italic,500italic,700italic&subset=latin,cyrillic-ext,greek-ext,greek,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_453', $td_user_fonts_list)) {//'g_453', //PT Sans
wp_enqueue_style('google-font-pt-sans', td_global::$http_or_https . '://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic&subset=latin,cyrillic-ext,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_445', $td_user_fonts_list)) {//'g_445', //Oswald
wp_enqueue_style('google-font-oswald', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Oswald:400,300,700&subset=latin,latin-ext'); //used on content
}
if(!in_array('g_521', $td_user_fonts_list)) {//'g_521', //Roboto
wp_enqueue_style('google-roboto-cond', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400italic,700italic,400,300,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic'); //used on content
}
if(!in_array('g_639', $td_user_fonts_list)) {//'g_639', //Vollkorn
wp_enqueue_style('google-vollkorn', td_global::$http_or_https . '://fonts.googleapis.com/css?family=Vollkorn:400italic,700italic,400,700'); //used on quoates classic
}
}
You would still need to search/replace all instances of Google fonts in your style.css as I stated to replace all font stacks with the Google fonts you wish to use. Or, you’d need to look at the fonts in there to use for grabbing the CSS from Google Fonts to put at bottom of your style.css file.
