- NewspaperWP Rocket and Newspaper Theme: Optimization Guide
- TutorialsFrom WPBakery to tagDiv Composer
- TutorialsDefault Block Settings Guide
- TutorialsHow to use custom fonts
Hi,
To increase the font size add this CSS in theme panel -> Custom CSS:
.widget_product_categories {
font-size: 16px;
}
About the icon, i don;t know if can’t be added, that widget is default from woocommerce, only if you edit them. Is not from our theme.
or add that section manualy with image and text+link. in a text widget with HTML
Thanks!
hi,
to move the banner to the left on deskop only use this css :
div.td-a-rec.td-a-rec-id-header.td-rec-hide-on-p {
position: relative;
left: -200px;
}
here: http://screencast.com/t/GifkinW98gw
Thanks for you message.
Radu A.
hi,
try using this css :
div.span8.td-header-style-1 {
position: relative;
top: -10px;
left: 12px;
}
here: http://screencast.com/t/YvpKeqgu
Thanks for you message.
Radu A.
hi,
try using this css to change the color of the date:
.td_data_time{
color: #ff0000;
}
here: http://screencast.com/t/zLGeQV21
Thanks for you message.
Radu A.
HI, Marius
not huge issue as I can fix with CSS.
Just odd.
Note I’m not running any minify stuff, just tagDiv speed booster, along with mod_pagespeed to remove white spaces and remove comments – and cache small images. It’s not doing anything else.
I am using the social media icons top right, and NOT using the login function, which is different from your example, and have the responsive AdSense ads running.
I will upgrade to the latest WP this week and then revisit. 🙂
Usually I am *not* the person with the one in a million gremlin, but this one is mine.
Have a great day!
Hi,
Give me your site URL to check if can be solved via CSS.
Thanks!
Hi,
This is very strange, for me works great. http://screencast.com/t/WEIF7G7Z spped booster ACTIVE, 3.6, WP 3.8.2
When i check the page source you can see the CSS generated by the panel: http://screencast.com/t/XYSiWnM5tpZ
Could be from compression/minify in your case?
hi,
use this css:
.td-tags-and-social-wrapper-box {
text-align: center !important;
}
here: http://screencast.com/t/kxFUGSab
Thanks for you message.
Radu A.
hi,
identify the category: http://screencast.com/t/cQwZXiUqLEN
in this example I use category : documente (id: 236)
then use this css:
.category-236 .entry-date {
display:none;
}
Thanks for you message.
Radu A.
I see the custom typography change menu for ‘Widgets title font’
My problem is I want the text in the widget itself to be the one labelled “Helvetica Neue” near the top of the drop down menu to match the the of the site – is this possible?
Something maybe to replace the ?? here for the custom CSS?
.widget_text a {
?????????????;
}
Minify CSS
Minify JavaScript
Minify CSS
i have done those manually.
will loose all changes soon i update theme/plugins
so ideally will be to have it done automatically ???
is there a way ???
just trying to improve page speed … mobile 58 / desktop 77
thanks
Hi,
I have some adult posts in my site and I must to block Google Ads only on these articles.
My site is about movies, so the block can’t be by category. I think the best way to do this is by tag. My big problem is the Header and Article Ad.
Do you know excerpts or custom CSS to do this?
Regards,
CyberGetro
I would stick with ONLY enabling Page Cache.
And now … my morning soapbox: brought to you by clean living and cute kittens ….
Remember that if you’re using the TagDiv Speed Booster plugin, it is MOVING things around on the page for better performance when the page is loaded. You do not want the dynamic stuff cached or it won’t show updates to things on pages. Your home page would not show new items, categories wouldn’t show new items, sidebars wouldn’t show new, recent, related, etc.
So, you only want to enable the page cache which will basically serve up a snapshot of the page and not the dynamic stuff which is still called via php.
Newspaper type sites are way more complex than say, a blog about raising rabbits on a farm, or a bicycling blog updated once a month. If you have content updated daily, or even hourly, caching can help with speed and limit load on server, but it can be TRICKY to optimize for YOUR particular website, due to how elements are loaded on pages, where they are, what other optimizations are running, etc.
There truly is no “one click” caching option for any busy, complex website. Blogs sure. Complex websites need to be tweaked for advanced tools like caching, just like all the other tweaks not built-in to WordPress, or the theme.
So, for most advanced users, there is trial and error – nothing to do with the theme, and not covered by support team for your particular use.
The theme devs have “recommended” you only use Page Cache, as that is how they achieve their own high speed rating/score.
So, you may wish to
1) fully optimize your site, outside of caching!
2) enable tagdiv speed booster and make sure nothing breaks if you’re using some kind of external plugin which might conflict with the optimizations (on our site the < > arrows disappear in 3.6, with WP 3.8.1; with 3.5 the slide out “you might like” broke) — you have to decide if this is a benefit for you or not; YOU need to test, decide, then either use or not for YOUR particular solution
3) make trusted backups of your site before doing any caching!!
4) enable W3C and use page cache only; test your site — either determine if it works for you or not, and some trade offs, and if there are workarounds for some things like page counters, random or recent dynamic elements, etc. — and there are forum posts on issues other have faced with using specific plugins, or with certain features in use (e.g., JetPack, forms, membership, bbpress, etc.)
5) adjust, test, adjust, test.
If you have no idea how to do any of that you likely would need to hire a developer at an hourly rate. Or, do what most of us do which is trial, error, forums, Google search, test, retest, learn, fail, learn.
The reason there is no simple “how to” for caching, is that there are a hundred things which might be impacted by that if you turn on every option in the theme and load up a dozen external plugins.
In a perfect world, for caching, the average joe might try this:
1) setup the theme with only the basic functions; no special menu, no JetPack, no “counters” for social media reads, one ad management system or AdSense.
2) enable tagDiv Speed Booster BETA plugin to optimize the placement of the CSS, JS components, Google fonts, et al.
3) put in the basic optimizations: a) gzip/deflate at server level, b) htaccess, c) image optimization tweaks (plugin, and/or functions.php mod from my speed posts)
4) W3C or other caching with minimal page caching settings.
5) test site.
6) turn on the “fun” features like megamenu, jetpack, forms, social reads/likes; choose what works; what doesn’t — either find workaround or don’t use.
There is ALWAYS a tradeoff between speed and features. You can’t have 100 add-ons and have the speed of a site with 15 add-ons. So, YOU need to decide if speed vs features matters, or other way around.
Hope that helps somebody!
Copr. © 2014 Christopher Simmons.
-
This reply was modified 12 years by
simchris.
gzip/deflate is managed at the web server level – it needs to be running for your hosting account. This allows the web server to automatically compress everything sent by the web server from your site to the web browser. This alone is good for 20+ points. This is the #1 thing which should be addressed. Ideally your web host should have this on for your account. If they won’t enable it, move to another host who will!
If you look at my posts there is an example of the .htaccess settings that I used for
the “expiration headers”
For images:
1) you need to use a compression plugin, like smush.it or similar (see comments from others in the thread); this will optimize all the thumbs created by WP and the theme
2) upload well compressed images (e.g., 25-40kb max, not 150kb or 700kb — unless you’re doing some kind of photo/portfolio site where quality is first concern)
3) consider changing the compression level by default in WP, which is done in the functions.php file at bottom using the code I’ve suggested in my posts — setting it to something like “60” vs the default “90” (I think), will cut the size of the thumbs by a huge amount.
For my particular brand of magic, try putting this at the end of your .htaccess file:
AddType text/javascript .js
# BEGIN Expire headers
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 5 seconds"
ExpiresByType image/x-icon "access plus 2500000 seconds"
ExpiresByType image/jpeg "access plus 2500000 seconds"
ExpiresByType image/png "access plus 2500000 seconds"
ExpiresByType image/gif "access plus 2500000 seconds"
ExpiresByType application/x-shockwave-flash "access plus 2500000 seconds"
ExpiresByType text/css "access plus 700000 seconds"
ExpiresByType text/javascript "access plus 700000 seconds"
ExpiresByType application/javascript "access plus 700000 seconds"
ExpiresByType application/x-javascript "access plus 700000 seconds"
ExpiresByType text/html "access plus 600 seconds"
ExpiresByType application/xhtml+xml "access plus 600 seconds"
</IfModule>
<IfModule mod_headers.c>
Header unset ETag
</IfModule>
<IfModule mod_alias.c>
RedirectMatch 403 /xmlrpc.php
</IfModule>
NOTE: if you use pingback or post by email, don’t put in that last 3 lines, as I do this to keep spammers from posting comments via pingback even when comments are off (!).
The above assumes your web host is running Apache, and not IIS, or nginx or other. If so, you might have to tweak those for your particular host. Apache is the most common, however.
Also: make backup, via FTP, or your hosting panel fileManager of your .htaccess file first; then if your site doesn’t load with the new elements, put back your original version.
Hope that helped.
-
This reply was modified 12 years by
simchris.
Hi,
I can fix it now, it’s very nice and working great thank you academicdigital! But did you find the solution for the white background? In the style.css maybe?
HI, Marius
oddly, we’re seeing on both our sites that the date stamp time section font color does NOT change with panel settings, as so http://ga-ga.com/ ..
NOTE: that the date stamp top left remains white text and doesn’t change to #666666. Links change color as they are links, not static text, presumably.
I had used CSS to fix it previously, but just removed that so you could see it “as the issue I’m having.”
Running theme 3.6, and WP 3.8.1 (not yet 3.8.2); with tagdiv speed booster plugin 2.1 = on. No custom font plugins or custom social plugins. Not using JetPack, not using social counter.
Full responsive, 980px.
In theme panel:
HEADER > top menu (black) – no option here for colors/fonts.
CUSTOM TYPOGRAPHY > Top Menu Font > Text Color = #666666
THEME COLORS > Top Menu Color = #e5e5e5
Easy to fix with CSS, but in our two installs theme panel on 3.6 with WP 3.8.1 doesn’t change the color.
No funky plugins running, and we reverted to Yoast SEO 1.4.25 which doesn’t have the issues with breaking sitemaps, etc., that 1.5x does.
Hi,
I checked yesterday the TOP MENU color/fonts and works fine for the data time to. I thought that is a bug but isn’t.
If you want you can use this CSS, to fix the data/time and also to uppercase the footer text.
.td-header-menu-wrap .td_data_time {
color: #666666;
font-size: 14px;
text-transform: uppercase;
margin-left: 23px;
}
.td-sub-footer-wrap {
text-transform: uppercase;
}
Have a nice day! 😉
Hi,
Use this CSS to fix it:
.td_980_resp .td-sub-footer-wrap .td-grid-wrap {
padding-top: 6px !important;
}
I see above the date color issue and others, we will fix it in next version. Thanks!
hi,
use this css:
.wpb_row.row-fluid div.thumb-wrap a img {
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-o-border-radius: 10px;
border-radius: 10px;
}
here: http://screencast.com/t/R5nldZZgdxhQ
Thanks for you message.
Radu A.
I think with the tagDiv speed booster, gzip/deflate on your server (which *should* be running properly if talking about speed), and mod_pagespeed, that might be one thing too many, in my humble opinion.
I don’t know anybody using it. Most “pro” developers simply mod their SASS/LESS code for what they need and the super cool geeks use COMPASS.
With WordPress you have a number of inter-dependent things, so likely more of a “does it work well with WordPress” before “does it work with the theme.”
There is some discussion in the WP core about the subject of autoprefir and prefix-free
https://core.trac.wordpress.org/ticket/27078
However it may be that what you think it will do for you, isn’t what it actually does. It does “reduce the size” of CSS3 code, but was built in 2011 when it was a slower world, prior to HTML5, mod_pagespeed, and many of the efforts to write simpler code — again, take a look at SASS/LESS formats, along with minification.
While it was a good tool for a super high traffic site, to basically build in “shortcoding” of the elements, in the real world with average blog it won’t REALLY do that much for you — I doubt you would increase a pagespeed score by even a point.
If you’ve already minified all your CSS/JS, have caching, expires heading, using CDN for common elements, smushing and compression all your images, using cache for pages, and not injecting a ton of external content in your pages … and you still need to get one point someplace, it might be worth trying. But, why? Not really going to do much, if you’ve already done everything else. My 3 cents, anyway (2 cents adjusted for inflation). 😉
Got it. Thanks Radu.
Is there a way to add border-radius css property to featured thumbnails, so that thumbs both on homepage (categories, tags) and sidebars looked a bit rounded?
I am using layout like this:
https://scontent-b-fra.xx.fbcdn.net/hphotos-ash4/t31.0-8/10259090_435564046587387_2610082451814695024_o.jpg
Hi, I tried pasting the code above in the Theme Panel Custom CSS window, then saved, but nothing happened. Was there something else I needed to do? I’m using Newspaper 3.5.
Thank you again for your always mega fast response!
Hi,
Try with this CSS, add it int Theme panel -> Custom CSS
.single-post .td-grid-wrap {
padding: 0px !important;
}
.single-post .container-fluid {
padding-left: 15px !important;
padding-right: 15px !important;
}
hi,
add this css code :
.column_container .td-post-text-content {
padding: 0px 40px 0px 40px
}
here: http://screencast.com/t/PLIQigACF
Thanks for you message.
Radu A.