- 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,
the featured images are not aligned center so if your image is smaller than 696 px which is the container size, they will be aligned left. You can use this custom css code in your theme panel-> custom css box to align images to the center:
.td-post-featured-image{
margin-left:auto;
margin-right:auto;
display:table;
}
Thank you!
Hi,
It could be removed with CSS, as long as you don’t use Adsense. If Adsense is used it is not recommended to remove it with CSS. I could take a look at the page and try to give you a solution, please provide a link to it.
Thanks
Hi,
That code seems to work – https://www.screencast.com/t/w7OAfl8ooAL
I entered that in the mobile theme custom CSS code and the buttons color is changed
– https://www.screencast.com/t/RXetWJ5LPZ
Maybe try and clear the cache of the browser you are testing with, and the website cache.
Thanks
Hello jauburn,
If you want this such a customization, notice that you should implement it yourself and create the custom CSS code according to the following useful guide from here -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ If you are not aware of the steps which are needed to take in this case, please consider hiring a freelancer/developer to help you because we cannot provide custom work at the moment, sorry!
Thanks for the message!
Hello,
You have to stretch the row to full width from the row settings in tagdiv composer and then set a -48px negative margin in the css box model: https://www.screencast.com/t/vUGYi2E5
Thank you!
Hi,
Indeed, the mobile theme will not display a drop-down. It should display all your categories however, but it seems there is a design issue. I will add this on our list and it will be fixed as soon as possible.
In the meantime you could enter this code in Theme panel->Mobile theme->Custom CSS section, to create some more space in the category header for the categories
– https://www.screencast.com/t/gqUKyllEkX
.td-category-header .td-category {
max-height: 250px;
}
Sorry for the inconvenience.
Thanks
Hello,
The next and prev block buttons can be changed using a css code. Try this code in your custom css spot in the theme panel custom code section:
.td-next-prev-wrap a{
border: 1px solid #ff0000;
color: #ff0000;
}
The hover color however is affected by the block title background color. It affects the hover colors fro the entire block.
Thank you!
Hello karayel,
Please keep in mind that you should follow the same way for achieving the code which will change your buttons colors. Please try using the Inspector Browser, find the class for those buttons and use the CSS code you want. -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thanks for your understanding!
Hello,
If you want to add custom css to only affect one block but not the other, you have to use the extra class setting: https://www.screencast.com/t/tJFrrtzy
You can then use your custom css to target the specific block:
.mycustomclass{
border: 1px grey solid;
box-shadow: 1px 0 20px grey;
}
Thanks
That code would be the only solution in this case. The ubermenu plugin seems to have included itself as part of the header menu container, so hiding it with CSS would be the easiest and maybe only solution
– https://www.screencast.com/t/Nep5X2BpAQ
An alternative to that would be to remove the elements of the default header menu from the code, but that may be difficult because the ubermenu is part of the default menu so the default.
The code works, entering it in the theme stylesheet will apply it more quickly, enter it there and then clear all caching or CDN if used.
Hello Julia white,
You should try using the following code and place it in Theme panel -> Custom CSS area.
The code is ->
@media (max-width:767px){ .td_module_mx10{
display:none!important;
}}
The result is here -> https://www.screencast.com/t/dcWCI66OLE
Thanks for your understanding!
I am designing a page and using Big Grid 1, Style 4 (aka “Bottom Box”). You can see what it looks like in your own example:
https://demo.tagdiv.com/newspaper/big-grid-4/
You can see the bottom box behind the white text is BLUE.
1) is there really no way to change that blue without custom CSS?
2a) If not, can you tell me the custom CSS?
2b) I found custom CSS in the forum archives but it isn’t working. I can change the color slightly, but not completely. For instance, if I change the color to black or gray in the CSS, it doesn’t actually change at all. If I change it yellow, it becomes green.
This is the code I have been trying:
.td-grid-style-4 .td-big-grid-meta {
background-color: rgba(255, 0, 0, 0.7);
}
.td-grid-style-4 .td-module-thumb a:last-child:before {
display: none;
}
I adjust the background-color, but it just always stays a shade of blue.
Is there another class it is inheriting from?
please advise.
thanks!
hi. I am trying to design a homepage.
I am using Big Grid 1. It has 48px of padding on top. I want to make it 10px.
Using tagdivcomposer, I enter this in the Live CSS Editor:
.td-main-page-wrap {
padding-top: 10px;
}
I can see the change happen successfully in the preview, I save and close it, but the change never appears on the site. When I go back in to the CSS editor, the CSS I had put in there is gone. What am I doing wrong?
How do you change the color for the woocommerce add to cart button for the mobile plugin?
I put the code into custom code css for the mobile theme plugin
.woocommerce .product a.button {
background: #FF9900;
}
unfortunately no effect is seen.
I would appreciate any help. Thank you for your time.
Hi, i notice this query is always present as a slow..how can i fix it.. thanks
SELECT DISTINCT YEAR( post_date ) AS year, MONTH( post_date ) AS month
FROM wp_posts
WHERE post_type = ‘attachment’
ORDER BY post_date DESC
In….
do_action(‘admin_enqueue_scripts’)
wp-includes/plugin.php:453
load_wp_admin_css()
wp-content/themes/Newspaper/includes/wp_booster/td_wp_booster_functions.php:398
wp_enqueue_media()
wp-includes/media.php:3432
Is there a custom CSS modification you could give me that would put author name on top and blog post title below?
I changed back to h2 because the numbers and the heading were not aligning properly unless I removed the code “top:0” from the CSS code for the smart lists.
Look under Newspaper>includes>demos>construction>pages>homepaage.txt and copy the code inside the file to a new page. You can then try to look at which code represents that section and copy it out of the rest of the code. Guss it should be this code (edit it with td composer)
[vc_row tdc_css="eyJhbGwiOnsiZGlzcGxheSI6IiJ9fQ==" el_class="td-our-services"][vc_column][td_block_title custom_title=”WHAT WE DO” block_template_id=”td_block_template_13″ big_title_text=”OUR SERVICES” tdc_css=”eyJhbGwiOnsibWFyZ2luLXRvcCI6IjE0MCIsIm1hcmdpbi1ib3R0b20iOiI2MCIsImNvbnRlbnQtaC1hbGlnbiI6ImNvbnRlbnQtaG9yaXotY2VudGVyIiwiZGlzcGxheSI6IiJ9LCJsYW5kc2NhcGUiOnsibWFyZ2luLXRvcCI6IjgwIiwibWFyZ2luLWJvdHRvbSI6IjQwIiwiZGlzcGxheSI6IiJ9LCJsYW5kc2NhcGVfbWF4X3dpZHRoIjoxMTQwLCJsYW5kc2NhcGVfbWluX3dpZHRoIjoxMDE5LCJwb3J0cmFpdCI6eyJtYXJnaW4tdG9wIjoiODAiLCJtYXJnaW4tYm90dG9tIjoiNDAiLCJkaXNwbGF5IjoiIn0sInBvcnRyYWl0X21heF93aWR0aCI6MTAxOCwicG9ydHJhaXRfbWluX3dpZHRoIjo3NjgsInBob25lIjp7Im1hcmdpbi10b3AiOiI1MCIsIm1hcmdpbi1ib3R0b20iOiIzMCIsImRpc3BsYXkiOiIifSwicGhvbmVfbWF4X3dpZHRoIjo3Njd9″][/vc_column][/vc_row][vc_row full_width="stretch_row_1600 td-stretch-content" gap="10" tdc_css="eyJsYW5kc2NhcGUiOnsibWFyZ2luLXJpZ2h0IjoiLTI0IiwibWFyZ2luLWxlZnQiOiItMjQiLCJkaXNwbGF5IjoiIn0sImxhbmRzY2FwZV9tYXhfd2lkdGgiOjExNDAsImxhbmRzY2FwZV9taW5fd2lkdGgiOjEwMTksInBvcnRyYWl0Ijp7Im1hcmdpbi1yaWdodCI6Ii0xIiwibWFyZ2luLWxlZnQiOiItMSIsImRpc3BsYXkiOiIifSwicG9ydHJhaXRfbWF4X3dpZHRoIjoxMDE4LCJwb3J0cmFpdF9taW5fd2lkdGgiOjc2OH0="][vc_column width="1/3" tdc_css="eyJsYW5kc2NhcGUiOnsicGFkZGluZy1yaWdodCI6IjIiLCJwYWRkaW5nLWxlZnQiOiIyIiwiZGlzcGxheSI6IiJ9LCJsYW5kc2NhcGVfbWF4X3dpZHRoIjoxMTQwLCJsYW5kc2NhcGVfbWluX3dpZHRoIjoxMDE5LCJwb3J0cmFpdCI6eyJwYWRkaW5nLXJpZ2h0IjoiMSIsInBhZGRpbmctbGVmdCI6IjEiLCJkaXNwbGF5IjoiIn0sInBvcnRyYWl0X21heF93aWR0aCI6MTAxOCwicG9ydHJhaXRfbWluX3dpZHRoIjo3Njh9"][tdm_block_image_info_box box_style=”style-2″ box_image=”iii_home-architecture_iii” box_title=”Architecture” box_description=”V2hlbiUyMHlvdSUyMGVudHJ1c3QlMjB5b3VyJTIwdmlzaW9uJTIwd2l0aCUyMHRoZSUyMGV4cGVydCUyMGRlc2lnbmVycyUyMGFuZCUyMGNyYWZ0c21hbiUyMGF0JTIwU3BlY2lhbHR5JTIwQnVpbGRpbmclMjBTZXJ2aWNlcy4=” tds_button=”tds_button3″ button_size=”tdm-btn-md” button_icon_size=”18″ button_tdicon=”tdc-font-fa tdc-font-fa-graduation-cap” image_height=”763″ image_width=”1200″ box_overlay=”rgba(0,0,0,0.6)” button_text=”MORE DETAILS” box_height=”360″ tdc_css=”eyJwb3J0cmFpdCI6eyJtYXJnaW4tYm90dG9tIjoiMCIsImRpc3BsYXkiOiIifSwicG9ydHJhaXRfbWF4X3dpZHRoIjoxMDE4LCJwb3J0cmFpdF9taW5fd2lkdGgiOjc2OCwicGhvbmUiOnsibWFyZ2luLWJvdHRvbSI6IjIiLCJjb250ZW50LWgtYWxpZ24iOiJjb250ZW50LWhvcml6LWNlbnRlciIsImRpc3BsYXkiOiIifSwicGhvbmVfbWF4X3dpZHRoIjo3Njd9″][/vc_column][vc_column width="1/3" tdc_css="eyJsYW5kc2NhcGUiOnsicGFkZGluZy1yaWdodCI6IjIiLCJwYWRkaW5nLWxlZnQiOiIyIiwiZGlzcGxheSI6IiJ9LCJsYW5kc2NhcGVfbWF4X3dpZHRoIjoxMTQwLCJsYW5kc2NhcGVfbWluX3dpZHRoIjoxMDE5LCJwb3J0cmFpdCI6eyJwYWRkaW5nLXJpZ2h0IjoiMSIsInBhZGRpbmctbGVmdCI6IjEiLCJkaXNwbGF5IjoiIn0sInBvcnRyYWl0X21heF93aWR0aCI6MTAxOCwicG9ydHJhaXRfbWluX3dpZHRoIjo3Njh9"][tdm_block_image_info_box box_style=”style-2″ box_image=”iii_interior2_iii” box_title=”Interior Design” box_description=”SW50ZXJpb3IlMjBkZXNpZ24lMjAlMjYlMjBmdXJuaXR1cmUlMjBwcm9qZWN0cyUyMGZvciUyMHJlYWwlMjBlc3RhdGUlMjBkZXZlbG9wZXJzJTIwYW5kJTIwZm9yJTIwb3duZXJzJTIwb2YlMjBhcGFydG1lbnRzJTJGaG91c2VzLg==” tds_button=”tds_button3″ button_size=”tdm-btn-md” button_icon_size=”18″ button_tdicon=”tdc-font-fa tdc-font-fa-graduation-cap” image_height=”667″ image_width=”1000″ box_overlay=”rgba(0,0,0,0.6)” box_height=”360″ button_text=”READ MORE” tdc_css=”eyJwb3J0cmFpdCI6eyJtYXJnaW4tYm90dG9tIjoiMCIsImRpc3BsYXkiOiIifSwicG9ydHJhaXRfbWF4X3dpZHRoIjoxMDE4LCJwb3J0cmFpdF9taW5fd2lkdGgiOjc2OCwicGhvbmUiOnsibWFyZ2luLWJvdHRvbSI6IjIiLCJjb250ZW50LWgtYWxpZ24iOiJjb250ZW50LWhvcml6LWNlbnRlciIsImRpc3BsYXkiOiIifSwicGhvbmVfbWF4X3dpZHRoIjo3Njd9″][/vc_column][vc_column width="1/3" tdc_css="eyJsYW5kc2NhcGUiOnsicGFkZGluZy1yaWdodCI6IjIiLCJwYWRkaW5nLWxlZnQiOiIyIiwiZGlzcGxheSI6IiJ9LCJsYW5kc2NhcGVfbWF4X3dpZHRoIjoxMTQwLCJsYW5kc2NhcGVfbWluX3dpZHRoIjoxMDE5LCJwb3J0cmFpdCI6eyJwYWRkaW5nLXJpZ2h0IjoiMSIsInBhZGRpbmctbGVmdCI6IjEiLCJkaXNwbGF5IjoiIn0sInBvcnRyYWl0X21heF93aWR0aCI6MTAxOCwicG9ydHJhaXRfbWluX3dpZHRoIjo3Njh9"][tdm_block_image_info_box box_style=”style-2″ box_image=”iii_home-garden_iii” box_description=”Q3JlYXRlJTIwdGhlJTIwcGVyZmVjdCUyMGZyb250JTIweWFyZCUyMGFuZCUyMGJhY2t5YXJkJTIwbGFuZHNjYXBlcyUyMHdpdGglMjBvdXIlMjBnYXJkZW5pbmclMjB0aXBzLg==” tds_button=”tds_button3″ button_size=”tdm-btn-md” button_icon_size=”18″ button_tdicon=”tdc-font-fa tdc-font-fa-graduation-cap” box_title=”Gardening” image_height=”684″ image_width=”1000″ box_overlay=”rgba(0,0,0,0.6)” box_height=”360″ button_text=”VIEW SOLUTIONS” tdc_css=”eyJwb3J0cmFpdCI6eyJtYXJnaW4tYm90dG9tIjoiMCIsImRpc3BsYXkiOiIifSwicG9ydHJhaXRfbWF4X3dpZHRoIjoxMDE4LCJwb3J0cmFpdF9taW5fd2lkdGgiOjc2OCwicGhvbmUiOnsiY29udGVudC1oLWFsaWduIjoiY29udGVudC1ob3Jpei1jZW50ZXIiLCJkaXNwbGF5IjoiIn0sInBob25lX21heF93aWR0aCI6NzY3fQ==”][/vc_column][/vc_row]
Search where this code begins and ends in that file and copy from there. Don’t copy this one.
Hi.
I also want very much to use popular posts without showing the number of views to each post and without any additional plugin. In fact, I used “popular post for wp” plugin with my previous theme, but from now on with NEWSPAPER I want to keep only the pluggins that are necessary (adrotate, Wp Super Cache etc).
I tried your method to live css
.single .td-post-views {
display: none;
}
but the post views don’t disappear. (I also enabled AJAX POST VIEW COUNT since I use WP Super Cache).
Any advice?
(www.tameteora.gr)
Hi,
i’d like to use category template 8 but I want to have the Category Image as a simple background of td-category-header, and i don’t want to use it as a background for the whole page.
I tried building a category-template like that with Cloud Templates. But I don’t want to manually build one for every category I have.
Is there any way I can use the ‘normal’ category template 8 and adjust it with custom css or something like that or a way I can build a cloud Template without using specific filters, because I want all my categories to look the same and the only change that would have to be made is to set the filter to current category)?
Hey thanks for replying.
I understand what you’re saying, but I’m not trying to change the setting – rather I’m adding new css properties to one and not the other.
Example.
Flexbox 1:
(do nothing, keep it normal)
Flexbox 2: {
border: 1px grey solid;
box-shadow: 1px 0 20px grey;
}
The only thing I’ve been able to find that changes it is
.td_module_flex_1 .td-module-container but that changes both flexboxes.
Hello!
Ah okay, thanks! Will it overwrite the Child Theme when I install the demo? I have some CSS code in there.
I notice when I use Post Template 1 and I want a quote centered next to the post picture the box is over the picture. How can I fix that?
For example:
Quote box center
https://screenshots.firefox.com/NuAC3z0pltshc9M2/aspi.lau-rammstein.de
Pull quote center
https://screenshots.firefox.com/U6cbxJ0tVTyaLwe4/aspi.lau-rammstein.de
Link to the post: http://aspi.lau-rammstein.de/rammstein-gibt-exklusive-konzerte-in-mexiko-ende-2018-anfang-2019/
Thanks!
Laura
Hello,
It seems the css for the button does no apply properly. It could be a plugin influencing the css. Please try to disable all plugins except the page builder, clear cache and reset cdn files if you use it. Please also check any custom code you might have added to the theme panel or the theme files. If you use a child theme, please switch to the main theme to make sure it does not affect the proper functionality of the theme.
Thank you!
Hello karayel,
Use the code below and place it in Theme panel -> Custom CSS Area. You should use the ! important tag to give more priority to your code.
.td-sml-current-item-nr{
background-color: rgba(221,51,51,0.9)!important;
}
The result is here -> https://www.screencast.com/t/AkNcixl17
Thanks for your understanding!
Sorry, there is no color change setting for galleries. What colors. I will add this to our list for future updates but this has to become more popular if we are to consider implementing it into our theme.
Maybe a bit of css can help in this regard though. Please provide an example of what colors you want changed and I will try to provide the code needed.
Thanks.
