Search Results for 'amp'

HI folks … as I’m about to be enmeshed in a highly complex project for my own company, I won’t have *any* time to post “pay it forward” help around here anymore, but I thought I’d share one last thing for now — which I’d promised to do, and I just did in another post on this topic …

this is “broad strokes” on how to optimize the font loading for using Google fonts, such as OpenSans for your site; to not load the remote style sheet from Google and solve one of the issues from optimization testing related to Google fonts. This might even gain you a point in some cases!

———– SNIP————-

The theme does not load fonts via functions.php; but from the MAIN functions file used by the theme inside the /includes folder as I noted.

The following would be how we do it, in broad strokes — with idea of using OpenSans, removing roboto, and loading the CSS locally for OpenSans vs remotely.

Anybody planning to hack the theme in *any* way should explore the files in there to see what is going on with the theme.

So, to wit
theme/includes/td_wp_booster_functions.php

see around line 1318 – 1340

helps to use a proper text editor (I used “TextPad” on Windows, BBEdit on Mac).

I have not done this in awhile, but as I’m no longer going to be around here to help out, needing to move onto other things I’ll try to provide a starter point for you.

I believe I removed the whole Google fonts section; or perhaps only left in the first section as it caused error to remove it all.

————-

Next you need to search/replace any instance of Roboto from your style.css ; change the default fonts to OpenSans as you won’t be using the control panel to select it anymore.

————

‘capture’ the CSS from Google; presumably those of you who are new to HTML, webdev, etc., likely don’t understand what is going on with CSS (cascading style sheet) and how fonts are loaded.

So, basically when you “request” the fonts from Google using their API, you’re not loading the fonts, you’re loading a style sheet on their server, which in turn loads the fonts — a redirect of sorts. And this does show up as “something to fix” when doing optimization tests.

So, an old trick most of learned in the olden days of hand coding our websites from scratch is that you can put that API link into a browser window, or email it to yourself as a link also works …

Put another way if you were to go to the Google font repository, or look at the theme code, you end up with their API call, which looks something like this:

://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic

Now if you know what you’re doing, again, you can put that URL into a browser window and it will spit out the actual “what is being loaded from that URL” … which actually looks like this:

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(http://fonts.gstatic.com/s/opensans/v13/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}
@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/v13/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(http://fonts.gstatic.com/s/opensans/v13/MTP_ySUJH_bn48VBG8sNSnhCUOGz7vYGh680lGh-uXM.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/v13/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}

that is the actual CSS being loaded .. and you can put this at the bottom of your style.css file to load the fonts from your own style sheet vs loading their style sheet remotely.

So, if you combine the three things
a) search/replace your /theme/style.css to make OpenSans your default font; remove Roboto
b) remove the section in the theme main config file so that it’s NOT loading the remote style sheets
c) put your captured CSS from Google at bottom of YOUR /theme/style.css
d) there may be one instance of roboto somewhere else in the admin code files, but I forget where that is at the moment (sorry)
e) while it should be self-evident — if your site is https; change the http in above to https.

Then you have saved the redirect of the extra style sheet being loaded from Google’s server.

You can modify this procedure to use different fonts, or multiple fonts. Just setup the fonts you want on Google’s font site, get the embed code; then “capture” the actual CSS.

Try it 🙂

• This reply was modified 11 years by simchris.

The theme does not load fonts via functions.php; but from the MAIN functions file used by the theme inside the /includes folder as I noted.

The following would be how we do it, in broad strokes — with idea of using OpenSans, removing roboto, and loading the CSS locally for OpenSans vs remotely.

Anybody planning to hack the theme in *any* way should explore the files in there to see what is going on with the theme.

So, to wit
theme/includes/td_wp_booster_functions.php

see around line 1318 – 1340

helps to use a proper text editor (I used “TextPad” on Windows, BBEdit on Mac).

I have not done this in awhile, but as I’m no longer going to be around here to help out, needing to move onto other things I’ll try to provide a starter point for you.

