- NewsmagtagDiv Composer Tutorial
- NewsmagBlock settings tutorial
- NewsmagLogo & Favicon
- NewsmagFooter templates
- NewsmagUsing other ads
- NewsmagUsing Typekit fonts
Hi,
Unfortunately, there is no option for that, but you can use a css to add extra text, something like this:
.remove.remove_from_cart_button:before{
content: "delete ";
}
Hi,
A part of the settings can be done using tagDiv Composer and setting the padding on meta – https://i.imgur.com/AlIrzhL.png, another one is related to this css
.cls-wpb .td-module-meta-info{
border-radius: 0 0 10px 10px;
min-height: 210px;
}
That is making a height of at least 210px for the meta (section holding the text information for the product).
Try this css to align in the correct way the elements in the cart:
body .td_woo_menu_cart .tdw-wmc-widget .remove_from_cart_button {
left: 16px;
right: auto;
}
.td_woo_menu_cart .tdw-wmc-widget .quantity {
display: flex;
flex-direction: row-reverse;
}
Hi,
It is possible that you have the notice set in a column that is not full-width – https://i.imgur.com/mJ0cbCv.png https://i.imgur.com/7JbFDZL.png, so what you can do is to drag and drop the notice under the breadcrumbs (that row should be full-width).
To adjust the text, button and icons, you can use this css:
.td_woo_product_notices .woocommerce-notices-wrapper>*:before {
margin-left: 40px;
margin-right: 0;
}
.woocommerce-message::before {
right: 0;
}
body .td_woo_product_notices .woocommerce-notices-wrapper .button {
margin-left: 0;
margin-right: auto;
}
Hi,
Please replace the above css with this one:
.kk-star-ratings.kksr-align-center {
display: none;
}
.tdb_single_content .kk-star-ratings.kksr-align-center {
display: flex;
}
This css should hide the stars everywhere except the post content.
Also, how can I adjust the margins of the product boxes so that they are equal on both sides?
This is the final code that I have added to the CSS.
.cls-wpb .td-excerpt{
padding-bottom: 16px;
border-bottom: 2px solid #e7f0f1;
}
html body div.cls-wpb .star-rating {
float: left;
}
.cls-wpb .td-module-meta-info{
border-radius: 0 0 10px 10px;
}
Thank you!
Hi,
1. Set the product template as global, this can be done from Cloud Templates > Shop – https://i.imgur.com/1N8ySPP.png
2. In the image, you have set a block that use custom modules, and those no longer exist or are no longer set. Those can be assigned using this guide https://forum.tagdiv.com/flex-block-builder-flex-loop-builder/ and can be created using this one https://forum.tagdiv.com/modules-builder-newspaper-theme/
An alternative is to replace the flex builder with flex block 1 or other flex.
3. Use tagDiv Composer and edit that template select the row over image and cehck the css tab, there should be an option for backgroun image – https://i.imgur.com/GzP9ePp.png
Hi,
The results should be like in my screenshot https://i.imgur.com/8W85BvO.png
Please try the css with important:
body .td_woo_menu_cart .tdw-wmc-widget .remove_from_cart_button {
left: 16px;
}
body .td_woo_menu_cart .tdw-wmc-widget .mini_cart_item a:nth-child(2) img{
right: 10px;
}
body .tdi_36 .tdw-wmc-widget .mini_cart_item a:nth-child(2), body .tdi_36 .tdw-wmc-widget .mini_cart_item .variation {
padding-left: 0!important;
padding-right: 46px!important;
}
Hi,
To have the same layout for the articles you can use the flex block 1, the settings will be similar and all of them can be done from the element settings.
To align the stars with the price please use this css:
.cls-wpb .td-excerpt{
padding-bottom: 16px;
border-bottom: 2px solid #e7f0f1;
}
html body div.cls-wpb .star-rating {
float: left;
}
and please remove this css:
.cls-wpb .star-rating{
position: absolute!important;
left: 10%;
bottom: 7%;
}
.cls-wpb .price{
border-bottom: 2px solid #e7f0f1;
}
Hi,
In case you are referring to this one – https://i.imgur.com/sraPNfK.jpeg it is coming from a plugin, I think it is this one – https://wordpress.org/plugins/kk-star-ratings/ maiby you can exlude it from plugin options, if not you can use a css –
.tdb-menu-item-text .kk-star-ratings.kksr-align-center {
display: none;
}
You can use the option from the theme – https://forum.tagdiv.com/newsmag-reviews/
Hi,
Regarding the theme’s js, it is set in the tagdiv_theme.min.js file and it is loaded in any situation where a script is needed because the js is in this file. Unfortunately, for the time being, this code has not been broken down in the Newsmag theme, only for the Newspaper theme.
Also, in terms of optimization, it relies heavily on optimization plugins, some of the most used are:
WP Rocket (paid) and Flying Scripts (free) – if you don’t want to fully unload, you can delay/defer the theme JS until interaction/idle to cut main-thread work.
Perfmatters (paid) – has an excellent Script Manager to disable scripts per page, everywhere except…, by device, etc.; also supports delaying
Asset CleanUp (free / Pro) – lets you unload JS/CSS per page, post type, taxonomy, or site-wide. Great for preventing the theme’s big JS file from loading where it’s not needed.
Plugin Organizer – broader hammer that can disable entire plugins per URL (handy if a plugin injects heavy JS on all pages).
Thank you!
Hi,
Please try this custom css for the cart elements align: https://i.imgur.com/u8gHbWd.png
body .td_woo_menu_cart .tdw-wmc-widget .remove_from_cart_button {
left: 16px;
}
body .td_woo_menu_cart .tdw-wmc-widget .mini_cart_item a:nth-child(2) img{
right: 10px;
}
body .tdi_36 .tdw-wmc-widget .mini_cart_item a:nth-child(2), body .tdi_36 .tdw-wmc-widget .mini_cart_item .variation {
padding-left: 0;
padding-right: 46px;
}
Hi,
I think that a custom css has been removed from the page – https://i.imgur.com/EIaVzaN.png please add a raw css and add in it this css:
.td-numbered-post-flex .td_block_inner {
counter-reset: section;
}
.td-numbered-post-flex .td_block_inner .td_module_flex_1::before {
counter-increment: section;
content: counter(section);
color: #d2dae1;
border-radius: 50%;
font-family: PT Serif, Serif;
font-size: 42px;
line-height: 1;
display: inline-flex;
position: absolute;
right: 0;
bottom: 10px;
}
.td-hero-block.td_with_ajax_pagination .td-next-prev-wrap {
position: absolute;
right: 0;
top: 62%;
padding-right: 25px;
}
@media (min-width: 1019px) and (max-width: 1140px) {
.td-hero-block.td_with_ajax_pagination .td-next-prev-wrap {
top: 52%;
padding-right: 20px;
}
}
@media (min-width: 768px) and (max-width: 1018px) {
.td-numbered-post-flex .td_block_inner .td_module_flex_1::before {
font-size: 30px;
}
.td-hero-block.td_with_ajax_pagination .td-next-prev-wrap {
top: 50%;
padding-right: 15px;
}
}
@media (max-width: 767px) {
.td-hero-block.td_with_ajax_pagination .td-next-prev-wrap {
top: 38%;
padding-right: 15px;
}
}
.td-cancel-border .td_module_flex_1:last-child .td-module-container {
border-width: 0 !important;
}
.td-cancel-border-4 .td_module_flex_1:nth-child(2n) .td-module-container {
border-width: 0 !important;
}
.td-line-on-title .tdm-title-line {
left: 6px;
}
.td-image-padding .td_module_flex_3 .td-module-container {
padding-left: 15px;
}
.td_block_template_8 .td-block-title-wrap .td-block-title {
margin-bottom: 20px;
}
.td_block_template_8 .td-block-title > *:before,
.td_block_template_8 .td-block-title > *:after {
height: 2px !important;
top: 62% !important;
}
.td_block_template_8 .td-block-title-wrap .td-wrapper-pulldown-filter .td-pulldown-filter-display-option {
line-height: 38px;
}
@media (min-width: 768px) and (max-width: 1018px) {
.td_block_template_8 .td-block-title-wrap .td-wrapper-pulldown-filter .td-pulldown-filter-display-option {
line-height: 34px;
}
}
@media (max-width: 767px) {
.td_block_template_8 .td-block-title-wrap .td-wrapper-pulldown-filter .td-pulldown-filter-display-option {
line-height: 32px;
}
}
Google Search Console Error
AMP issues detected in https://trendsnafrica.com/
To the owner of https://trendsnafrica.com/:
Search Console has identified that your site is affected by 1 AMP issue(s). The following issues were found on your site.
Top critical issues*
CSS syntax error in tag ‘style amp-custom’.
*Critical issues prevent your page or feature from appearing in Search results.
We recommend that you fix these issues when possible to enable the best experience and coverage in Google Search.
If you want a css to set the stars as in the example https://i.imgur.com/oeUPRdD.png
.cls-wpb .star-rating{
position: absolute!important;
left: 10%;
bottom: 7%;
}
.cls-wpb .price{
border-bottom: 2px solid #e7f0f1;
}
.cls-wpb .td-module-meta-info{
border-radius: 0 0 10px 10px;
min-height: 210px;
}
Hi,
How do the bottom edges get rounded?
I added the CSS code but nothing happened.
Thank you!
Hi,
To have this option, you’ll need to replace the Single Post BG Featured Image with Single Post Featured Image. The first one sets the image as a background using CSS, and the second shortcode sets the image using HTML img.
Thank you!
Hi,
Here are some fast settings, and I think that after you make them, you’ll know how to improve the layout. Set the Woo Product block, go to the layout tab and set it as in my screenshots – https://i.imgur.com/rKrAkkW.png https://i.imgur.com/KVGyRlo.png (you can adjust the paddings, seo tabs and the rest of the options after your needs). After that, from the Style tag, you can set the fonts and colors you want to use – https://i.imgur.com/OfbRrXB.png, then in the General tab, set a class for example, cls-wpb – https://i.imgur.com/Cf8zW0r.png then in css add this code – https://i.imgur.com/KHdGiQa.png to set the reviews in the bottom right. Then the last review is on mobile, set only one module per row – https://i.imgur.com/6J78MgO.png
I hope this will help you!
Hi,
Unfortunately, there is no option for this, but what can be done if you want is to use a custom css to set a min height for the product’s content. Please provide a link where I can inspect the products and I will provide a css for it.
Thank you!
I am using TagDiv cloud library(Single magazinePro template), but I am encountering a layout problem specifically on the single post pages. The post page is structured with two sections: the main content area and a sidebar. While the composer editor shows the layout correctly with both sections side by side, the live website displays the sidebar overlapping the content, and the main content stretches to full width.
Here are the screenshots for reference:
Overlapped sidebar issue: https://prnt.sc/PTyjQ-jsfqYm
Composer view (correct layout): https://prnt.sc/kGkECw7af7Rc
Live view (problem visible): https://prnt.sc/uOor9afvQQj2
I have cleared caches, checked for plugin conflicts, and confirmed that this issue only occurs on the single post pages, not on other pages.
Could you please guide me on how to fix this issue? I would appreciate any advice on CSS adjustments, composer settings, or known conflicts that might cause this problem.
Thankyou
Hi,
You should use the settings from the template – https://i.imgur.com/Sbqcq58.png – https://i.imgur.com/Q5BkRZP.png https://i.imgur.com/2I5ZR9v.png
If you want to use a css code you should use it like this:
.wp-block-list li {
font-size: 25px !important;
}
Hi,
Is a custom css set in the theme files for each option that is chosen.
Thank you!
Hello – the WordPress controls for font size in the List editor are ineffective. So I tried entering
.tdb_category_description li {
font-size: 25px;
line-height: 2;
}
in Newspaper -> Theme panel -> Custom code -> Custom CSS
but it has no effect on my List font size.
How can I change List font size in Newspaper?
Thanks
Mark Gilbert
Hi,
Our system cannot intervene over your custom code, that would mean modifying it and making it no longer work correctly.
As a test you can put the two svgs in a new post, if the ids are identical or the css applies to the same classes then the result will be as in the case try adding the svgs in the header svg section.
If you can please give me a link to the 2 svgs and I will try to help you with them.
Thank you!