- NewspaperWP Rocket and Newspaper Theme: Optimization Guide
- TutorialsFrom WPBakery to tagDiv Composer
- TutorialsDefault Block Settings Guide
- TutorialsHow to use custom fonts
Hi
Use this css to hide the the buttons on mobile devices:
@media(max-width: 768px){
.aps-social-icon-wrapper{
display:none;
}
The white area have the same width on both sites: http://screencast.com/t/ipEyyyPoky0R
Thanks!
Thank you Bogdan. I’ve been able to insert the code and have the post views appear in the blocks.
Any chance you (or anyone else) would help me in the same way to fix/configure the CSS? Right now the views are appearing on the far left of the thumbnail and I’d love to them to be in the same spot as the comments used to be.
Thanks!
Simply adjust the media query size you want to impact. Worthwhile to learn how responsive CSS works … meaning, there are several “break points” for desktop, ipad, phone, etc.
So, you can target a specific “size” device by over-riding the CSS for that breakpoint (in the example provided the CSS should only have over-written the @media breakpoint for devices “up to 768px”.
Worthwhile to look at the style.css and see what the default size breaks ( @media ) sizes are. This gives you a sense of which kind of thing you can target with custom CSS when not just one device size.
Just food for thought as you can learn by experimenting, so that you can make future changes more easily.
I believe the paragraph text on a page/post is one dot larger than a caption for the photo/image. I believe this is intentional.
You can, of course, over-ride this with custom CSS.
a great way to locate the right CSS class to “over ride” in WP themes, like this one, is to start using the ‘console’ view in Chrome browser (“F12”) … you can highlight an element on page and see the CSS class — most times anyway — to figure out which class you need to over-ride such as a custom color.
TagDiv will reply once they get caught up with all the posts… but while waiting good habit to at least try to sort it, as this helps me a lot in trying to find which class to edit.
Then put the revised CSS in the custom css box in theme panel.
Of course knowing basic CSS helps (e.g., a = anchor link, p = paragraph etc)
Hi,
you can hide the counters with css, just paste this in the theme panel custom css code section:
.td_social_info {
display: none;
}
.td_block_wrap.td_block_social_counter.td_block_widget {
display: inline-block;
}
The 1st part hides the numbers and the second hides the empty space left. css does not disable or remove things, just hides them, but no one would bother to disable css in their browsers to look around.
If you really want to disable them, you have to customize the theme, the same thing for adding pinterest. It should not be hard if you are familiar with editing php files.
Hope this helps, cheers!
thanks a lot Catalin, it worked perfectly & looks great now! (the first part)
Alright, I will try to find an alternative solution for the title on the images.
Do you by any chance also know what code I need to add to the CSS, so that I remove the space between the Logo/Menu and the post/page title (the ones without big sized images)?
Thank you and have a great week!
Catalin, when you hide “more from author” via css. does it actually LOAD it but not display it for users?
How do i disable “more from author” entirely not just hide it?
What are
js_composer.min.css?ver4.8.1 704KB – 468 ms
style.css?ver=6.6.2 745KB – 644 ms
and tagdiv:theme.js?ver=6.6.2 415KB 639 ms
> 1700 ms
Hi
Try this css in theme panel > custom code > custom css: http://screencast.com/t/pzLYmWBvRu
.td_block_16 .td-excerpt{
text-align: justify;
}
Thanks!
Hi
I’ve checked your site and seams that the css is missing. This could be caused by a plugin which conflict with the theme so you can try to deactivate all plugin except Visual Composer, clear all caches, purge the cdn files if you’re using and test again.
If the problem persist try to update the theme at the current version available on themeforest following the steps indicated in our documentation: https://forum.tagdiv.com/newsmag-how-to-update-the-theme/
Thanks!
Hello Albert,
Unfortunately to make a website run faster you will need to have at least basic knowledge not necessarily ‘tech savvy’
You will need to follow this tutorial on page speed: https://forum.tagdiv.com/how-to-make-the-site-faster/ Gzip compression needs to be active and also read about how you can compress the images. I suggest getting someone to help you if you cannot manage.
Also please make sure that Speed Booster is active, check System Status for this – http://screencast.com/t/LDPniI0Qpv The plugin is tested only with these plugins – http://screencast.com/t/hcjLnOqh4i2 and if you have others active it will be automatically disabled.
In order to use the tag div speed booster with all plugins, you will need to remove this code – http://screencast.com/t/RZLIOPUNdqh
There are a lot of topics open on this subject and there are a number of things you can do to make your site faster:
You can also read what some of our members found out: https://forum.tagdiv.com/topic/pagespeed/ -> https://forum.tagdiv.com/topic/tip-how-to-easily-minify-your-css-without-breaking-your-site/
One of our top members here on the forum wrote his own optimization tutorial here:
https://forum.tagdiv.com/topic/tutorial-chriss-custom-optimizations-for-functions-php-etc/
Hope this helps and let us know how it goes!
Thank you for the message!
Hello JBH,
1) Good to update to latest version but also remember to update the included plugins too! Please update your theme to the latest version using this tutorial: https://forum.tagdiv.com/how-to-update-the-theme-2/
Also, update your plugins: https://forum.tagdiv.com/how-to-update-visual-composer-plugin/. Remove the current version and install the new version which comes with the theme. Clear all cache and try it again and see how it works and check if the error reappears.
2)This kind of problem might be caused by the conflicting plugins. Please try to disable all the active plugins, except Visual Composer and instal only the plugins that come bundled with our theme. Also, if you use CDN files, please purge them and disable this option and check it again and see how it works.
3)If you want to exclude ‘no comments’, it is necessary to use a bit of CSS to hide it. Please try the code below and add it in Theme panel->Custom CSS area.
.td-comments-title-wrap {
display:none;
}
Hope that helps and let us know how it goes!
If you need more assistance in this regard, please provide your website URL and provide more details about your desired changes.
Thank you for the message!
Hello DonLuigi,
If you want to reduce that space, please try to use a bit of CSS and add it in Theme panel.
The code is ->
.td-main-page-wrap {
padding-top: 0px;
}
The result you should see here -> http://screencast.com/t/zPbhEBQrEwru
Unfortunately, there is not a simple task and it is necessary to do some additional customizations. For the suggestion, you have to use the code of the single template 3, that look similar what you want to achieve and adjust until you achieve as you want. Please notice that is not easy and you must have some experience in CSS and HTML to complete successfully this customization. If you are not aware the steps in this regard, please consider hiring a freelancer/developer to do this for your because we cannot provide custom services at the moment, sorry!
As a quick solution, you can try using a single template 3 with a bit of CSS to position the meta info.
The code is ->
.td-post-template-3 .td-post-title {
top: 0;
}
The result you should see here -> http://screencast.com/t/fwfdZJTsZQcx
Hope this helps and let us know how it goes!
Thank you for the message!
Hello
I have passed PageSpeed Insight and I have two main problems to solve.
The first one is that I have to remove Javascript which is blocking the display and CSS content from upper half page. The other one is that I must reduce server time.
I have already compressed to gzip and solve the problem of specifying brower cache editing .htacess file. I have noticed that score has raised to 64 and 84, on mobile and desktop respectively, but this score is not enough good. I would like to know how I could solve this problem
On the other hand, I would like to know how I could minify Javascript, HTML, and CSS and if you would recommend to me. I have seen on test that there are some theme files which are involved.
Thanks
Hello joyceloh,
If you want to remove other function from your category page, you have to remove/comment from the td_category_template.php file, like this -> http://screencast.com/t/UTH3tJH7WRl and if you want to hide it, without altering the code, please try the code below and add it in Theme panel->Custom CSS area.
The code is ->
.td-pulldown-filter-item:nth-child(2n){
display:none;
}
.td-pulldown-filter-item:nth-child(3){
display:none;
}
.td-pulldown-filter-item:nth-child(5){
display:none;
}
The result you should see here -> http://screencast.com/t/1oo9uauCSPG
Hope this helps and let us know how it goes!
Thank you for the message!
Hello Terrence,
Yes, if you choose to disable the post view counter that will affect the popular post ranking because this feature works by this counter. We suggest using a bit of CSS to hide this because this feature will be hidden but it is working in the backend and you should not have any problem in this regard.
If you want to hide this, please try the code below and add it in Theme panel->Custom CSS area.
The code is ->
.td-post-views {
display:none;
}
Hope this helps and let us know how it goes!
Thank you for the message!
Hello Twolle,
Our Speed Booster plugin has been designed to work properly with some tested plugins, as you can see in this screenshot -> http://screencast.com/t/ojSRErqBEI8 Please note that the Speed Booster plugin disable itself when an incompatible plugin it’s installed. We added this measure to avoid conflicts with the plugins that won’t allow moving their CSS/js resources at page bottom. To keep it always activated comment or delete the indicated lines from td-speed-booster.php: http://screencast.com/t/RZLIOPUNdqh You can check this topic for more information about speed booster usage: https://forum.tagdiv.com/topic/speed-booster-questions/
Hope this helps and let us know how it goes!
Thank you for the message!
Hi
Try this css in theme panel > custom code > custom css: http://screencast.com/t/xHuFWZd6
.single .entry-title{
margin-top: 25px;
}
.single .td-category{
float: right;
}
Thanks!
-
This reply was modified 10 years by
Andrei L..
Hello sporkhc,
You can do a child theme because the Block template files that can be modified using the child theme.
The child theme helps you to keep the changes made by you for the future update but if your modified files are not changed by the theme in this update. Please notice that the style.css file is changed in every update and it is necessary to update your child theme that comes bundled with our theme on every update to works well. If your files changed are different to files changed by the theme you have to replace only those files in the child theme.
For more information about the child theme support, please check our tutorial here -> https://forum.tagdiv.com/the-child-theme-support-tutorial/
Hope this helps!
Thank you for the message!
Hello loano1,
If you want to have it as responsive for all devices, please try the code below and add it in Theme panel->Custom CSS area.
The code is ->
.wp-embedded-content {
width:100%!important;
}
The result you should see here -> http://screencast.com/t/V0rIRzjlMZ
Thank you for the message!
Hi,
I have checked you site and did not found any issue on IE 11 – http://screencast.com/t/SzhOO80k
Anyway you could use this custom css in Theme Panel > Custom Css(or in stylesheet file)instead of classes to target the browser and it should be applied on all:
.td-header-style-10 .td-header-sp-logo img {
width: 100% !important;
}
Thanks!
Hi
The previous css change only the text color on hover. To change the background color replace that css with this one and change the colors as you want: http://screencast.com/t/sLIqfd8QjmQp
#td-header-menu .sf-menu > .current-menu-item > a:hover, .sf-menu > .td-menu-item > a:hover{
color: red!important;
background-color: blue;
}
Thanks!
Hi
Sorry about that, i forgot one css class. To change the tabs color replace the previous css with this one: The result should be like here: http://screencast.com/t/T1Tjcb7xv0
.wpb_tabs li.ui-tabs-active a, .wpb_content_element .wpb_tour_tabs_wrapper .wpb_tabs_nav a:hover,
.wpb_tabs li a{
background-color: #2185dd;
}
.ui-state-default a, .ui-state-default a:link{
color: white;
}
Thanks!
Hi
Try this css in theme panel > custom code > custom css: http://screencast.com/t/NXqDAKfuRgnw
@media(max-width: 768px){
.td-pb-row .td-pb-span4 {
background-color: gray;
}
}
Thanks!