I believe I removed the whole Google fonts section; or perhaps only left in the first section as it caused error to remove it all.

————-

Next you need to search/replace any instance of Roboto from your style.css ; change the default fonts to OpenSans as you won’t be using the control panel to select it anymore.

————

‘capture’ the CSS from Google; presumably those of you who are new to HTML, webdev, etc., likely don’t understand what is going on with CSS (cascading style sheet) and how fonts are loaded.

So, basically when you “request” the fonts from Google using their API, you’re not loading the fonts, you’re loading a style sheet on their server, which in turn loads the fonts — a redirect of sorts. And this does show up as “something to fix” when doing optimization tests.

So, an old trick most of learned in the olden days of hand coding our websites from scratch is that you can put that API link into a browser window, or email it to yourself as a link also works …

Put another way if you were to go to the Google font repository, or look at the theme code, you end up with their API call, which looks something like this:

://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic

Now if you know what you’re doing, again, you can put that URL into a browser window and it will spit out the actual “what is being loaded from that URL” … which actually looks like this:

@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: local('Open Sans Light'), local('OpenSans-Light'), url(http://fonts.gstatic.com/s/opensans/v13/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}
@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/v13/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(http://fonts.gstatic.com/s/opensans/v13/MTP_ySUJH_bn48VBG8sNSnhCUOGz7vYGh680lGh-uXM.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/v13/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}


that is the actual CSS being loaded .. and you can put this at the bottom of your style.css file to load the fonts from your own style sheet vs loading their style sheet remotely.

So, if you combine the three things
a) search/replace your /theme/style.css to make OpenSans your default font; remove Roboto
b) remove the section in the theme main config file so that it’s NOT loading the remote style sheets
c) put your captured CSS from Google at bottom of YOUR /theme/style.css

Then you have saved the redirect of the extra style sheet being loaded from Google’s server.

You can modify this procedure to use different fonts, or multiple fonts. Just setup the fonts you want on Google’s font site, get the embed code; then “capture” the actual CSS.

Try it 🙂

Hi

You can do that by setting a featured image and using the post template: style 6 like here: http://screencast.com/t/DTQ2F0i6Z
The result should be like here: http://demo.tagdiv.com/newsmag/td-post-kendall-jenner-strips-for-love-magazine/
The theme doesn’t have an option to display full width images in post content, just featured image like in the above example.

Thanks!

Hi

From this version speed booster plugin is automatically disabled as it is tested and it works fine with some recommended plugins. A lot of people install the plugin without knowing what it does and after that they add many plugins and some of the plugins are not written ok. For example some of the plugins do not respect the google pagespeed recommendations of punting javascript at the end of the page and they just try to use jQuery in the middle of the page. If you want to always enable speed booster, delete this code from speed booster file: http://screencast.com/t/RZLIOPUNdqh

Thanks!

• This reply was modified 11 years by Andrei L..
• This reply was modified 11 years by Andrei L..

From Google support forum telling us that there is a problem here -> https://productforums.google.com/forum/?utm_medium=email&utm_source=footer#!msg/webmasters/sSEyv–7kkw/muCKI1CiqWEJ

In this line ->

<time itemprop=”dateCreated” class=”entry-date updated td-module-date” datetime=”2015-06-30T11:24:30+00:00″ >30 giugno 2015</time>

What should I change?

You need to put in the correct code for *your* website, not the example you have shown above. use the “code generator” on the page you mention, and review the docs there on how to use it. You need to put in an echo element probably for your current page where the comments live, not the facebook page link you posted above(!).

That code is for THAT page on FB, not YOUR site. The href= needs to be a page on YOUR website.

Note the “code generator” which is intended to … guess what … “generate the code” needed for you to use the element on your own website.

if none of that makes sense to you, then you might want to hire a developer — or look for a plugin which would generate the correct URL for each post to put into that element.

so you would need to (per their instructions)

a) put the java SDK in your header

b) put this in your post template (so if you’re using post template 2, edit the post template file 2 in your theme root directory)

