Hi,
Block 8 uses module 7 as it can be seen here – https://www.screencast.com/t/WcnYMDEs or by using your browser inspector – https://www.screencast.com/t/id6m9H5u and you can change the article title like this – https://www.screencast.com/t/nMdxodGV
Thanks
Hi,
You can identify the elements on the page and their classes using the browser inspector tool – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ – https://www.screencast.com/t/ww9bYyf5
So you would need to use a code like this to change the color – https://www.screencast.com/t/w0FgidIa just enter it in Theme panel->Custom Css
.td-author-page a {
color: grey;
}
You could add a line break <br> in the link itself – https://www.screencast.com/t/X4VCKxWkYS
Thanks
Hi,
Unfortunately these are the only options available for styling the big grids, as it can be seen in the demo – https://demo.tagdiv.com/newspaper/big-grid-1/ Each grid contains a combination of modules – https://www.screencast.com/t/5cPHjrzzXg and each module meta, like the article title is positioned on the big grid through the module structure and the theme’s css – https://www.screencast.com/t/ze1CktCs if you want to modify the module title for example to be displayed outside of this container it will have to be custom made, either by modifying the structure in the module used on the big grid itself – https://www.screencast.com/t/tQwwG1A9tAYz or by css code – https://www.screencast.com/t/KKlm1lMNawGG Here is a tutorial about using the browser inspector tool to identify the elements used and their classes and create custom code – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thanks
Hi,
If you mean the padding on the page wrap – https://www.screencast.com/t/f6glx01Y you could modify it using some custom css like this, just enter it in Theme panel->Custom Css. Here is a guide about the browser inspector tool to help you identify the elements on the page and their classes in order to create custom code – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
.home .td-main-page-wrap {
padding-top: 24px;
}
If this not working for you or it is not what you meant, please provide a link to your website so I can give you a more accurate solution.
Thanks
-
This reply was modified 9 years by
Simion C..
Hi,
You could use a little bit of css for this, to change the block titles only in the footer. Enter this code in Theme panel->Custom Css and modify the font size as you like
.td-footer-wrapper .block-title span {
font-size: 25px;
}
Also here is a tutorial about the browser inspector tool, so you can identify the elements on the page and their classes, to make custom code – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thanks
Hi,
It seems the Roboto Condensed font has a minimum of 300 font weight meaning the light version – https://fonts.google.com/specimen/Roboto+Condensed Try to enable the following settings in theme panel fonts – https://www.screencast.com/t/5FXjMwBjaXxI The result should be like this, do a cache clear after the modifications just to be sure – https://www.screencast.com/t/c73g5jA6Jrj More about font customization here – https://forum.tagdiv.com/font-customization/
I don’t know what to recommend about that table plugin, if you are using shortcodes and they are correct it should work properly. You could identify the elements on the page and make custom code using your browser inspector to further style and position the table, if the plugin has no settings for this – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thanks
Hi,
Thank you for your appreciation. If you mean the title in the category page – https://www.screencast.com/t/sSZBRVXYHRK you could change it with with some css like in the screenshot, for all the category page titles. Here is a tutorial about how to use your browser inspector and identify the elements on the page and their classes, in order to create custom code and easily change their color for example – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ This is the code I used in the example
.category .td-page-title {
color: blue;
}
Thanks
Hi,
If you mean the travel blog demo – https://demo.tagdiv.com/newspaper_blog_travel/ those are images inserted in a single image Visual composer element – https://www.screencast.com/t/wvzy0QGnF9u Here is a tutorial about using your browser inspector to identify the elements on the page and their classes – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thanks
Hi,
You can set a hover color for the social icons in the header top menu – https://www.screencast.com/t/al4nJznYfh and also for the social icons in the footer – https://www.screencast.com/t/woIuHNfp This should apply to all the social icons you have entered account information in Theme panel->Social networks – https://www.screencast.com/t/EIBPa2pD Anything else will have to be custom made. Here is a link to the browser inspector tool – https://forum.tagdiv.com/search/browser+inspector/ to help you create custom code for the elements you want.
Thanks
Hi,
You just need to identify the class used and change the color of the span text like this – https://www.screencast.com/t/o8iqGsJJ Also if you want it to apply only for the default post template it should look like this – https://www.screencast.com/t/gAeped5N More about the browser inspector here – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ You must enter the code in Theme panel->Custom Css
.single_template .td-post-next-prev-content span {
color: yellow!important;
}
Thanks
Hi,
You could set a background color to the row like this – https://www.screencast.com/t/dL9gqTNVJnZ3 or do it with css code in Theme panel->Custom Css – https://www.screencast.com/t/eOqFWqoesD If you want to have a background color on all the page, you could use a code like this – https://www.screencast.com/t/OUwSz11x4 Here is a link to the browser inspector tool, to help you identify the elements on the page and their classes to easily create custom code – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thanks
Hi,
Then just use the a tag for the hyperlinks in the code provided above. Also if you want them to display like this only in the post content for example, just add the post content class before the a tag, or identify the classes used with your browser inspector – https://www.screencast.com/t/tNLy0UcHx – https://www.screencast.com/t/Pe8IdPqGZl In the link I provided above you can see the different states of the links – https://www.screencast.com/t/dBCnvHaEgV5 Here is a tutorial about using the browser inspector to create custom code – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ and add in in Theme panel->Custom css
Thanks
Hi,
This is how I see it on chrome – https://www.screencast.com/t/52JWDbTOcqyk according to the width modifications to the module thumb that are seen using chrome browser inspector – This is how it should be – https://www.screencast.com/t/9yM2fqdsz So the changes are in effect maybe you should try clearing your cache on the chrome browser if you do not see it like this. Also I see that you have modified the module thumb display property – https://www.screencast.com/t/GIeMsnXjkoSX to a non valid value affecting all the modules on the page and this could cause problems.
Thanks
Hi,
You can do that using the browser inspector. If you right click that white space and click inspect, you can see that there is a padding-top property set on the page content – https://www.screencast.com/t/RN2srJ6Nr so you should enter a -48px value in the margin-top of the desired row settings – https://www.screencast.com/t/yMXbpu9E Then it should look like this – https://www.screencast.com/t/TOhU6J1G0c
Here is a tutorial about the browser inspector tool – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thanks
Hi,
Usually a fullhd image (1920x1080px) would work best for a background image, more information about the settings here – https://forum.tagdiv.com/background-introduction/ You can see the theme width size when using a background with your browser inspector, like this – https://www.screencast.com/t/lyYh5zYW
Thanks
Hi,
There is no need to activate Visual composer because it is pre-activated from the start, just ignore the activation messages – https://forum.tagdiv.com/how-to-update-visual-composer-plugin/ Updates for all the theme’s plugins including Visual composer are provided along with the theme update. When a new version is available, just download the full theme package from themeforest – https://forum.tagdiv.com/whats-included/ then deactivate and delete the Visual composer plugin from theme panel and install the new one from the package. Your pages created with visual composer will still be there. But in case something goes wrong it is always recommended to have a backup – https://forum.tagdiv.com/how-to-update-the-theme-2/
The theme has a responsive design so it adapts to different device sizes. If the mobile theme is not activated then the same content of the desktop will be displayed on mobile. When you activate the mobile theme it will display a predefined layout on the homepage, with a top grid and latest articles and you can add content through the mobile editor. More information here – https://forum.tagdiv.com/the-mobile-theme/ You can use the browser inspector tool to see the site in mobile view – https://www.screencast.com/t/zdjQv4EZ
Thanks
Hello Erythros,
Please notice that our theme does not have any such an option for it, sorry! If you want to achieve this, you should do it yourself because it is not a simple task and it requires to do some additional customizations. As a hint, you should target the containers you want and then, you should add a border. As an example, you can see the code and the results below ->
.td-main-menu-logo{
border: 6px solid green;
}
The result is here -> https://www.screencast.com/t/AFonY8KK07
If you want to display more levels in our theme and if you are not aware of the steps which are needed to take in this regard, please consider hiring a freelancer/developer to help you because we cannot provide additional customization at the moment, sorry!
If you want to create your own custom CSS code, you should consult our guide here -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ because there you will teach how you can create your custom CSS code.
Thanks for your understanding!
Hi,
There is no theme setting to change the post content background if that is what you mean, so if you want to set a background color to the post content, it has to be custom. You have to identify the elements on the page using your browser inspector – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ and set a background color to them like in this example – https://www.screencast.com/t/UB8rYgCFP7 As for the post text color you can set it in Theme panel – https://www.screencast.com/t/XRynHaQu4zFG Please correct me if I misunderstood what you wanted.
Thanks
Hi,
Each block is different, and it contains a combination of modules which use different thumb sizes – https://forum.tagdiv.com/theme-thumbs/ Also here is more information about how the cropping of the feature images works – https://forum.tagdiv.com/featured-image/ In your case from what I can see when the post has a featured image set, the module gets smaller in size somehow when it should remain the same. Try to use your browser inspector and check the thumbnail size for a block and module where this happens – https://www.screencast.com/t/kOTSIpm6kN and compare it to what it should be in theme panel – https://www.screencast.com/t/PyZlIubvU Or if you could provide a link to your site we can take a look at this. In most of the cases any image or thumb related problem is caused by a plugin, so you could try also to disable all your plugins except Visual composer, clear your cache and see if it still happens.
Thanks
Hi,
You could set a background color on any row in your homepage, in Visual composer first you must stretch the row – https://www.screencast.com/t/xQz2aeli then set a background color in the design options tab- https://www.screencast.com/t/CVC3c5ixK9 with this result – https://www.screencast.com/t/ikG7H2thtte Or you could use your browser inspector tool to identify the elements, the classes used and create a custom code to change their properties – https://www.screencast.com/t/XPZ3PBn6u Here is a tutorial about the browser inspector – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thanks
Hi,
I cannot replicate this problem you re having on my end. It would be helpful if you could provide a link to your website so we can inspect it and see the problem. You could use your browser inspector tool to see why this is happening – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ Also make sure you have updates all the required plugins to the latest version.
Thanks
Hi,
If I understand correctly you want to change the block title headings, you could do that if you want to, this is where the heading is generated – https://www.screencast.com/t/p7a7m5ugAR9m Or if you just want to change the font properties of the block titles you can do it here – https://www.screencast.com/t/p2QchypUm Also you can customize the headings using your browser inspector and identify the classes used and their properties – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ If you wanted something else please provide more information
Thanks
Hi,
There could be multiple causes for this to happen, a plugin, a child theme or some custom css. An easy fix would be to use this css code for the related block only and fix the background and border color and padding but I do not understand exactly how you want it to be, you could modify the code if it is the case, and also add a background color or change the font color. You should use these classes in this case – https://www.screencast.com/t/hHs0eMu0 which you can identify with your browser inspector – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
.td-related-title.td-block-title {
border-color: black!important;
}
.td-related-title.td-block-title a {
color: black!important;
padding: 8px 12px;
}
This is the result – https://www.screencast.com/t/vUQTuRBrRk – https://www.screencast.com/t/0RMasts2fktZ
Thanks
Hi,
If you have done the modifications in the td_config.php file then the thumb images should look like this in your browser inspector – https://www.screencast.com/t/vB8fmTsfc and here – https://www.screencast.com/t/uKYf5VilfD Now using some css you could change the height of the module – https://www.screencast.com/t/QwSbYjhocQv You can use this code, just enter it in Theme panel->Custom Css
@media (min-width: 767px) {
.td_block_big_grid_1 .td-module-thumb {
height: auto!important;
}}
Result – https://www.screencast.com/t/U1CqMjpq
Thanks