- NewspaperCreate Custom Code with the browser’s Inspector or the Live CSS Box
- NewspaperScroll Animation
- NewspaperWP Rocket and Newspaper Theme: Optimization Guide
- NewspaperHow to setup Twitch for Social Counter
- NewspaperModal Popup
- NewspaperFlex Block Settings Guide
- NewspaperAutoptimize Plugin – install and configuration
- NewspaperAdding Multiple Authors to Your Articles
- NewspaperDesign your Post Pages using the Cloud Library Templates
- NewspaperBig Grid Flex Settings
- NewsmagtagDiv Composer Tutorial
- TutorialsFrom WPBakery to tagDiv Composer
- NewspapertagDiv Composer Tutorial
- NewspaperTheme modules and blocks
- TutorialsDefault Block Settings Guide
- NewspaperThe Mobile Theme
- NewspaperCompare theme files – Winmerge tutorial
- NewsmagBlock settings tutorial
- NewsmagLogo & Favicon
- NewsmagFooter templates
Hi,
The stretch option is available after selecting a row, it’s in the general settings tab -> https://prnt.sc/4muwSpqSWKlv Simply scroll down a bit while hovering the settings tab -> https://prnt.sc/uU8wLyz3eFUL and the option should be there.
As a note, stretching rows will not work if the rows have custom widths set like this -> https://prnt.sc/cwfuQqZPmAau
I believe you are also using some custom CSS to limit the width, I see it in the theme custom CSS -> https://prnt.sc/4KfdAvNIzxun Please make sure that you review that code you entered here -> https://prnt.sc/lLaG0ksSbKTi because it will probably prevent any row from being stretched.
Let me know if I can help more.
Thank you!
Hi tagDiv team,
I want to set my content width to 1200px (modern news-site layout: full-bleed bars, centered 1200px content column) on zzpnieuws.nl, running Newspaper 12.7.6 with a child theme.
In this forum, your staff has described the solution as follows:
– Simion C. (Sep 2025, topic “How to customize the page width”): “So for a page like your homepage, you must edit it with the composer, click on the rows and stretch them to 1200px, it takes very little time.”
– Calin (Aug 2025, topic “banner in my header”): “you can adjust the row width using tagDiv Composer […] the row to be stretched to 1200px instead of the default.”
However, this stretch control does not appear anywhere in my tagDiv Composer:
1. When I select a Row (both on a regular Composer page and in my header Cloud Template), hovering over the left/right edges of the row in the preview shows no drag handles and no resize cursor.
2. The Row settings panel (tabs General / Divider / Layout / Css) contains no stretch or row-width dropdown. The Layout tab only has column layout, alignment, order and “occupy remaining space”. The Css tab only has a manual pixel Width field.
3. Theme Panel → Template Settings has no global site/content width setting either.
My questions:
– Where exactly is the “stretch row to 1200px” control in Newspaper 12.7.6? Is it a drag interaction in the preview, a setting, or something that must be enabled first?
– Is this feature version-, license- or configuration-dependent?
– If it is genuinely unavailable in my setup: what is your recommended, update-safe way to achieve a 1200px content width site-wide (including the default single post and category templates) without breaking the responsive grid and thumbnail calculations?
Setup: Newspaper 12.7.6 (deploy mode: deploy), child theme (originally generated on Newspaper 9), tagDiv Composer + Cloud Library active, header built as a Cloud Template, LiteSpeed Cache, hosting at Cloud86.
Screenshots attached: (1) the Row settings panel showing the four tabs without a width option, (2) a selected row in the preview where no drag handles appear on the edges. See images here: https://postimg.cc/gallery/3xm1fCyimages
Thanks,
Marco — zzpnieuws.nl
Please try something like this:
@media (max-width: 767px) {
div.td_block_big_grid_flex_2 .td-big-grid-flex-scroll-holder {
overflow-x: auto!important;
overflow-y: auto!important;
white-space: normal!important;
}
.td_block_big_grid_flex_2 .td-big-grid-flex-scroll-holder {
display: grid!important;
grid-template-columns: repeat(2, 1fr);
gap: 3px;
overflow-x: visible;
white-space: normal;
}
.td_block_big_grid_flex_2 .td-big-grid-flex-scroll-holder .td_module_flex_7 {
width: 100%!important;
flex: none!important;
}}
Then the Big grid flex 2 should look like this on mobile -> https://prnt.sc/BuxRJFJFWpqi
The code can be entered in the Live CSS in the admin bar, or in the theme panel custom CSS section. Maybe also clear the website cache to make sure the code applies.
Please give it a try and let me know if it worked or in case there are any problems with it.
Thank you!
And the Custom CSS code in the admin panel doesn’t save when I click Save. It says it saved successfully, but when I refresh the page, it loads the old code again, not the latest version.
Hi,
Yes, I am using Big Grid Flex 2.
If you can provide the CSS solution to make the mobile layout display like the Newsmag example, that would be great.
Thank you!
Hi,
That is possible. It could be made with a section, meaning using multiple blocks, which can be arranged as needed on desktop and mobile.
But it could also be done with some CSS. Maybe this will be easier if you just want the grid to look that way.
In Newspaper are you using Big grid flex 2? -> https://prnt.sc/VYV3XQeAAqxP Let me know if that’s the case, and I’ll provide a solution to make it display as you want on mobile.
Thank you!
“Hello, I am here to report the same issue. Since updating to WordPress 7.0, the Gutenberg editor is severely bugged, very slow, and the layout/styles are completely broken.
I have done some troubleshooting on my end:
I tested other WP 7.0 sites without the Newspaper theme, and the editor works perfectly.
I disabled all third-party plugins, and the issue persists. It is definitively tied to the theme and the tagDiv Composer.
Checking the browser console, there are conflicts with the new WP 7.0 iframe structure. The console throws errors such as: td-guten-blocks-editor-css-css was added to the iframe incorrectly and fails to load load-scripts.php.
Is there an ETA for a full compatibility patch for WordPress 7.0?”
“Chrome Console”
load-scripts.php?c=1&load%5Bchunk_0%5D=jquery-core,jquery-migrate,utils,wp-dom-ready,wp-hooks&ver=7.0:5 JQMIGRATE: Migrate is installed, version 3.4.1
v833ccba57c9e4d2798f2e76cebdd09a11778172276447:1 Failed to load resource: net::ERR_ADDRESS_INVALID
deprecated.min.js?ver=990e85f234fee8f7d446:1 Block with API version 2 or lower is deprecated since version 6.9. See: https://developer.wordpress.org/block-editor/reference-guides/block-api/block-api-versions/block-migration-for-iframe-editor-compatibility/ Note: The block “mpp/user-profile” is registered with API version 1. This means that the post editor may work as a non-iframe editor. Since all editors are planned to work as iframes in the future, set the apiVersion field to 3 and test the block inside the iframe editor.
S @ deprecated.min.js?ver=990e85f234fee8f7d446:1
deprecated.min.js?ver=990e85f234fee8f7d446:1 Block with API version 2 or lower is deprecated since version 6.9. See: https://developer.wordpress.org/block-editor/reference-guides/block-api/block-api-versions/block-migration-for-iframe-editor-compatibility/ Note: The block “mpp/user-profile-enhanced” is registered with API version 1. This means that the post editor may work as a non-iframe editor. Since all editors are planned to work as iframes in the future, set the apiVersion field to 3 and test the block inside the iframe editor.
S @ deprecated.min.js?ver=990e85f234fee8f7d446:1
deprecated.min.js?ver=990e85f234fee8f7d446:1 wp.compose.withState is deprecated since version 5.8. Please use wp.element.useState instead.
S @ deprecated.min.js?ver=990e85f234fee8f7d446:1
deprecated.min.js?ver=990e85f234fee8f7d446:1 Block with API version 2 or lower is deprecated since version 6.9. See: https://developer.wordpress.org/block-editor/reference-guides/block-api/block-api-versions/block-migration-for-iframe-editor-compatibility/ Note: The block “advads/gblock” is registered with API version 2. This means that the post editor may work as a non-iframe editor. Since all editors are planned to work as iframes in the future, set the apiVersion field to 3 and test the block inside the iframe editor.
S @ deprecated.min.js?ver=990e85f234fee8f7d446:1
deprecated.min.js?ver=990e85f234fee8f7d446:1 36px default size for wp.components.SelectControl is deprecated since version 6.8 and will be removed in version 7.1. Note: Set the __next40pxDefaultSize prop to true to start opting into the new default size, which will become the default in a future version.
S @ deprecated.min.js?ver=990e85f234fee8f7d446:1
deprecated.min.js?ver=990e85f234fee8f7d446:1 36px default size for wp.components.RangeControl is deprecated since version 6.8 and will be removed in version 7.1. Note: Set the __next40pxDefaultSize prop to true to start opting into the new default size, which will become the default in a future version.
S @ deprecated.min.js?ver=990e85f234fee8f7d446:1
deprecated.min.js?ver=990e85f234fee8f7d446:1 wp.editor.RichTextToolbarButton is deprecated since version 5.3 and will be removed in version 6.2. Please use wp.blockEditor.RichTextToolbarButton instead.
S @ deprecated.min.js?ver=990e85f234fee8f7d446:1
load-scripts.php:1 Failed to load resource: the server responded with a status of 404 ()
Hi,
Not sure what’s going on there exactly, but from what I see someone used some CSS to hide all inner rows -> https://prnt.sc/5tRMTnTwUTyP Please check in theme custom CSS in the admin bar -> https://prnt.sc/m8zwDStfW-bV Remove that code from there and the footer and other elements across the website will be visible again. That code isn’t very specific and it will cause a lot of problems.
If there are other issues I suggest reviewing all the custom CSS added there, because the issues may be caused by it.
Rows can be deleted in 3 ways:
1. Click on the row icon -> https://prnt.sc/qprLb8NXj2fJ and drag to the bottom right corner -> https://prnt.sc/YKF8Wh84EBr4
2. Click the row icon and press delete on the keyboard.
3. Right click the row icon and choose delete -> https://prnt.sc/lfJ0bq3LMOqI
Please use either method and delete the rows that you don’t need.
Let me know if you have more questions.
Thank you!
I can fix the dropdowns with css styling.
I can’t figure out how to get rid of the scroll bar, though!
Okay so the custom css worked for the border radius.
The sticky worked also – For some reason, it was not working properly the other day when I tried. odd.
But the only issues I’m still having with the modal popup is that a scrollbar is appearing within the popup on the right side: https://imgur.com/a/fhcQG2g
and the dropdowns for sub menu are not visible on the page (they may be hidden by the scrollbar).
Hello,
I run the Newspaper theme (version 12.7.6, registered) with tagDiv Composer on a WordPress site hosted at WP Engine. The homepage intermittently breaks: the hero/feature grid renders as gray bands with no background images and the layout collapses. It happens every several days, with no edit or publish that I can tie to it.
I have diagnosed this fairly precisely and want to share the evidence, because it points to the Composer template failing to compose rather than a caching or browser issue.
WHAT THE BROKEN VS HEALTHY HTML SHOWS
I captured the HTML of the same homepage URL (page ID 370) in both states.
Broken state (~59 KB):
body class is MISSING: wp-theme-Newspaper, global-block-template-1, tdb-template, td-full-layout
4 td_block instances
6 style blocks, about 9.8 KB of inline CSS
0 background-image rules (which is why no hero imagery paints)
Healthy state (~899 KB):
body class INCLUDES: wp-theme-Newspaper, global-block-template-1, tdb-template, td-full-layout
324 td_block instances
41 style blocks, about 53 KB of inline CSS
about 200 background-image rules
So in the broken state the tagDiv block-builder template for the page is not composing at all. The tdb-template / global-block-template-1 output and inline CSS never generate.
WHAT FIXES IT AND WHAT DOES NOT
Purging the host cache does NOT fix it. The broken render is served even on a forced cache miss and on hard refresh, so it is not stale cache.
Re-saving the homepage in tagDiv Composer (Save, with the green Header/Footer/Content Successfully Saved confirmations) DOES fix it immediately, every time. This is now reproduced twice.
So a fresh Composer composition produces the correct page, and something later causes the page to revert to the un-composed render.
PATTERN
It stays healthy for several days, then suddenly reverts to the broken render.
One stable stretch lasted about 9 days before recurring.
A re-save fixes it for another multi-day stretch.
ONE POSSIBLY RELATED DETAIL
When the broken version was being served, the host cache had bucketed a desktop request into the mobile/iphone cache group. I mention it only in case Composer mobile/desktop template variant handling is relevant to why an incomplete render gets produced.
QUESTIONS
Is there a known issue where the Composer block-builder template fails to compose on a page regeneration, producing output without the tdb-template / global-block-template-1 body classes and without the inline CSS?
Could a periodic Composer cloud-library sync, a theme/Composer background process, or a license re-check trigger a re-render that lands in this un-composed state?
Is there a setting or maintenance step that forces the template to always fully compose, so I do not have to manually re-save in Composer every few days?
Is there a current recommended compatible pairing of Newspaper theme version and tagDiv Composer plugin version I should confirm I am on?
I can provide both full HTML captures (healthy and broken) on request.
Site: https://alstonhomes.com
Hello,
I run the Newspaper theme (version 12.7.6, registered) with tagDiv Composer on a WordPress site hosted at WP Engine. The homepage intermittently breaks: the hero/feature grid renders as gray bands with no background images and the layout collapses. It happens every several days, with no edit or publish that I can tie to it.
I have diagnosed this fairly precisely and want to share the evidence, because it points to the Composer template failing to compose rather than a caching or browser issue.
WHAT THE BROKEN VS HEALTHY HTML SHOWS
I captured the HTML of the same homepage URL (page ID 370) in both states.
Broken state (~59 KB):
body class is MISSING: wp-theme-Newspaper, global-block-template-1, tdb-template, td-full-layout
4 td_block instances
6 style blocks, about 9.8 KB of inline CSS
0 background-image rules (which is why no hero imagery paints)
Healthy state (~899 KB):
body class INCLUDES: wp-theme-Newspaper, global-block-template-1, tdb-template, td-full-layout
324 td_block instances
41 style blocks, about 53 KB of inline CSS
about 200 background-image rules
So in the broken state the tagDiv block-builder template for the page is not composing at all. The tdb-template / global-block-template-1 output and inline CSS never generate.
WHAT FIXES IT AND WHAT DOES NOT
Purging the host cache does NOT fix it. The broken render is served even on a forced cache miss and on hard refresh, so it is not stale cache.
Re-saving the homepage in tagDiv Composer (Save, with the green Header/Footer/Content Successfully Saved confirmations) DOES fix it immediately, every time. This is now reproduced twice.
So a fresh Composer composition produces the correct page, and something later causes the page to revert to the un-composed render.
PATTERN
It stays healthy for several days, then suddenly reverts to the broken render.
One stable stretch lasted about 9 days before recurring.
A re-save fixes it for another multi-day stretch.
ONE POSSIBLY RELATED DETAIL
When the broken version was being served, the host cache had bucketed a desktop request into the mobile/iphone cache group. I mention it only in case Composer mobile/desktop template variant handling is relevant to why an incomplete render gets produced.
QUESTIONS
Is there a known issue where the Composer block-builder template fails to compose on a page regeneration, producing output without the tdb-template / global-block-template-1 body classes and without the inline CSS?
Could a periodic Composer cloud-library sync, a theme/Composer background process, or a license re-check trigger a re-render that lands in this un-composed state?
Is there a setting or maintenance step that forces the template to always fully compose, so I do not have to manually re-save in Composer every few days?
Is there a current recommended compatible pairing of Newspaper theme version and tagDiv Composer plugin version I should confirm I am on?
I can provide both full HTML captures (healthy and broken) on request.
Hello,
Since updating to WordPress 7.0 today, I have detected a visual/functional issue in the builder’s CSS panel, specifically in the Margin / Padding fields of the Single Image module.
I’m leaving you a Loom video where the behavior can be seen clearly:
https://www.loom.com/share/26601c055dd3494d9745ede4635d838b
The problem is the following: before the update, within the visual margin/padding scheme, the fields allowed values of at least two characters or values with a unit to be displayed correctly. For example, if a padding value was 10%, the field allowed me to see 10 or 10%, or at least scroll inside the input in a useful way to check the full value.
Now the behavior has changed. The fields are displayed too narrow and only show one character of the value. For example, visually it may look like the padding is 1 / 1 / 1, but in reality the values are of the type 10% / 10 / 10%. When I move inside the field, instead of being able to see the full value or at least two characters, only one character is shown at a time; in this example, in order to see the %, I have to move within the field and instead of being able to see 0%, as part of 10%, only that is shown: the %.
This makes the CSS panel difficult to use, because I cannot visually check whether the real value is 1, 10, 10%, etc. The problem does not seem to be that the value has been lost, but rather that the panel input is displaying it cut off or with insufficient width. I have been using TagDiv for more than 7 years and I know what I am talking about when it comes to composition and the details of the composer.
I have tested it both in the desktop composer and in the mobile composer. I have also tested it in incognito mode, in case it could be due to browser cache. In addition, the page cache was cleared after the update.
For this reason, I understand that it could be a visual incompatibility of the builder after updating to WordPress 7.0, an internal CSS issue in the panel, a change in the width of the inputs, a rendering issue in the editor, or some incompatibility with the current version of WordPress/browser.
It is not necessarily that the page design has changed, but rather that the editor no longer displays the full values correctly inside the margin/padding fields.
The issue directly affects editing, because it makes it very difficult to review or modify margins and paddings without the risk of changing incorrect values.
Thank you. Please, I would really appreciate your help with this.
I’ll help.
1. Normally if you set the border radius on the popup element here -> https://prnt.sc/a5t3NYI-ApGL The popup should have a border when it’s opened -> https://prnt.sc/8CU8V8SU6C4D Seems to function correctly.
Or you could use some CSS to add the border radius -> https://prnt.sc/pjFjgJCQ-xji
Or if you want just the left top and left bottom corners to be rounded -> https://prnt.sc/x2_-ffQE1xCD
Here are both codes, first case and second:
#tdm-popup-modal-2142 .tdm-popup-modal {
border-radius: 25px;
}
#tdm-popup-modal-2142 .tdm-popup-modal {
border-radius: 25px 0 0 25px;
}
It’s all CSS basically, either using a setting or a code directly.
2. Rows can be made sticky. If you add the popup button in a new row of it’s own, then you can make that row sticky either at the top or at the bottom -> https://prnt.sc/z7msbWVW4qmS You could try it like that.
Let me know how it goes.
Thank you!
NO problem, glad it worked.
And sorry about that issue with the CSS code, I should have pasted the code between code tags, I modified it now. Also I uploaded the woff file on our CDN so the link doesn’t expire, it’s a zip archive which contains the file.
This can be used as a solution until we permanently make the modification in the theme. Then it won’t be needed anymore.
Thank you!
Hi Simion,
thanks for getting back! And: lovely, the .woff font now includes the icon and the CSS selector adds the content as expected. To anyone reading: I guess the forum software fucked up the quoting in the CSS above, so make sure to enclose the \e93b with single quotes.
Works like a charm and as expected now. Will this be incorporated into future official releases?
Cheers & Thanks
Thomas
I see it. It seems to be a border bottom set on the top row, the one containing the logo. Do you want to remove it from there?
If so, then in the composer please click on the row containing the logo and check in the CSS tab -> https://prnt.sc/KLf68zcFmWMx If there is a 1 set there in the border bottom box, remove it and the border should be gone.
Thank you!
Hi,
Indeed, it looks like the social was added in the theme panel, but the icon for it wasn’t added. It should have been included in the Newsmag icon font.
I could modify it and add the icon in the font file. I modified it and I uploaded it here https://cdn.tagdiv.com/wp-content/uploads/2026/06/newsmag.zip That file can be downloaded from there, and then it must be uploaded in this folder in the theme -> https://prnt.sc/-Mwc1wnWqVb7
So here wp-content\themes\Newsmag\images\icons
The file that is already there has to be replaced.
The last step is to add this CSS code in the theme Live CSS or in the theme panel custom code:
.td-icon-mastodon:before {
content: "\e93b";
}So here -> https://prnt.sc/hslEwixh94fl
The result should be that the Mastodon icon is displayed. You could give it a try. Or if you want I can do it, I will need access to the website and to cPanel or FTP, these can be sent by email at contact@tagdiv.com
I’m very sorry for this inconvenience.
Thank you!
Hi,
We should start with the premise that the theme and it’s plugins have to load files, and each file has a purpose.
Those files are related to the Live CSS option in the admin bar -> https://prnt.sc/Hbv7gmqDGdZJ Only an admin can use the Live CSS option, so the files are only loaded while logged in as an admin. They are not loaded publicly, or for any other user roles.
I don’t recall seeing such an issue before, which means it’s either very specific, or it’s happening only on this website. On my test install for example I have no such errors -> https://prnt.sc/C8yG87yzGOS7
Let’s discuss it more.
If I check your website as a visitor, the mobile menu works fine -> https://prnt.sc/zMcWqAoxw9Gg and the search works fine -> https://prnt.sc/Lwq-DKrIYScY Are these only not working for you when you are logged in as an admin?
Or maybe you solved the problem already.
Thank you!
Live css did the job. Thnx
Hello TagDiv Support,
I’m using the Newspaper theme with td-composer – https://www.total-motorsport.com/
On the frontend, td-composer is loading these files:
ext-language_tools.js
ext-searchbox.js
from this path:
/wp-content/plugins/td-composer/css-live/assets/external/ace/
This causes the following console errors:
Uncaught ReferenceError: define is not defined
Uncaught ReferenceError: ace is not defined
Because of these errors, two things are broken in the header:
The hamburger menu does not open on mobile.
The search function in the header does not work.
I have already tried:
Clearing all caches
Re-saving the header template in Composer
Multiple attempts to remove the Ace scripts (both via PHP and JavaScript)
None of these fixed the issue. The site is otherwise stable.
Could you please investigate why td-composer is loading Ace Editor assets on the public frontend and provide a fix?
Thank you.
Hi,
It looks like there’s a problem there. I tested with the video embed element which I believe you are using as well. Some of the properties of the video iframe cause a problem with how the color gradients are applied.
I can provide some CSS for it. Something like this would work as a base code
.td_block_video_embed .wpb_video_wrapper::after {
content: '' !important;
width: 100% !important;
height: 100% !important;
position: absolute !important;
top: 0 !important;
left: 0 !important;
z-index: 1 !important;
display: block !important;
background: linear-gradient(135deg, rgba(30, 219, 46, 0.26), rgba(0, 0, 255, 0.4)) !important;
pointer-events: none !important;
}
The angle and the two colors can be modified in it -> https://prnt.sc/JR7V6Zn7rpLu
This will affect all the video embed elements. If you have multiple embeds and you want different colors, then it will have to me made more specific and multiplied. I’ll help with it, let me know.
Thank you!
Let’s recapitulate.
The post views are displayed on this website https://westfrieslandpraat.nl/ I see them here -> https://prnt.sc/Q53aurAB_5Es
That code I provided should make them invisible to visitors.
The code can be loaded in the post template via a Raw CSS element -> https://prnt.sc/7lBuPFRdC1hL
Alternatively the code can be loaded in the Live CSS -> https://prnt.sc/Fmd24EMnV0fq
Or in the theme panel -> https://prnt.sc/RWTWpDGC7Ij-
Or even in the wordpress customizer -> https://prnt.sc/nLLbT13Eln8B -> https://prnt.sc/gzryKNT_onNO
Either way you load the code, please also clear the cache if you use a caching plugin.
Thank you!
Hi guys,
I embedded a video and I add color overlay to that element in the css settings. When the page is loading, I see the colors (for a second). But the colors are not shown on the website. I cleared the cache, still no luck. What am I missing? (Consider this as a pre-sale question as my employer will then buy the Newspaper Theme)
Cheers
Carolin
Hi,
I can explain.
Sometimes our design team wanted to use some extra effects for various elements from demos. Such effects couldn’t be created with theme options, to they were built custom.
The classes you mention are indeed present in this demo https://demo.tagdiv.com/newspaper_trucking_services_pro For example on some columns https://prnt.sc/ZjADy–26a9A
Those classes don’t work by themselves, they are connected to these this Raw CSS element lower in the page -> https://prnt.sc/kkGB84ADbozw and this Raw HTML element right below it -> https://prnt.sc/wpTeaTd0ziQO They are kind of hard to see there. So because of those two elements the classes work. If you want to use those classes somewhere else, those two elements have to be copied in that page as well.
Or, you could try the options we added in the meantime for such animations. Every element has them -> https://prnt.sc/-5shRJCz9Ccy
Let me know if you have more questions.
Thank you!