<div class="fb-comments" data-href="[your URL HERE]" data-numposts="5"></div>

You would need to replace [your URL HERE] with an echo current page/post URL element — NOT the Facebook URL, obviously.

—
hope that helped!

Hello Chris

Thanks for your advices.

I change all things your propose to us.

One thing I don’t understand is that in PageSpeed or GT
https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fwww.virtualmagie.org%2F
I always have the cache time end problem.

Here my htaccess content.
There is your code and so all files normaly have to be expired.

Other things :
I have W3 Total Cache but you don’t recomand it.
So I install the ZenCache Pro but it mess the site.
Finaly I used superCache and PHP optimization and compression seems to mess too and I was forced to delete it.
Note that our site is on a dedicated server.
So for waiting I activate the Falcon mode in Wordfence.

#WFIPBLOCKS - Do not remove this line. Disable Web Caching in Wordfence to remove this data.
Order Deny,Allow
#Do not remove this line. Disable Web Caching in Wordfence to remove this data - WFIPBLOCKS
#WFCACHECODE - Do not remove this line. Disable Web Caching in Wordfence to remove this data.
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/css text/x-component application/x-javascript application/javascript text/javascript text/x-js text/html text/richtext image/svg+xml text/plain text/xsd text/xsl text/xml image/x-icon application/json
<IfModule mod_headers.c>
Header append Vary User-Agent env=!dont-vary
</IfModule>
<IfModule mod_mime.c>
AddOutputFilter DEFLATE js css htm html xml
</IfModule>
</IfModule>
<IfModule mod_mime.c>
AddType text/html .html_gzip
AddEncoding gzip .html_gzip
AddType text/xml .xml_gzip
AddEncoding gzip .xml_gzip
</IfModule>
<IfModule mod_setenvif.c>
SetEnvIfNoCase Request_URI \.html_gzip$ no-gzip
SetEnvIfNoCase Request_URI \.xml_gzip$ no-gzip
</IfModule>
<IfModule mod_headers.c>
Header set Vary "Accept-Encoding, Cookie"
</IfModule>
<IfModule mod_rewrite.c>
#Prevents garbled chars in cached files if there is no default charset.
AddDefaultCharset utf-8

Hi

To remove that space follow this solution : http://screencast.com/t/AjtZQEBAKmKk
Result: http://screencast.com/t/aMPflnwX

Thanks!

I don’t use CDN.

Ok so I deactivate all except tagDiv Speed Booster &amp; VC.
After 404 on the post pages, now it is ok for photos on computer and mobile.

I reactivate first WP Retina 2X and photos stop showing on mobile! 🙁

So I reactivate all the other.

Another test in webpagetest.com and it still say that the file your show that is missing.
http://www.virtualmagie.org/wp-content/themes/Newspaper/includes/js_files/td_smooth_scroll.js?ver=6.2
I didn’t touch anything about the theme files!

And I just check your files: in that update there is no more the js_files folder.
So how it is possible my site try to reach it (I find nothing in the htaccess)?

How I could correct that?

Regards

Thanks for the tumb’s reference, which worked out nicely…

All the rest is really very frustrating,

You discontinue updates on a version I bought due to particular features you had and release a newer version that no longer offers the same set of features??

• I followed the steps on that guide you linked too in the first place (removal of the old version + older VC plugin, installation of the newer version &amp; plugins + the update script which led me to this point
• The previous version had some problem with Multilanguage but eventually I found I could rectify any small issue using WPML (which also cost extra) – but made everything work perfectly.
• Old RTL support needed some work on the CSS side – but I also had that fixed rather easily but that’s about it.
• I haven’t done any other unique changes to the old theme 🙁

I can also see the post and the categories in the admin so – the data was not effected it seems like the modules don’t handle the structure in the same way and the fact you say it was rewritten suggests that may be the cause and you may be able to solve this.

Since I don’t have the skills to fix this myself which was the whole point of buying a theme that supported what I needed to begin with – please help me understand if this is something you think you can resolve or I should start looking for another theme?