- 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
- NewspapertagDiv Composer Tutorial
- NewspaperTheme modules and blocks
- NewspaperThe Mobile Theme
- NewspaperCompare theme files – Winmerge tutorial
- NewspaperUsing Other Ads
- NewspaperBlock settings tutorial
- Using custom fonts
- Using typekit fonts
- NewspaperChild Theme Support
- NewspaperHow to Make the Site Faster
Hello fakamaka,
If you want to have the custom title and colours for some desired elements, you can use Text with Title element from Visual Composer without text and you should leave just the Title, like this -> http://screencast.com/t/5Q9zTjMW and then you have to use a bit of CSS code to decrease the extra white spaces. The result you should see here -> http://screencast.com/t/vzu09EOmc
The code is ->
.td_block_text_with_title{
padding-bottom: 0;
}
.td_block_text_with_title .block-title {
margin-bottom:2px;
}
Hope this helps!
Thanks.
Hello Walther,
Please try the code below and place it in Theme panel->Custom CSS area.
The code is ->
.post .td-post-sub-title {
color:#484848;
}
Thanks.
That i’m not certain. It may require a few css adjustments after the implementation.
Thanks.
Hi,
I am trying to change the color of the subtitles in posts. I would like the subtitles to be a bit darker.
I have tried this and it hasn’t worked:
.post .td-sub-title {
color:#484848;
}
Could you please help me with the correct CSS?
Thank you in advance.
Walther
Hello mystudent,
You can try the code below and place it in Theme panel, Custom CSS area.
The code is ->
.td-boxed-layout #td-outer-wrap{
width:1116px;
}
Hope this helps!
Thanks.
Hi,
In order to change the post titles on block 12 you need to use this css:
.td_block_12 .td-module-title a{
color:red!important;
}
This will work on any block (almost) if you change the block number to the one you intent to change the color to.
Thanks.
Salut!
1)The footer widgets are found here: http://screencast.com/t/E8V4SkYU9A6 If youhave not modified the theme files, then you can remove your widgets from there.
2)you can remove the space using this css code:
.td_block_trending_now.td_block_wrap{
padding-bottom:0!important;
}
.test{
margin-bottom: 0!important;
}
.td-main-page-wrap{
padding-top:20px!important
}
(as a side-note: you have a container in there with a class called ‘test’ that also created white space)
3)To display ads between posts on a specific category page are required lots of customizations and also many tests in order to achieve the desired result. Basically you need to edit the loop for that specific category page such that to display a specific ad-spot after a given number of posts.
All this customizations falls beyond the support can offer you so if you’re not aware of the steps you need to take in this regard please consider hiring a freelancer to do this for you as we can’t offer custom services at the moment.
4)If you want to remove the ad on post style 1, you can do it from here: http://screencast.com/t/RRXPmQTF
For the top ad, it will be a bit trickier as the top ad displays on all post templates so you need to ad a few conditions to the code where the ad is being created. Please use this code: http://pastebin.com/b5ZWGEhf
and replace this part here: http://screencast.com/t/uiYhFyE0rF
This will disable the article top ad for post style 1 and now you can ad a custom ad in the top of the file with a do_shortcode function:
And add it in the file like so: http://screencast.com/t/sKAM9mtVmj
Now if you do not have an article top ad, the text will fill the white space besides the featured image.
Thanks.
Sorry for missunderstanding, maybe is my fault.
i want some pages to have one big grid 5, which will saw all the posts from one category in one big grid 5 (all posts in lines with three posts at every lne, like big grid 5).
with your answer in a prebuying queston:
2. The Big Grid blocks have a limit for posts in the code so you can change it there. Lets take your example Big Grid 5, here you can change the limit – http://screencast.com/t/XmOZHeiWG8F and the result – http://screencast.com/t/EX7UYmjZbK Please note that the Big Grids were designed to handle only a specific number of articles and for some of them you may need additional customizations(big grid 5 seems to work fine even you set it to display more posts). So if you have also basic html/css experience should not be an issue.
I modfied a little the file wp-content/themes/Newspaper/includes/shortcodes/td_block_big_grid_5.php
<?php
/**
*
* Class td_block_big_grid_5
*/
class td_block_big_grid_5 extends td_block {
//const POST_LIMIT = 20;
function render($atts, $content = null){
//Gia na parw to plithos twn posts sthn katigoria
$postsInCat = get_term_by('slug','men-s-lifestyle','category');
$postsInCat = $postsInCat->count;
echo $categories[0]->term_id;
// for big grids, extract the td_grid_style
extract(shortcode_atts(
array(
'td_grid_style' => 'td-grid-style-1'
), $atts));
//$atts['limit'] = self::POST_LIMIT;
$atts['limit'] = $postsInCat;
parent::render($atts); // sets the live atts, $this->atts, $this->block_uid, $this->td_query (it runs the query)
$buffy = '';
$buffy .= '<div class="' . $this->get_block_classes(array($td_grid_style, 'td-hover-1')) . '">';
$buffy .= '<div id=' . $this->block_uid . ' class="td_block_inner">';
$buffy .= $this->inner($this->td_query->posts); //inner content of the block
$buffy .= '<div class="clearfix"></div>';
$buffy .= '</div>';
$buffy .= '</div> <!-- ./block -->';
return $buffy;
}
function inner($posts) {
$postsInCat = get_term_by('slug','men-s-lifestyle','category');
$postsInCat = $postsInCat->count;
$buffy = '';
$td_block_layout = new td_block_layout();
if (!empty($posts)) {
$buffy .= '<div class="td-big-grid-wrapper">';
$post_count = 0;
foreach ($posts as $post) {
$td_module_mx12 = new td_module_mx12($post);
$buffy .= $td_module_mx12->render($post_count);
$post_count++;
}
//if ($post_count < self::POST_LIMIT) {
if ($post_count < $postsInCat) {
//for ($i = $post_count; $i < self::POST_LIMIT; $i++) {
for ($i = $post_count; $i < $postsInCat; $i++) {
$td_module_mx_empty = new td_module_mx_empty();
$buffy .= $td_module_mx_empty->render($i);
}
}
$buffy .= '</div>';
}
$buffy .= $td_block_layout->close_all_tags();
return $buffy;
}
}
But there is a need to make more pages like this. In the one for category “Men’s Lifestyle” is working perfect.
But if i have at the menu three menus “a,”b and c” (which are coming from three diferent pages), and in every page i have a big grid 5 which in settings have at category filter, at page “a” the category “a”, at page “b” the category “b” and at page “c” the category “c”, there is no way to change the code and some how to take the category which we have set at settings in the big grid 5?
so in this code:
$postsInCat = get_term_by('slug','men-s-lifestyle','category');
$postsInCat = $postsInCat->count;
the :”men-s-lifestyle” to come from code, or to change it at $postsInCat = get_term_by('id',20,'category');"
and the number (id) 20 to can take it with code before.?
I hope to understand what i mean now.
The example page i created wth the above modificaton , you can see it here: http://testgeolits.myipservers.gr/Olaballa/?page_id=136
Hi,
From your screenshot, I think you are trying to change the block title from the grid. That is not a page title but rather the post titles from a particular block. These cannot be changed with the theme settings, you will have to use css to do it.
For example on big grids: http://screencast.com/t/zeJsLaWcXFF9
.td-big-grid-post .entry-title a{
color:red!important
}
You can add the code in the theme panel- custom css box.
Thanks.
Hi,
You can use the theme panel for css adjustments. You do not have to edit style.css. Please add the code here:
http://screencast.com/t/p350ZKTuhc
Thanks.
Hi
Try this css in theme panel > custom code > custom css: http://screencast.com/t/Cjg6PN4I
.td-review-summary-content{
font-size: 15px;
}
.td-review .block-title {
background-color: white;
color: black
}
Let me know how it goes and if this is not what you mean please provide more specific details about what your trying to do, also a screen pointing the desired result will help, so I can inspect this closer and get back to you with the proper code.
Thanks!
Hi
Try this css in theme panel > custom code > custom css to remove the category tags from big grid: http://screencast.com/t/Ho8FUsz4sjx
.td-big-grid-post .td-post-category{
display: none;
}
To remove the category tag from slider from slider just deactivate it from theme panel > block settings > category tags on modules/blocks: http://screencast.com/t/VcTBnCDshf4
Thanks!
Hi
You can use one of theme’s ad-spots to display the ad. First insert the html ad’s code in one of custom ad-spots from theme panel > ads then use do_shortcode() function to display the ad below the logo like here: http://screencast.com/t/p9KCCPun
<div class="new-ad">
<?php echo do_shortcode('[td_block_ad_box spot_id="custom_ad_1"]'); ?>
</div>
Add this css in theme panel > custom code > custom css:
.new-ad{
clear: both;
}
I’ve used custom ad 1 for this example but you can use any custom ad, just adapt the shortcode. For example if you use custom ad 5 the shortcode will be: td_block_ad_box spot_id="custom_ad_5"
The result should be like here: http://screencast.com/t/HYBdDZM0W0h
Thanks!
-
This reply was modified 10 years by
Andrei L..
Hello TagDiv,
Where can I possibly find the CSS for the review system?
At the moment I would like to change these following:
– Font: I can’t seem the find where this is in the font panel.
– Headings: I would like to remove the standard black box around the heading and float-left this. Similar to how this code was used: .block-title span {
background-color:white;
}
Please let me know.
Thanks,
Hi
Note that this block wan’t designed to be displayed on two colons on mobile devices and there is a chance to appear some issues when you’re trying to change its layout. Try this css instead of the first one, it should work fine now: http://screencast.com/t/fviNy2t48
@media (max-width: 767px){
.td_block_16 .td-block-row .td-block-span4{
width: 50% !important;
}
.td_block_16 .td-block-row:after{
clear: right;
}
.td_block_16 .entry-title{
font-size: 13px;
}
Thanks!
Hello Ronaldo,
If you want to move with its container, you have to use the following code in your custom CSS box.
The code is ->
.td-big-grid-post .td-module-meta-info{
position:relative;
top: -420px!important;
}
Please notice that this review feature for this kind of Block is closely linked to the date (get_date ->get_review). Also, if your post will do not have the review, the date will be displayed.
Hope this helps!
If is not what you want to achieve and if you want more additional customizations in the theme, please consider hiring a freelancer/developer to help you because we cannot provide customization services at the moment, sorry!
Thank you for the message!
Hello Ronald,
Unfortunately, our theme does not have such an option to insert the text in front of these stars, sorry! If you want to move these stars review on the top of the big slide, you should use a bit of CSS code. Please try the code below and place it in Theme panel->Custom CSS area.
The code is ->
.td-big-grid-post .entry-review-stars{
top: -420px!important;
}
The result you should see here -> http://screencast.com/t/mi23u6yGI
Hope this helps and let us know how it goes!
Thank you for the message!
I quote myself from above:
We are working on fixing this in a future version of the theme.
Sorry for the inconvenience.
Here is a simple solution. Activate the article top like/share and then hide it with css
.td-classic-sharing{
display:none!important;
}
Now the classic sharing option will not be available and the tweeter button will work as expected.
Thanks.
-
This reply was modified 10 years by
Bogdan B..
Hello masc,
If you want to change the color of the text title for Big Grid 6, style 4, you have to use a bit of CSS code to do that. Please try the code below and place it in Theme panel->Custom CSS area.
The code is ->
.td-grid-style-4 .entry-title {
background-color: rgba(77,18,23,.9);
}
The result you should see here -> http://screencast.com/t/XFhOja74hy
Please notice that you can change the value of the background-color as you wish.
Thank you for the message!
Hello medeiros7,
If you want to move the category tag location on the top left of the image, you have to use a bit of CSS code to do that. Please try the code below and place it in Theme panel, Custom CSS area.
The code is ->
.td-module-image .td-post-category {
top: 0 !important;
bottom:inherit!important;
}
The result you should see here -> http://screencast.com/t/HfoUbK94Y
Thank you for the message!
Hi,
Unfortunately if the particular block has this design, you cannot make the thumbnails the same size unless you alter the theme files. You can simply chose a different block as there are 21 to chose from as an alternative (http://demo.tagdiv.com/newspaper/block-4/) because altering the block files will require php knowledge and css for positioning. It will not be a walk in the park. If you want to modify the blocks then maybe the theme api can help: https://forum.tagdiv.com/td_api_blockadd/ (coding knowledge required)
Thank you!
Hi
Try this css in theme panel > custom code > custom css: http://screencast.com/t/sN3crPJ5foX
@media(min-width: 768px){
.td-a-rec-id-content_top{
display: none;
}
}
Note that the disable option from theme panel works only for ad-sense code, for others ad types that option will not be applied.
Thanks!
Hi
Try this css in theme panel > custom code > custom css: http://screencast.com/t/KqYttQKyEMC
@media (max-width: 767px){
.td_block_16 .td-block-row .td-block-span4{
width: 49% !important;
}
}
Thanks!
Hi,
I will try to look at other solution if the error still persist.
Ok, done with that.
How about the white spaces in between the header and the featured image?
I’ve tried to look at the css but nothing much I can do. Not really good in doing css editing.
Hope you can assist to eliminate this white space.

Thank you.
Regards
Thanks again Bogdan. I’ve updated it, very nice 🙂 Only thing left is to get rid of this linebreak as you see here:

🙂
(Yeah I know I need to read up on CSS)