Hello,
Your 2 posts you have provided have different implementation. The one that stretches in the long row does not get the align-left class as the images on the second post. Please check your html code to see if there is anything different in the post that does not display properly. Maybe you should consider adding them inside a list or using floats to position them properly as the post that “works” does not display the images properly as well. You can find good html and css tutorials here: http://www.w3schools.com/
Thank you!
Hi
I am not sure where you want to display the parent category but there are two situations:
– if you want to display it on posts then you will need a new function in td_module_single_base.php file: http://screencast.com/t/0gBPfJtP7 then call the function in loop file corresponding with the post template used: http://screencast.com/t/N9ZTjVYB The result will be like here: http://screencast.com/t/mIh5zDfdE
<?php echo $td_mod_single->get_parent_category(); ?>
– if you want to display it on modules the file that must be edited is td_module.php: http://screencast.com/t/5oCbVAjEc then call the function on each module where you want to display the parent category: http://screencast.com/t/ZmCrrUDeNY6 – http://screencast.com/t/jgJDfRbaS
<?php echo $this->get_parent_category(); ?>
Here is the code of the function used as example: http://pastebin.com/1vHDfyJq
Note that this is just a basic example but can be used in many different way depending by the desired result. I didn’t applied any style on it, but this can also e done using css class in side php code. You can use others functions from the theme as example but please consider that this customizations require good coding skills and also many tests in order to work fine. Unfortunately time does not allow us to provide any custom services at the moment so if you still need guidance on this or you’re not aware of the steps you need to take in this regard please consider hiring a developer or a freelancer to do this for you.
Thanks!
-
This reply was modified 10 years by
Andrei L..
Hi,
I have moved all the code from the above reply in pastebin.
You can use the custom css box for all the css including responsive code. You can use media queries for it like so:
desktop:
@media (min-width:1140px){
your css code here
}
IPAD LANDSCAPE:
@media (min-width:1019px) and (max-width:1140px){
your css code here
}
etc. You can see the viewport range here: http://screencast.com/t/CsbHRhRkfv
Please try it like so and if the code does not apply upfront, you can use the !important declaration: https://www.smashingmagazine.com/2010/11/the-important-css-declaration-how-and-when-to-use-it/
We use a live css extension for chrome called live css editor that really helps in creating the css code and seeing it apply live.
I hope this helps.
Thank you!
Hi,
Every file in our theme is used by the theme. There are no extra files that do not have any functionality and they simply exist to take up the disk space. The .woff font file is used by the theme on different browsers so removing it will cause fonts/icons to not work properly on certain browser versions. You can try to remove the newspaper.woff file or you can try to remove this part form the css if you really want to: http://screencast.com/t/7SwMgWe7 but we cannot guarantee this will not cause problems in the future. The theme works best if all the file system is intact.
Thank you!
Hi,
You do not need to use a child theme as you can specify widfth and height with custom css you can use in the theme panel:
.td-header-style-12 .td-main-menu-logo img {
max-height: 120px!important;
width: 220px;
height: 120px;
}
Please edit these values to your logo size.
Thank you!
Hi
First remove this code from theme panel > custom css:
.td-big-grid-wrapper .td-module-thumb a:last-child:before {
background: linear-gradient(to bottom,rgba(25, 25, 25, 0) 100%,rgba(25, 25, 25, 0.7) 0%);
}
Then add this code: http://screencast.com/t/yAPFmhmWbW
.td-grid-style-5 .td-module-thumb a:last-child:before {
opacity: 0;
}
.td-grid-style-5 .td-module-thumb:hover a:last-child:before {
opacity: 0.5;
}
Thanks!
Hi Catalin,
I’m using the plugin that comes bundled with the theme, and I’m still having the issue– help!
They say it’s something to do with the CSS built into the theme:
https://wpbakery.atlassian.net/wiki/display/VC/Change+CSS+Class+Names+in+Output
We checked it further and the issue is because theme author has modified our default column classes using: https://wpbakery.atlassian.net/wiki/display/VC/Change+CSS+Class+Names+in+Output
Due to this it breaks upon the update. You can get in touch with him and get rid of the above code to get it back. Kindly check.
Hello! I’m using your excellent Travel template in my site, http://www.southamerica-tours.net. I wanted to set a customized background image for the homepage, so I configured it in “Row Settings > Image”, as you can see in the blog. However, the image block has a little offset, moving a few pixels downward.
I’d like to eliminate this little gap between the header and the background image, would you please help me out with this issue, if there’s any option to configure or css style to edit? Thank you and best regards!
ppsmaroc.com/temp
Hi again,
i follow all steps documentation to get full width row.
My problem is that use a rtl css style for the theme, and when row is default every-things is ok.
But when is set the stretch row option = it’s taking full width but not centered in page (move to left) as seen :
with css inspector i make a change for value “left” and it’s correct the bug, as seen :
But the location of the css file is unknown, so were i can find the css file or how to fixe it?
tnx man
-
This reply was modified 10 years by
zawayavision.
I’m currently trying to get my buttons to be on the same line in mobile view. I currently have a 3-column row set, with buttons in the first and third rows and page number in between those rows. Is there a CSS integration I can use to make this work?
Thanks!

