Search Results for 'css'

Hello valkiradoo,

Try to use the code below and place it in Theme panel -> Custom CSS area.

The code is ->

.td_module_mx5 .td-big-grid-meta a{
text-shadow: 2px 2px 8px red!important;
}

The result is here -> https://www.screencast.com/t/Q9hk0f4G

You can change the code value with your desired.

Thanks.

Hi,

Unfortunately our AMP plugin does not have a custom CSS panel at this moment. So you would have to enter the code directly in the plugin files. Which is not a good solution because if the plugin receives an update the entered code will be lost.

We will try to add more features to the AMP plugin in the future, so a custom code options may be implemented.

If you want to edit the plugin and add code in it, this would be a similar topic
– https://forum.tagdiv.com/topic/custom-css-in-amp-posts/

WordPress is developing the new Gutenberg editor which will be available in the future
– https://wordpress.org/gutenberg/
– https://testgutenberg.com/
We do not have any plans to develop a new editor, at least I am not aware of such plans.

Thanks

Hello,

1,2)Try the code below and place it in Theme panel -> Custom CSS area

@media(max-width:767px){
.td-header-wrap {
background-color:white;
}
.td-search-icon i{
color:black;
}
}
#td-top-mobile-toggle i{
color: black;
}

The result is here -> https://www.screencast.com/t/8gY06w25n

3)If you want to change the Back to Top position button you should use the code below to have control over it.

.td-scroll-up {
bottom: 24px;
left: 4px;
opacity: 0.7;
}

The result is here -> https://www.screencast.com/t/NzEcs7EXZl

Thanks.

You can try this quick fix, enter this code in Theme panel->Custom CSS

@media (max-width: 500px) {
.td_module_mx3 {
float: none;
}}

Then try using in a test page if possible to place the same blocks 13 in the same layout as before. Check if the problem is solved.

Hi,

The top menu cannot display a mega-menu, it is limited to simple drop down menus. The header main menu can display mega-menus
– https://forum.tagdiv.com/mega-menu/
What you want is to display the menu items in multiple columns instead of all of them vertically. You could try with CSS, make tests and see if it works properly. A similar topic here
– https://forum.tagdiv.com/topic/menu-items-split-in-2-columns/

Thanks

Sorry for misunderstanding. It may not be easy to integrate that information in the author box. If the code works maybe you should consider leaving it as it is and displaying it above the author box. Or maybe create CSS for it if possible, to position it differently.

Hello Nikolaas49,

Sorry, but the theme has not been designed to use this on that section and if you want to make some additional customizations to your website, please check the following useful guide from here -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ because there you will find all the steps which are needed to follow in order to create your own custom CSS code.

Thanks.

Hello Bruno Cruz,

Try the code below and place it in the Theme panel – > Custom CSS area.

The code is ->

.td-newsmag-voice .td-pb-span8 .td_block_template_1 .block-title span:after, .td-newsmag-voice .td-pb-span12 .td_block_template_1 .block-title span:after{
background-color: #a1f229;
}

The result is here -> https://www.screencast.com/t/6zRNVgpC0i

In the future, I suggest you use the Inspector Browser to create your custom CSS code, according to our documentation from here -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks.

Hi,

Let’s try to identify the problem here. So from what I understand you want to add a border bottom for your h2 in the post content, like this
– https://www.screencast.com/t/yMyAhBQ0qo
WordPress used to have an underline button, but it was removed. So now CSS could be used or maybe trying to re-add the lost option and using it
– http://www.wpbeginner.com/plugins/how-to-add-underline-and-justify-text-buttons-in-wordpress/
In my example I used this code, note that it will affect all the h2 in every post. You may change the border size, type and color if needed
– https://www.w3schools.com/css/css_border.asp

.td-post-content h2 {
border-bottom: 2px solid black;
}

Remove the previous code for the border, this one is all that is needed.

Thanks

Hi,

Indeed it seems that on Firefox that element is broken. Please provide a link to that page if possible, so we can see what the element is and try to identify why is that happening.

The mixed content warnings are related to some demo content, I believe you have installed the art creek demo. Edit the page with the errors with the tagDiv composer and check the row CSS settings for these rows
– https://www.screencast.com/t/6WHdZLFGbImW
Click on remove image background and set your own images if you want
– https://www.screencast.com/t/Ouj2ratN0mW
That should remove the mixed content issues.

Thanks

Hello Vijila,

You should try using the code below and place it in Theme panel -> Custom CSS area.

.td-front-end-display-block {
left: 0;
}

The result is here -> https://www.screencast.com/t/P1tug3Jp2uB

Thanks.

Hello,

Unfortunately our theme does not offer any settings to decrease the height of the sliders.
You can use a custom css in the theme panel to adjust the height

.td_module_slide{
height: 500px!important;
}

Thank you!

Hello,

This can only be done with custom css and an extra class added to each of the blocks. They cannot be targeted individually otherwise. https://www.screencast.com/t/QuCG7j1BXQ

.mycustomclass .td_module_mx2 .item-details .td-module-title a{
color:red;
}

You can replace the .mycustomclass with the particualr class you add to each of the 3 blocks and create 3 instances of the code with the different colors you want for the block like for example:

.mycustomclass_1 .td_module_mx2 .item-details .td-module-title a{
color:red;
}
.mycustomclass_2 .td_module_mx2 .item-details .td-module-title a{
color:green;
}
.mycustomclass_3 .td_module_mx2 .item-details .td-module-title a{
color:blue;
}

You can place the code in the theme panel-> custom code section.

Thanks.

Hello,

You can use this custom css in the theme panel to make the modifications you mention:

.td-header-style-1 .td-header-sp-recs, .td-header-style-1 .td-header-sp-logo {
margin-bottom: 0px!important;
}
.td-header-style-1 .td-header-sp-logo{
margin:0!important;
}
.td-header-sp-logo img{
margin:0
}

It could need a bit of adjusting for responsiveness on other devices though

Thanks.

Hello rajwarrior,

The theme does not have any such an automatic option that allows you to make this but it can be done only via such a custom work. Notice that each demo has an own style which can be replicated for your website. You should check the demo folder like this -> https://www.screencast.com/t/pEuYojRhk because there you will find all the CSS files for each of our demos.

Thanks.