- NewspaperWP Rocket and Newspaper Theme: Optimization Guide
- TutorialsFrom WPBakery to tagDiv Composer
- TutorialsDefault Block Settings Guide
- TutorialsHow to use custom fonts
Dear tagDiv users.
With Newsmag theme I use
When I go to my events calendar domain/events
I get no good CSS rendering ‘The Events Calendar’ from Modern Tribes.
https://theeventscalendar.com/product/wordpress-events-calendar/
But when I go to the event calendar page on WordPress I get a wp_booster error and the CSS of the plugin is not rendering.
Is this a conflict with the plugin and the theme? How can I use this great theme and this great calendar.
Screen:
https://imgur.com/i9Dfsqd
Trace back:
Array
(
[0] => Array
(
[file] => /var/www/virtual/mysite.biz/htdocs/wp-content/plugins/td-composer/legacy/common/wp_booster/td_module.php
[line] => 37
[function] => error
[class] => td_util
[type] => ::
[args] => Array
(
[0] => /var/www/virtual/mysite.biz/htdocs/wp-content/plugins/td-composer/legacy/common/wp_booster/td_module.php
[1] => td_module: td_module_15($post): $post is not WP_Post
)
)
[1] => Array
(
[file] => /var/www/virtual/mysite.biz/htdocs/wp-content/plugins/td-composer/legacy/common/wp_booster/td_module_single_base.php
[line] => 16
[function] => __construct
[class] => td_module
[object] => td_module_15 Object
(
[td_post_theme_settings] =>
[is_single] =>
[post] =>
[title_attribute] =>
[title] =>
[href] =>
[module_atts:td_module:private] => Array
(
)
[td_review:protected] =>
[is_review:protected] =>
[post_thumb_id:protected] =>
)
[type] => ->
[args] => Array
(
[0] => stdClass Object
(
[ID] => 0
[post_status] => draft
[post_author] => 0
[post_parent] => 0
[post_type] => page
[post_date] => 0
[post_date_gmt] => 0
[post_modified] => 0
[post_modified_gmt] => 0
[post_content] =>
[post_title] =>
[post_excerpt] =>
[post_content_filtered] =>
[post_mime_type] =>
[post_password] =>
[post_name] =>
[guid] =>
[menu_order] => 0
[pinged] =>
[to_ping] =>
[ping_status] =>
[comment_status] => closed
[comment_count] => 0
[is_404] =>
[is_page] =>
[is_single] =>
[is_archive] =>
[is_tax] =>
)
)
)
[2] => Array
(
[file] => /var/www/virtual/mysite.biz/htdocs/wp-content/plugins/td-composer/legacy/Newsmag/includes/modules/td_module_15.php
[line] => 12
[function] => __construct
[class] => td_module_single_base
[object] => td_module_15 Object
(
[td_post_theme_settings] =>
[is_single] =>
[post] =>
[title_attribute] =>
[title] =>
[href] =>
[module_atts:td_module:private] => Array
(
)
[td_review:protected] =>
[is_review:protected] =>
[post_thumb_id:protected] =>
)
[type] => ->
[args] => Array
(
[0] => stdClass Object
(
[ID] => 0
[post_status] => draft
[post_author] => 0
[post_parent] => 0
[post_type] => page
[post_date] => 0
[post_date_gmt] => 0
[post_modified] => 0
[post_modified_gmt] => 0
[post_content] =>
[post_title] =>
[post_excerpt] =>
[post_content_filtered] =>
[post_mime_type] =>
[post_password] =>
[post_name] =>
[guid] =>
[menu_order] => 0
[pinged] =>
[to_ping] =>
[ping_status] =>
[comment_status] => closed
[comment_count] => 0
[is_404] =>
[is_page] =>
[is_single] =>
[is_archive] =>
[is_tax] =>
)
)
)
[3] => Array
(
[file] => /var/www/virtual/mysite.biz/htdocs/wp-content/plugins/td-composer/legacy/Newsmag/loop.php
[line] => 34
[function] => __construct
[class] => td_module_15
[object] => td_module_15 Object
(
[td_post_theme_settings] =>
[is_single] =>
[post] =>
[title_attribute] =>
[title] =>
[href] =>
[module_atts:td_module:private] => Array
(
)
[td_review:protected] =>
[is_review:protected] =>
[post_thumb_id:protected] =>
)
[type] => ->
[args] => Array
(
[0] => stdClass Object
(
[ID] => 0
[post_status] => draft
[post_author] => 0
[post_parent] => 0
[post_type] => page
[post_date] => 0
[post_date_gmt] => 0
[post_modified] => 0
[post_modified_gmt] => 0
[post_content] =>
[post_title] =>
[post_excerpt] =>
[post_content_filtered] =>
[post_mime_type] =>
[post_password] =>
[post_name] =>
[guid] =>
[menu_order] => 0
[pinged] =>
[to_ping] =>
[ping_status] =>
[comment_status] => closed
[comment_count] => 0
[is_404] =>
[is_page] =>
[is_single] =>
[is_archive] =>
[is_tax] =>
)
)
)
[4] => Array
(
[file] => /var/www/virtual/mysite.biz/htdocs/wp-includes/template.php
[line] => 722
[args] => Array
(
[0] => /var/www/virtual/mysite.biz/htdocs/wp-content/plugins/td-composer/legacy/Newsmag/loop.php
)
[function] => require_once
)
[5] => Array
(
[file] => /var/www/virtual/mysite.biz/htdocs/wp-content/plugins/td-composer/legacy/Newsmag/index.php
[line] => 30
[function] => load_template
[args] => Array
(
[0] => /var/www/virtual/mysite.biz/htdocs/wp-content/plugins/td-composer/legacy/Newsmag/loop.php
[1] => 1
)
)
[6] => Array
(
[file] => /var/www/virtual/mysite.biz/htdocs/wp-includes/template-loader.php
[line] => 98
[args] => Array
(
[0] => /var/www/virtual/mysite.biz/htdocs/wp-content/plugins/td-composer/legacy/Newsmag/index.php
)
[function] => include
)
)
Hello !
Sorry for misunderstanding your issue.
Here is the CSS for the button background: .wp-block-button:not(.is-style-outline) .wp-block-button__link {
background-color:blue;
}
The code must be inserted here: https://www.screencast.com/t/J1Nxw5s5
I hope this was helpful !
Thank you !
Hi,
Please notice that we take in order of time the topics ( time when was post the question ) to answer the question, and if you post/replay again in your topic the time will change and will be move to recent question, therefore the answer will be delay.
The theme have only one Lazy Loading, the one from theme panel -> https://forum.tagdiv.com/newsmag-loading-image-effects/ the other effects are just animations set with css.
Thank you for your understanding!
Hi,
If you are referring on these elements -> https://i.imgur.com/wk609QH.png then you can use this custom css -> https://i.imgur.com/0cXOfRB.png
.wpb_content_element img.wp-image-749 {
border: 2px solid black;
border-radius: 50px;
}
You can adjust it after your needs.
Hope this will help!
Thank you!
Hi,
That space can be edit using tagDiv Composer, edit the page, click on the element -> https://www.screencast.com/t/b5rLIcMBxZK of row of element and set in css tab the margin top an bottom ( if you want to reduce the margin set it with “-” for example -48)
Hope this will help you!
Thank you!
Hi,
You are using a footer page, so the background image from theme panel will not work, you’ll need to edit that footer page with tagDiv Composer -> https://i.imgur.com/lQSMGwo.png click on image, after that on row and check the css tab -> https://i.imgur.com/uI607IF.png
Hope this will help!
Thank you!
Hi,
From what I can see you are using a cloud header from tagDiv Cloud Library, so you’ll be able to edit it using with tagDiv Composer -> https://i.imgur.com/j2B8LNR.png click on edit template -> https://i.imgur.com/rMWCuMu.png after that use the drag and drop to move the elements ( search) -> https://i.imgur.com/CVdHszk.png also make sure that the search is set to align right -> https://i.imgur.com/gUvrIki.png and the menu not.
Also you can use a custom css here is an example -> https://i.imgur.com/W1JGZrW.png
.tdb_header_logo, .tdb_header_menu{
float: left!important;
}
The code need to be set in theme panel> custom code> custom css.
Thank you!
Hi,
In order to remove the gap you can edit the page and set to the first row a margin top
-40 https://www.screencast.com/t/XHpfT49oE9U ( in you case 48px is the gap so you can set -48 margin top) or you can use custom css -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
If you need help whit this please provide a link were I can inspect the problem, in this way I will be able to provide you the right css.
You can change the gap between the elements using tagDiv Composer -> https://www.screencast.com/t/b5rLIcMBxZK
Thank you!
Hi,
Please do not edit the theme files, because these will be lost when you’ll make a update, you can use the fields from theme panel custom css -> https://i.imgur.com/lhYAchf.png set there the css like this -> https://i.imgur.com/gXK6cZw.png
Thank you!
Hi,
Unfortunately there is no option to disable the search, but this can be done with custom css -> https://i.imgur.com/GnF8MdM.png
#td-top-search {
display: none;
}
The code need to be set in theme panel> custom code> custom css.
Thank you for your understanding!
Can someone please break down every single one of this css for me so I can check what I need to keep and what I need to delete. All of this was done about 2/3 years ago so I do not remember most of it.
Thank you
@media (max-width: 767px){
.td-scroll-up {
display: block!important;
}
}
.td-post-category, .td-entry-category, .td-big-grid-meta .td-post-category, .td-module-comments{
background-color:#a00000;
}
.td-instagram-main{
border-bottom:9px solid #d93a00;
}
.td-scroll-up{
background-color: rgba(68,68,68,0.45)!important;
}
.td-module-comments{
background-color:#a00000;
}
@media (max-width: 767px){
.td-main-content-wrap {
padding-top:0;
}
}
.td-module-comments a{
background-color:#cecece!important;
}
.mycustomclass span{
background-color:#222222!important;
}
.mycustomclass{
border-color:#222222!important;
}
.td-icon-star, .td-icon-star-half, .td-icon-star-empty{
color:#d93a00;
}
.td_module_6 .entry-title{
font-weight: 500!important;
}
.widget_display_topics{
margin-bottom: 23px!important;
}
.widget_display_forums{
margin-bottom: -36px!important;
}
@media(max-width: 767px){
.td-footer-instagram-container .td-footer-instagram-title .td-footer-instagram-user-link{
display:initial!important;
}}
.td-search-wrap-mob .td-search-input span{
font-size: 30px!important;
}
@media (max-width: 767px){
.td_block_big_grid_12 .td-big-grid-wrapper .td-big-grid-post:last-child .td-module-thumb {
margin-left: 0px!important;
}}
Between the ads on the sidebar is a lot of space and some alliment issues.
im useing this as css bud does notting:
.td-g-rec-id-custom_ad_3 { margin-left: 0; }
.ajdg_grpwidgets,
.td-a-rec-id-sidebar,
.td-g-rec-id-custom_ad_3 .adsbygoogle {
margin-bottom: 10px!important;
}
.td-g-rec-id-custom_ad_4 { margin-left: 0; }
.ajdg_grpwidgets,
.td-a-rec-id-sidebar,
.td-g-rec-id-custom_ad_4 .adsbygoogle {
}
.wpa {
float: left !important;
}
.widget .g {
max-width: 100%;
}
Having great difficulty changing the background image of the mobile menu dropdown. It currently has the demo’s image. I believe I have identified the css:
.td-menu-background, .td-search-background {
background-image: url(‘http://secureservercdn.net/198.71.233.68/4a2.614.myftpupload.com/wp-content/uploads/2020/01/mobile-bg.jpg’);
}
But when I put a new url here, I still get the demo image. Please help!
changing over my medium-sized health blog (2000 pages) to newspaper was almost painless
… unless …. the missing toggle and accordion function.
so here my solution
A) use plugin shortcodes-ultimate from Vlad A…
to make it much easier to call the toggles (and to be able to reuse my old websites source without any changes) I get the shortcode-call rewritten using a simple 3-liner php-function
I have all kind of tiny little php-functions that I collected over the years, to use all of them in my several pages I created my “own plugin” that carries those functions. You might just add following code to the newspapers child-theme functions.php
// for newspaper adding some toggle functions
function toggle_function( $atts , $content=null) {
extract( shortcode_atts( array(
'title' => '',
'class'=>'',
'style'=>'',
), $atts ) );
/* für shortcodes ultimate */
$ss = '[su_accordion][su_spoiler style="fancy" open="no" title="' . $title . '"]' . do_shortcode($content) . '[/su_spoiler][/su_accordion]';
return do_shortcode($ss);
}
add_shortcode( 'toggle', 'toggle_function' );
add_shortcode( 'toggle1', 'toggle_function' );
add_shortcode( 'toggle2', 'toggle_function' );
add_shortcode( 'toggle3', 'toggle_function' );
add_shortcode( 'toggle_framed', 'toggle_function' );
add_shortcode( 'toggleZ', 'toggle_function' );
by creating my own shortcode [toggle] [toggle1] [toggle2] [toggle3] …. I am able to have nested toggles
you just call them via
[toggle title="this is the toggles title"]
.... here is the text inside the toggle ....
[/toggle]
B) use plugin accordion shortcodes from Phil Buchanan
I actually use B in newspaper and had to use A for some different theme which messed up Phil’s plugin but was OK with Vlads plugin. I think that Vlads Shortcodes ultimate is easier and better integrated
use following functions.php addition
function toggle_function( $atts , $content=null) {
extract( shortcode_atts( array(
'title' => '',
'class'=>'',
'style'=>'',
), $atts ) );
/* für accordion shortcode */
$ss = '[accordion title="" open1st="0" openAll="0" style="toggle"][accordion_item title="' . $title . '"]' . do_shortcode($content) . '[/accordion_item][/accordion]';
return do_shortcode($ss);
}
add_shortcode( 'toggle', 'toggle_function' );
add_shortcode( 'toggle1', 'toggle_function' );
add_shortcode( 'toggle2', 'toggle_function' );
add_shortcode( 'toggle3', 'toggle_function' );
add_shortcode( 'toggle_framed', 'toggle_function' );
add_shortcode( 'toggleZ', 'toggle_function' );
here are some hints for some CSS that you add to your childs styles.css
/* Accordion Styles */
.accordion { margin: 18px 0px;border: solid lavender 6px;}
.accordion-title {margin:0;padding: 14px 14px 14px 20px;color:royalblue;cursor:pointer;font-weight:900;border-radius: 5px;overflow: hidden; border:1px solid gray;background:#f9f9f9;}
.accordion-title:hover {color:red;cursor: -webkit-grab; cursor: grab;font-weight:900;}
.accordion-title:before{content:”+ | “;width:49px;height:100%;border-width:0 0px 0 0;border-style:solid;text-align:left;}
.accordion-title:first-child {border: none;}
.accordion-title.open {cursor: default;}
.accordion-title.open:before {content:”- | “;width:49px;height:100%;border-width:0 0px 0 0;border-style:solid;text-align:left;}
.accordion-content {padding:20px 6px 15px 6px;background-color:whitesnow;}
/* Accordion Styles ende */
Hello Calin,
thanks for the answer. The problem is and was that I changed the font size of the menu in the theme panel (to 19x instead of default). Now I have reset it to the default size, which works fine. But I want to change the size of the menu to 19px for the full window size and when I lower the display resolution of the window, the font size should be reduced (11px for 768 to 1018px). I have tried to edit this inside the theme editor “style.css”, but my size is overwritten by some other line of code. The question is where to force the size of the fonts? Now the question is, where can I change the size of the font (outside the theme panel)? 
Hi all!
I have added a table into a text field, which works fine! I just can’t get the border to “0”.
I have of course tried extra css … can’t get it hidden … Please help!
Thank you!
https://fm.lujong.org/ (the part that says: “The Benefits from Lu Jong”, it has 6 squares around the image that I would need the borders to be gone or at least be “white”)
Good evening
I’d like to know how I can reduce the space above the footer.
I wish the detachment could not be seen.
Here is an image to better understand and the css code to customize the site inserted so far.
Thank you
Image: https://www.novabbe.com/wp-content/uploads/2020/01/spaziodaridurre.jpg
Code:
@media (min-width: 768px){ .single .td-post-template-8 .td-post-header { height: 200px; } }
.td-page-title {
display: none;
}
.page-id-7096 .td-crumb-container{
display:none;
}
.td-related-title .td-related-right {
display: none;
}
.pagination {
clear:both;
padding:20px 0;
position:relative;
font-size:11px;
line-height:13px;
}
.pagination span, .pagination a {
display:block;
float:left;
margin: 2px 2px 2px 0;
padding:6px 9px 5px 9px;
text-decoration:none;
width:auto;
color:#fff;
background: #555;
}
.pagination a:hover{
color:#fff;
background: #3279BB;
}
.pagination .current{
padding:6px 9px 5px 9px;
background: #3279BB;
color:#fff;
}
Hello, i installed ssl on my website https://www.dailypress.gr
The problem is that the footer keeps loading an image from http.
<style>
.tdi_141_989_rand_style > .td-element-style-before {
content:” !important;
width:100% !important;
height:100% !important;
position:absolute !important;
top:0 !important;
left:0 !important;
display:block !important;
z-index:0 !important;
background-image:url(“http://dailypress.gr/wp-content/uploads/2020/01/footer_bg.jpg”) !important;
opacity:0.1 !important;
background-size:cover !important;
background-position:center top !important;
}
</style>
I tried changed the footer background image from the theme options and also from the tag div checked if there is any background image loaded from css, but no.
How can i change that css?
I want to know that how can I reduce the space padding after the header of the blog. Let me be specific, The space padding after the header menu and before the main content body.
I don’t really have too much CSS knowledge, but after looking at the massive CSS code of the theme, I was a bit confused and decided not to play with the code. So, a little help needed here.
Link – Thats Breaking
Theme – Newspaper
Blog platform – WordPress
Let me know if I missed any info.
It disappears in the mobile version, responsive, in https://cursoespirita.com
Any css that helps? (I edit, I have already been able to solve it, with the code and updating cache.)
Another issue. I have an external chat app button, which hides part of the subfooter’s information, any solution for more space under the subfooter?
Thanks
Sir, the main issue with big grid flex 2 is that it is showing like this: https://ibb.co/Pzh11Lv in mobile device whereas I want it like this in mobile devices: https://ibb.co/tXXwZTH.
Now, you can say that I can use big full grid 8 but then the problem is, I want that image text to be displayed on the bottom left side of the image like this: https://ibb.co/zXpDkVB.
I think this website is using some custom css code with big full grid 8.
Hello !
Please note that scoring a page speed of 100 is not necesarily impossible but your whole website has to be optimized.
For the unused css you can try a 3rd party optimizer but we have not tested any in order to recommend it.
Thank you for your understanding !
I have encounter this issue in installing the Newspaper theme
”
Unpacking the package…
Installing the theme…
The package could not be installed. The theme is missing the style.css stylesheet.
Theme installation failed.
”
Please guide me on how to solve it.
Thanks.
Hello !
You can adjust that by using the CSS adjustments found in here: https://www.screencast.com/t/6G5wSnEG But please note that I suggest to edit the css and then see your page without composer active.
I hope this was helpful !
Thank you !
Hello !
This can be achieved by using this custom css code as you can see here: .td-pb-article-list .td-main-sidebar {
display: none;
}
The code must be inserted here: https://www.screencast.com/t/s61BcemS2eW
I hope this was helpful !
Thank you !