@Dhananjay
you can minify that js file using the Google recommended compression tool found in my long winded optimization thread in the docs > tutorials/DIY > best of forums.
I specifically have a post about both CSS minification and JS minification you can do manually that won’t break the site !
Hi,
I have tried so many ways but still the same. Is there any other method which i can apply the responsive CSS? So that i can get the correct layout before solving the problem. Thanks.
Please teach me on how to change the font in reviews section. I believe it must use CSS code.
Thank you very much.
Looking forward to hearing from the pro.
Hi,
I suspect a caching issue. This will have to be investigated further in depth and unfortunately we cannot do it from here. If the width from the boxed layout is the only thing you wish to remove, then you can try this css alternative:
.td-boxed-layout #td-outer-wrap{
width: 100%!important;
}
I hope this helps.
Thanks.
I’ve tried compile, but doesn’t get same result as style.css, Do I miss some configuration?
-
This reply was modified 10 years by
horsezy.
Hi,
Your css code seems to be in order but we cannot see what is not getting applied. Please be more precise as we cannot see any difference between the post you showed and the rest of the posts. Sorry.
Hi,
Yes, of course! The main class that holds the text area in a post is td-post-content You can try to add it into the plugin or maybe you need to be more precise on the css selection and add .td-post-content p
Try it out and see how it goes.
Thank you!
Hello TimGER5,
Please try the code below and add it in Theme panel->Custom CSS area.
The code is ->
.td_block_1{
padding-top: 10px;
}
The result you should see here -> http://screencast.com/t/nAAJywTrg0S
Thank you for the message!
Hello,
You can always use css to hide the header and footer for a specific page like so:
.page-id-147 .td-header-wrap, .page-id-147 .td-footer-wrapper,
.page-id-147 .td-sub-footer-container{
display:none!important
}
You will need to change the page id in the code to your own.
you can alternatively use this method: https://forum.tagdiv.com/topic/how-do-i-create-a-completely-blank-page/
I hope this helps/
Hello,
I’m glad you fixed the issue on your end, but this is not a theme related issue as the video icons should display properly. Using css can fix it, but it’s better to find the root of the problem first.
(We could not recreate the issue on our end: http://screencast.com/t/rnjnJWk7)
Thanks.
Hello thanik30,
If you want to change the font-size for review section, you have to use a bit of CSS code to do that. Please try the code below and add it in Theme panel->Custom CSS area.
The code is ->
.td-review {
font-size: 25px;
}
.td-review-summary-content {
font-size: 20px;
}
The result -> http://screencast.com/t/7lkCBPEmY
Hope this helps!
Thank you for the message!
Hello
Please try the code below and add it in Theme panel->Custom CSS area.
The code is ->
.td-post-template-3 .entry-title {
background-color: rgba(77,178,236,.7);
}
The result -> http://screencast.com/t/eaPUxAZaao3p
Thank you for the message!
Hello,
1) You can hide the arrows with css like so:
.sf-menu .td-icon-menu-down{
display:none!important
}
2) I assume you are referring to this block element: http://screencast.com/t/OvRgtnFv
It’s actually a block 14 in a full width row from visual composer and with a background color added to it.
Thank you!
Hello Olivercarding,
Please ensure that you have added the color in the correct field in order to achieve as you wish. I have tested on my site all the settings for footer/header about color and works fine. For more information about Theme colors, please consult our documentation here -> https://forum.tagdiv.com/theme-colors-introduction/ Below I gave you a custom CSS code to change the background color for header and footer section.
The code is ->
.td-footer-wrapper, .td-banner-wrap-full {
background-color: #f4b74e;
}
If is not what you want to achieve, please provide more details about your desired changes so I will be able to provide a more accurate response.
Thank you for the message!
Hello mystudent,
If you want to decrease the height of the main menu gradient, you have to use a bit of CSS code to do that. Please try the code below and add it in Theme panel->Custom CSS code area.
The code is ->
.td-header-gradient:before{
height:1px;
}
The result you should see here -> http://screencast.com/t/XQ1Cx5q77
If is not what you mean, please provide more details about your desired changes so I will be able to provide a more accurate response.
Thank you for the message!