These are actually very close to the same buttons used with the theme for the social sharing buttons without the number/shares info. 🙂
Most folk are just hacking that file in the theme to add more buttons.
I will try it. Thanks!
Well, I’m not doing it on a WordPress site …
here is the basis for what I’m doing on our business site:
(tutorial, one of several out there with this specific code)
http://www.himpfen.com/social-sharing-buttons-bootstrap-font-awesome/
You can see how I’m using that code, slightly tweaked for our site here; scroll to very bottom of page (this is **NOT** using WordPress! — this is hand-built static code, based on Bootstrap 2 for compatibility with old folk running WinXP/IE6-7-8 in addition to all modern browsers):
http://www.send2press.com/services/press_release.shtml
Can you please tell me how to do that? “(I’m now using pure CSS buttons with Font Awesome and works just fine.)”?
-
This reply was modified 11 years by
mehedi.
As to social buttons, I’m actually favoring this layout at top of posts on CNET, as an example of “nicely done” …
http://www.cnet.com/news/mozilla-expands-advertising-experiment-to-many-more-firefox-users/
That code actually ended up being a bit “weird” with Bootstrap, as I tried implementing it on another site and it failed to work consistently. I’m now using pure CSS buttons with Font Awesome and works just fine. The responsive problem was conflict with bootstrap code, etc. (This theme also has bootstrap 3 in its DNA.)
Also, remember Ridiculously Responsive Social Sharing Buttons? There is a plugin for WordPress now, it looks great on Newspaper theme but it looks a bit messy..?
I would likely start with the big one (130kb?). Obviously the small ones likely don’t need it. Ideally, go by the list of “recommended minify javascript” from doing GTMetrix scan for a good pointer as to which actually need to be minified or not. I’d also likely test one at a time to make sure nothing breaks.
Hi Christopher,
I minified style.css with that website before. Shall I minify all of the JS on the /js folder?
Hi, Mehedi
I usually try to use the js and css minifier links I’ve posted couple of times in the pagespeed topic …
You can also “try” to use the GTmetrix optimized versions they do for you, but I usually only minify the main couple of files (don’t recall which ones at the moment)…
You can try these
http://javascript-minifier.com/
I use the CSS one all the time.
Hi
I got 90 on desktop and 64 on mobile for my page speed of my site. I know there is lots of tips on the Pagespeed topic but I couldn’t figure out how to minify JS the right way so that it doesn’t break the slider and other JS of the theme.
@christopher , I know you might know how to fix it. So, please help.
Hi,
First of all please make sure you have activated this feature from Theme Panel, like this: http://screencast.com/t/ecSgkbolvD2
Second please try to disable all plugins leaving enable only those the theme recommends and check if the sticky menu starts working.
Also make sure you disable Cloudflare rocket loader and JS Minify if you are using.
Hope this helps!
Thanks
Nope, disabling Rocket Loader and JS minify in cloudflare solves it 🙂
Works fine for me – http://www.droidgobl.in/2014/08/09/review-nuggets-icon-pack-by-mindplay-media/
If you’re using Cloudfare, make sure to disable Rocket loader and JS minify.
Yup, had done that. Both rocket loader and js minify have to be turned off.
thank you – I’ll do that.
After all, I’m fed up with all this, will try to optimize these last things (best as I could p.e minify the main css) and then focus on another things. (as you maybe notice I’m to focused in that)
sorry for all my questions by the way. I’m pretty new to this.
Hi Cherry
you might want to keep ONE thread, vs starting three or more regarding your site and pagespeed. Basically if you get all the things updated already covered in your other two threads, then mobile speed will also increase.
Again, as I’ve noted previously, you can’t do anything about the external ads being served which impact speed. Not sure how you’re loading ads on a demo site anyway, frankly. You should turn ads OFF for testing your “actual” speed. So the “errors” for mobile for the javascript and images from Google ads and advertisement browser caching, are impacting your score but nothing you can address and are false positives vis a vis the site and theme.
You *can* minify the main .css file which is showing as NOT minfied, as we’ve already covered in your prior threads.
Minifying http://cherrykoks.de/…ntent/themes/Newspaper/style.css?ver=4.1 could save 7.1KiB (16% reduction) after compression.
And basically don’t use contact form 7 unless you actually need it. Since you don’t have a live site, why would you need somebody to contact you anyway at this stage of your playing with the theme and setup without actual content. If you’re planning to use that, then you could presumably add its css to bottom of the main style.css, then hack the plugin to not write its own CSS into the head of the theme; or this would be example of where — as you’d asked elsewhere — you would add the plugin to the speedbooster plugin code to get it dumped at bottom of theme and optimized.
And remember best to test a post page for score not home page, since most people do NOT land on a site home page, but “surf in” to content from a social media link/share, or search result page, etc. — home page will always be a trickier prospect since it’s not indicative of the rest of the site, using sliders, modules, more photos, ajax loads, etc.
Also be aware you cannot get a 100/100 score with a WordPress site running numerous photos, plugins, ads, social media hooks, etc. Only people who have accomplished this have done custom sites without images, using CDN, and custom coding to maximize above the fold content load separate from below the fold content.
If you get above 80 on mobile and above 90 on desktop, you can really get on with your life and worry about content and marketing.
-
This reply was modified 11 years by
simchris.
Problem solved.
Conclusion: Cloudflare rocket loader and JS Minify doesn’t work together with several Newspaper theme options like images, sticky menu and mobile menu.
Thanks for your support!
JB
Problem solved.
Conclusion: Cloudflare rocket loader and JS Minify doesn’t work together with several Newspaper theme options like images, sticky menu and mobile menu.
Thanks for your support!
JB
You shouldn’t need to minify the css file again, if you’ve cleared the cache on your CDN so that people are loading the new minified version vs the old non-minified version. Easy to test, point your browser at the file and download to see if it’s the right one being served.
One of the items in your GTMetrix report (click the little arrows to expand each item), shows this:
•http://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?ver=4.1
Basically if you download that file and add it to the end of your style.css file, then remove the above code from your pages, you remove that issue reported in GTMetrix.
Also, I’m assuming you’ve not updated everything since the ?= versioning was still showing.
•http://cherrykoks.de/wp-content/plugins/contact-form-7/includes/css/styles.css?ver=4.1
•http://cherrykoks.de/wp-content/themes/Newspaper/includes/wp_booster/external/bootstrap/td-bootstrap.css?ver=4.1
•http://cherrykoks.de/wp-content/themes/Newspaper/style.css?ver=4.1
ALSO: I don’t know why your posts have weird td-slug stuff vs the filenames based on pretty permalinks. That is so NOT normal, btw. Be sure to check your htaccess file to see that the block for your pretty permalinks is in there (or just resave your permalinks in wordpress general settings – and it will tell if you if the file is writable).
Do you think I should minify my “minified” stylesheet again, because insight is still complaining about that.
For the Google fonts item …
there is one trick I did, which is download that style sheet from Google being loaded for your pages, copy/paste the CSS from that file and put at bottom of your style sheet, and delete loading the Google fonts (I think you can comment that out in the functions.php file); this way the CSS is loaded as part of YOUR style sheet and NOT being loaded from Google. This saved me couple of points as one less download, and no worries about expirations or minification for the Google CSS for the fonts.
Google Fonts?
Which file should I download from where?
Sorry didn’t get that 😀
There are 4 components that can be minified
inline <script> tag #5
inline <script> tag #9
inline <script> tag #15
inline <script> tag #19
Do you know where I can find these?
Hi @nihar105479, With the last 2 changes I found the best way to resolve all issues with cloudflare was to do a full cache purge in the settings. I then had to do a full purge on the browsers including your mobile devices, sometimes twice.
Another thing I did was under Performance settings I made sure under “Auto Minify (Web optimization)” that JS was de selected. Its better to adjust this through the booster or other plugins mentioned by others.
-
This reply was modified 12 years by
Peter.
yeah thank you for this btw…
p.e
<img width="300" height="100" class="td-retina-data" data-retina="http://cherrykoks.de/wp-content/uploads/2014/08/log600.jpg" src="http://cherrykoks.de/wp-content/uploads/2014/08/log300opt.jpg" alt="CK LOGO "
Did I do this right- by writhing the height directly after width?
The Queries:
well actually I added a code via plug “Code Snippets” like this:
function remove_cssjs_ver( $src ) {
if( strpos( $src, ‘?ver=’ ) )
$src = remove_query_arg( ‘ver’, $src );
return $src;
}
add_filter( ‘style_loader_src’, ‘remove_cssjs_ver’, 10, 2 );
add_filter( ‘script_loader_src’, ‘remove_cssjs_ver’, 10, 2 );
before I included this – I had this code inside functions.php
/** Remove Query strings from Static Resources. */
function _remove_script_version( $src ){
$parts = explode( ‘?’, $src );
return $parts[0];
}
add_filter( ‘script_loader_src’, ‘_remove_script_version’, 15, 1 );
add_filter( ‘style_loader_src’, ‘_remove_script_version’, 15, 1 );
<?php
}
add_action(‘print_media_templates’, ‘td_change_backbone_js_hook’);
Should I use one of this or use a plugin?
Minify: yeah have seen had, but don’t know how to do (again: I’m no programmer and I don’t know css oder js )
my Cloudflare should originally do this (installed today- will take some time) Will this be enough? (or got an idea for dizzy blondes? 😀
Will have to change all this on the weekend…sadly I like the slider, looks good, but if its causing all the problems … 🙁
-
This reply was modified 12 years by
Cherry. Reason: added
Hi, I wouldn’t worry about those two images which are sized with CSS, as they may technically be false positives on GMetrix. Google doesn’t advise you about that, so the fact you have 92 desktop with the ads and fonts “on” isn’t too shabby.
I’d focus more on removing the versioning queries on stuff (blah?=version4.1) which can be done by editing functions.php file, or some plugin might help. I’d also minify the css and java that google recommends here:
https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fcherrykoks.de%2F&tab=desktop
Minifying http://cherrykoks.de/…ntent/themes/Newspaper/style.css?ver=4.1 could save 8.3KiB (19% reduction) after compression.
As a perfect example of how imperfect this adventure is, you’ll note most of the “errors” come from Google’s universe and not your site !
Turn off the revolution slider plugin if not using it, since it adds the two CSS style sheets Google cautions about, and recommends combining.
Most important however is your mobile score which is 75; and you want that 80 or higher. Right now the revolution slider CSS is hurting that, along with one image you uploaded which is not well optimized.
Compressing and resizing http://cherrykoks.de/…wp-content/uploads/2014/08/3-745x483.jpg could save 108.6KiB (87% reduction).
-
This reply was modified 12 years by
simchris.
ok now we have this right here:
http://www.screencast.com/t/o07TJqlhsflZ
is the IP correct?
Also edited the priority on cpanel to 0
by the way: didn’t choose fully optimization because of the Javascript Minify….
the documentation says: no js minfier
-
This reply was modified 12 years by
Cherry.