- NewspaperAutoptimize Plugin – install and configuration
- NewspaperWP Rocket and Newspaper Theme: Optimization Guide
- NewspapertagDiv Composer – Website Manager
- NewspaperModules Builder in Newspaper Theme
- NewspaperThe Newspaper Mobile Theme: Introduction
- NewspaperBest Of Forums
- NewspaperHow to Make the Site Faster
Part 2:
I think I figured out what is wrong with the theme:
When “Aggregate inline css” is enabled either via theme panel or via Autoptimise settings – the element “img” losses its styling, which is:
img
position: absolute;
width: 100%;
top: 0;
margin: auto;
This img is applied here: img src=” http://img.youtube.com/vi/video-id/maxresdefault.jpg ” alt=”VIDEO TITLE”
As a result, when “width: 100%” is missing, the video thumbnail is displayed full width of an image file (1280 px wide for example) instead of 100% of a view port width.
To solve this for lazy video on mobile to work properly, “img” needs to be excluded by being placed in the filed “Exclude CSS from Autoptimize:”
Can you replicate all this?
Hi @Calin,
Thank you for checking.
Part 1:
Yes, that’s the plugins and settings we use, except for optimise HTML code, as it is not included in your guide.
But it looks like you missed to enable Theme panel > Post Settings > Enable Video on Mobile? That is where the issue is happening.
Looks like you confused it with Block Settings > Use loading animation image. This can be disabled when Ewww is used.
Dear Team,
For whom it will concern: we have worked the last week with the latest update of Newspaper.
As the upgrade looked ok in first instance, we found out that the behavior of the TagDiv Composer has become very unpredictable, thus causing unexpected template behavior of this great theme.
– Slight changes in tdi. settings that aren’t changed while editing the template
– In editor mode the live site cosmetics are sometimes not what they should look like.
Therefore we now always have to log out and restart browser in order to check if changes have been correctly processed (and what other suddenly appear).
– Using third party caching (WP-Optimize Premium) is not stable anymore icw these changes.
Former additional/customized CSS rules do not work well with latest version of Newspaper. Please check first before you make any changes to your template with Composer.
Hi,
No.
Did you even try to replicate the issue?
It looks like another issue/bug with the theme that I discovered. It has nothing to do with the pagespeed support.
Forget Autoptimize. It is the standard features that come with the theme are not working.
It also happens when AGGREGATE INLINE CSS is enabled in Theme panel.
Theme panel >> Block settings >> Inline Css >> AGGREGATE INLINE CSS enabled .
Hello Giorgos!
Check this guide: https://forum.tagdiv.com/autoptimize-install-configuration/
Please note that page speed or optimization is not covered by the support team: https://forum.tagdiv.com/newspaper-theme-support/
Check those guides : https://wp-rocket.me/google-core-web-vitals-wordpress/improve-largest-contentful-paint/ -> https://web.dev/lcp/ – > https://www.sqlpac.com/en/documents/google-pagespeeds-lighthouse-6-new-features-lcp-cls.html -> https://wp-rocket.me/google-core-web-vitals-wordpress/improve-cumulative-layout-shift
Thank you for understanding!
Hello @Alex!
Maybe you can find a plugin for that, for example: https://wordpress.org/plugins/rocket-lazy-load/ and Autoptimize for the second issue.
Please note that page speed or optimization is not covered by the support team: https://forum.tagdiv.com/newspaper-theme-support/
Thank you!
Hello @Panelak1234!
I think you should improve your page speed.
Please note that page speed or optimization is not covered by the support team: https://forum.tagdiv.com/newspaper-theme-support/
To increase the page speed you can check these similar topics for more solutions:
– https://www.infophilic.com/get-almost-100-pagespeed-newspaper-theme/
– https://forum.tagdiv.com/topic/score-100100-pagespeed-with-newspaper-wordpress-theme/
– https://developers.google.com/speed/docs/insights/v5/about
– https://www.xtechkr.com/optimize-newspaper-theme/
– Check those guides : https://web.dev/lcp/ – > https://www.sqlpac.com/en/documents/google-pagespeeds-lighthouse-6-new-features-lcp-cls.html -> > https://wp-rocket.me/google-core-web-vitals-wordpress/improve-cumulative-layout-shift
– https://forum.tagdiv.com/topic/to-high-cumulative-layout-shift-in-mobile-theme/
Please check the tutorials from those platforms gt metrix and Google Pagespeed Insights and I’m sure you can increase the page speed.
Thank you!
Hi Calin,
Environment:
1. “Lazy Video on Mobile” in theme panel is enabled, as required for speed.
2. “Also aggregate inline CSS?” in Autoptimize settings is enabled, as required for speed, per your guide.
Result/Issue: The video thumbnail is not properly loaded. It is loaded in a full image width – much wide than the view port. Screenshot
When “Also aggregate inline CSS” is disabled, it loads fine. However, disabling this option causes other speed issues, including large dom size.
– How to use “Lazy Video on Mobile” and “Also aggregate inline CSS?” both enabled, so it works for speed as advertised?
Thanks.
Hi,
The theme is updated to the latest version already.
I can not really understand why the theme is not optimized from scratch. I have not done any customizations or added code that will make the theme slow. I took for granted the theme should be optimized as my other theme was…
I have attached an image of what is happening after updating to 12.6.4
Broken header – again. I have disabled security optimizer lock and protect and it still will not update my header image.
It made my menu bold for some reason, disregarding my font choices.
Also deleted my IG footer entirely.
Attached: https://ibb.co/Drf0rNV
Footer no longer has ig pictures: https://ibb.co/8bt0tqv
All tagdiv plugins are active, but installing standard pack deletes entire header.
Help!!
Blog is pepperandplatinum.com
I have optimized my theme and I thought everything was working great. Today I learned that my search bar is not clickable. My question is, did I forget a JS file in the exclusion list? Please advice. Thanks in advance!
Current exclusion list is:
/wp-content/plugins/cleantalk-spam-protect/js/(.*).js
/wp-includes/js/hoverintent-js.min.js
/wp-includes/js/admin-bar.min.js
/wp-content/plugins/seo-by-rank-math/assets/front/js/(.*).js
/jquery-
/jquery-migrate(.min)
pagead2.googlesyndication.com/pagead/js/adsbygoogle.js
b2a
b64d
/wp-content/plugins/contact-form-7/includes/swv/js/(.*).js
/wp-content/plugins/contact-form-7/includes/js/(.*).js
/wp-content/plugins/td-composer/css-live/assets/external/ace/snippets/(.*).js
/wp-content/plugins/td-composer/css-live/assets/external/ace/(.*).js
/wp-content/plugins/td-composer/legacy/Newspaper/js/(.*).js
/wp-content/plugins/td-cloud-library/assets/js/(.*).js
/wp-content/plugins/td-subscription/assets/js/(.*).js
/wp-includes/js/(.*).js
/wp-content/plugins/td-composer/assets/js/(.*).js
/wp-content/plugins/ad-inserter/js/ad-inserter.js
/wp-content/plugins/ad-inserter/js/ad-inserter.min.js
/wp-content/plugins/ad-inserter/js/ads.js
/wp-content/plugins/ad-inserter/js/ai-functions.js
/wp-content/plugins/ad-inserter/js/ai-functions.min.js
/wp-content/plugins/ad-inserter/js/banner.js
/wp-content/plugins/ad-inserter/js/sponsors.js
/wp-content/plugins/ad-inserter-pro/js/(.*).js
/wp-content/plugins/ad-inserter-pro/includes/aos/aos.js
Forgot to mention that this issue occurs also using caching (WP-Optimize Premium 3.3.0). Makes no difference.
Hello @Naseem786!
Did you build the pages with the TagDiv Composer?
We have 3 options for mobile versions that you can use:
1. Responsive version: A responsive version of your website looks similar to the desktop version. TagDiv Composer is used to edit the page.Click on the mobile viewport: https://www.screencast.com/t/XDQJedlggSB. There, you can see your mobile version and edit or adjust the elements to look better.
2. Mobile pages: https://tagdiv.com/newspaper-10-3-7-update-brings-customizable-and-fast-mobile-pages
3. Mobile theme plugin: The Mobile Theme is a performance-optimized theme included in the main Newspaper theme that only loads on mobile devices. It comes with its own templates and designs for pages, posts, categories, etc., so your current templates from the desktop theme will get converted to the mobile theme layout. Please see https://forum.tagdiv.com/the-mobile-theme/ and https://forum.tagdiv.com/mobile-theme-introduction/ for more information.
A full explanation is here: https://www.youtube.com/watch?v=SpGkOnJeNZY
If you need to use mobile version 1 or 2, then you need to uninstall the Mobile Theme plugin and AMP.
Thank you!
Hello @liboriobutera!
We have already discussed this issue here: https://forum.tagdiv.com/topic/front-page-gone-after-theme-update/
We have 3 options for mobile versions that you can use:
1. Responsive version: A responsive version of your website looks similar to the desktop version. TagDiv Composer is used to edit the page.Click on the mobile viewport: https://www.screencast.com/t/XDQJedlggSB. There, you can see your mobile version and edit or adjust the elements to look better.
2. Mobile pages: https://tagdiv.com/newspaper-10-3-7-update-brings-customizable-and-fast-mobile-pages
3. Mobile theme plugin: The Mobile Theme is a performance-optimized theme included in the main Newspaper theme that only loads on mobile devices. It comes with its own templates and designs for pages, posts, categories, etc., so your current templates from the desktop theme will get converted to the mobile theme layout. Please see https://forum.tagdiv.com/the-mobile-theme/ and https://forum.tagdiv.com/mobile-theme-introduction/ for more information.
A full explanation is here: https://www.youtube.com/watch?v=SpGkOnJeNZY
If you need to use mobile version 1 or 2, then you need to uninstall the Mobile Theme plugin and AMP.
After every modification, you need to reindex your website on Google. It may take some more time.
Thank you !
I understand that it is not your job to help me optimize my site.
But can you help me crop the featured image. I want to put the values that I see fit, but the template doesn’t let me put custom values.
I want to know if you could help me with this.
I am using the pre-made template: Single Post Template 4.
But this template makes the featured image very large and I want to reduce its size.
To reduce the size of the featured image I have set the size 265 x 198 in the options, but when choosing this size the image looks blurry. Now if I choose another size the image looks very large on the PC and on the mobile too.
Hello @choicemedia !
We have 3 options for mobile versions that you can use:
1. Responsive version: A responsive version of your website looks similar to the desktop version. TagDiv Composer is used to edit the page.Click on the mobile viewport: https://www.screencast.com/t/XDQJedlggSB. There, you can see your mobile version and edit or adjust the elements to look better.
2. Mobile pages: https://tagdiv.com/newspaper-10-3-7-update-brings-customizable-and-fast-mobile-pages
3. Mobile theme plugin: The Mobile Theme is a performance-optimized theme included in the main Newspaper theme that only loads on mobile devices. It comes with its own templates and designs for pages, posts, categories, etc., so your current templates from the desktop theme will get converted to the mobile theme layout. Please see https://forum.tagdiv.com/the-mobile-theme/ and https://forum.tagdiv.com/mobile-theme-introduction/ for more information.
A full explanation is here: https://www.youtube.com/watch?v=SpGkOnJeNZY
If you need to use mobile version 1 or 2, then you need to uninstall the Mobile Theme plugin and AMP.
Thank you!
To optimize my page I use the Perfmatters plugin. My Cache plugin is Breeze by Cloudways.
Apart from giving me a very basic optimization guide, what other help can you give me?
You haven’t told me what to do to crop the featured image. You also don’t tell me about the LCP.
I read your comment.
Hello!
You need to wait a few seconds until it loads the new posts.
If this will take more than usual, then it could be a page speed issue.
To increase the page speed you can check these similar topics for more solutions:
– https://www.infophilic.com/get-almost-100-pagespeed-newspaper-theme/
– https://forum.tagdiv.com/topic/score-100100-pagespeed-with-newspaper-wordpress-theme/
– https://developers.google.com/speed/docs/insights/v5/about
– https://www.youtube.com/watch?v=tnkVapqhIHc
– https://www.xtechkr.com/optimize-newspaper-theme/
– Check those guides : https://web.dev/lcp/ – > https://www.sqlpac.com/en/documents/google-pagespeeds-lighthouse-6-new-features-lcp-cls.html -> > https://wp-rocket.me/google-core-web-vitals-wordpress/improve-cumulative-layout-shift
– https://forum.tagdiv.com/topic/to-high-cumulative-layout-shift-in-mobile-theme/
Please check the tutorials from those platforms gt metrix and Google Pagespeed Insights and I’m sure you can increase the page speed.
Please note that page speed is not covered by the support team: https://forum.tagdiv.com/newspaper-theme-support/
Thank you!
Hello!
We have 3 options for mobile versions that you can use:
1. Responsive version: A responsive version of your website looks similar to the desktop version. TagDiv Composer is used to edit the page.Click on the mobile viewport: https://www.screencast.com/t/XDQJedlggSB. There, you can see your mobile version and edit or adjust the elements to look better.
2. Mobile pages: https://tagdiv.com/newspaper-10-3-7-update-brings-customizable-and-fast-mobile-pages
3. Mobile theme plugin: The Mobile Theme is a performance-optimized theme included in the main Newspaper theme that only loads on mobile devices. It comes with its own templates and designs for pages, posts, categories, etc., so your current templates from the desktop theme will get converted to the mobile theme layout. Please see https://forum.tagdiv.com/the-mobile-theme/ and https://forum.tagdiv.com/mobile-theme-introduction/ for more information.
A full explanation is here: https://www.youtube.com/watch?v=SpGkOnJeNZY
If you need to use mobile version 1 or 2, then you need to uninstall the Mobile Theme plugin and AMP.
Thank you!
Hello @trasno!
There is all about the DOM. Which means you need to have less elements into that container or row, as such on that page. I can suggest you only to take care of how many elements you use on that page. You can try to use a cache plugin or a plugin which can minify the page or combine some elements in order to reduce its size.
To increase the page speed you can check these similar topics for more solutions:
– https://www.infophilic.com/get-almost-100-pagespeed-newspaper-theme/
– https://forum.tagdiv.com/topic/score-100100-pagespeed-with-newspaper-wordpress-theme/
– https://developers.google.com/speed/docs/insights/v5/about
– https://www.youtube.com/watch?v=tnkVapqhIHc
– https://www.xtechkr.com/optimize-newspaper-theme/
– Check those guides : https://web.dev/lcp/ – > https://www.sqlpac.com/en/documents/google-pagespeeds-lighthouse-6-new-features-lcp-cls.html -> > https://wp-rocket.me/google-core-web-vitals-wordpress/improve-cumulative-layout-shift
– https://forum.tagdiv.com/topic/to-high-cumulative-layout-shift-in-mobile-theme/
Please check the tutorials from those platforms gt metrix and Google Pagespeed Insights and I’m sure you can increase the page speed.
Please note that page speed is not covered by the support team: https://forum.tagdiv.com/newspaper-theme-support/
Do you encounter any errors while importing the sections from the Cloud Library? I’ve tested, and for me, it comes out as it should with all the settings.
Thank you!
Hello,
We had a few similar cases and the problem was happening only when the user was not logged in, so the users checked the optimize can cache settings and the problem were resolved.
Do you have this problem when you are logged in? If the problem persist when you are logged in and you agree we can take a closer look, for this will need a temporary wp-admin access that can be provided via email at contact@tagdiv.com
Thank you!
Hey,you are correct, its on WP Rocket, Ewww Image Optimizer and Cloudflare.
This is interesting.
I would also like to get details on this. Why these 3? It is easily reproducible but the settings.
Hi,
In your default NP demo, you use WP Rocket to optimise the site.
Can you please provide a guide recommended by TagDiv for Newspaper theme using WP Rocket?
Your guides for free WP Super Cache, Autoptimize etc do not solve issues required to comply with Core Web Vitals.
Therefore, it is misleading to advertise that the theme is CWV ready, but in fact it is not ready, since a premium WP Rocket plugin is used in order to make it ready.
Thank you.
Im gonna try this broski! I hope it works!!!!! Please do not stop helping me, I need this optimized! Im reporting back in an hour or so when implemented
Hello,
There are many optimization guides provided by our users here in the forum, some made by us; you could check some of them
– https://www.infophilic.com/get-almost-100-pagespeed-newspaper-theme/
– https://forum.tagdiv.com/cache-plugin-install-and-configure/
– https://forum.tagdiv.com/how-to-make-the-site-faster/
– https://forum.tagdiv.com/topic/high-number-of-ajax-request/
– https://forum.tagdiv.com/topic/score-100100-pagespeed-with-newspaper-wordpress-theme/
– https://www.andraware.com/wp-rocket-for-newspaper-theme/
– https://forum.tagdiv.com/topic/page-speed-guide-for-2023-beginners-and-advanced/
– https://forum.tagdiv.com/topic/newspaper-theme-speedify-your-website/
– https://forum.tagdiv.com/topic/tutorial-chriss-custom-optimizations-for-functions-php-etc/
– https://forum.tagdiv.com/cloudflare-cdn/
– https://forum.tagdiv.com/topic/theme-causing-high-cpu-usage-2/
– https://forum.tagdiv.com/topic/sql-querys-high-cpu/
– https://forum.tagdiv.com/topic/newspaper-theme-slow-to-respond/
– https://premium.wpmudev.org/blog/optimizing-your-wordpress-database-a-complete-guide/
– https://underconstructionpage.com/optimize-wordpress-database/
– https://crunchify.com/better-optimize-wordpress-database-all-in-one-guide/
Also, pagespeed is not covered by support -> https://forum.tagdiv.com/newspaper-theme-support/
To be able to optimize and to remove CLS and LCP please check these guide => https://developers.google.com/web/tools/lighthouse/ -> https://www.sqlpac.com/en/documents/google-pagespeeds-lighthouse-6-new-features-lcp-cls.html -> https://web.dev/lighthouse-whats-new-6.0/ -> https://web.dev/lcp/ -> https://web.dev/cls/
Thank you!
