Search Results for 'css'

Hi,

You can try this code for the color below the header menu, just enter it in Theme panel->Custom css and change the color to what you want to use

.td-magazine .td-header-style-1
.td-header-gradient::before {
background-color: red;
}

And this one for the top menu border if you want

.td-magazine .td-header-style-1
.td-header-top-menu-full {
border-top-color: red;
}

This is the result with both custom codes inserted – https://www.screencast.com/t/m9tdZpn9W
Thanks

Hello,

Maybe the move to ssl was not made properly:
Please use these few examples to properly move to https:
http://www.wpbeginner.com/wp-tutorials/how-to-add-ssl-and-https-in-wordpress/
https://css-tricks.com/moving-to-https-on-wordpress/
https://yoast.com/dev-blog/move-website-https-ssl/

You can also check our forum for some insight on ssl:
https://forum.tagdiv.com/topic/moving-to-ssl/.
Let us know how it goes.

Thank you!

Hello poppeto,

If you want to hide this effect for featured images, on posts, you should use a bit of CSS code to do this ->

.td-post-featured-image{
pointer-events: none;
}

If is not what you mean, provide more details about your problem so I will be able to provide a more accurate response.

Thanks for the message!

Hi,

As I said this is not an easy task, and even if you can manage to do something like this, it would take extensive testing and you would have to take in account multiple elements. Here is a custom code that seems to work for now, I suggest you enter it in Theme panel->Advanced Css in the desktop section – https://www.screencast.com/t/LswxcxYy The code may need additional modifications in the future because problems could arrive, since the header style is not supposed to display like this.

.td-header-style-5 .td-main-menu-logo {
margin-left: 18%;
}
.single .td-header-wrap.td-header-style-5 {
width:100%;
position: absolute;
left: 0;
}
.td-header-menu-wrap-full {
height: 70px!important;
}
.td-header-menu-wrap.td-affix {
width: 100%!important;
}

This is the result – https://www.screencast.com/t/8DCYFOpJ8LzJ – https://www.screencast.com/t/t4MDJ3eXkf6O – https://www.screencast.com/t/FSNDL1FGP6P

Thanks

Hi,

There is no theme option to display the top menu on mobile at the moment. You could however try this custom code, enter it in Theme panel->Custom Css->Advanced Css – https://www.screencast.com/t/CUAGr6oBeD

.td-header-style-10 .td-header-sp-top-menu,
.td-header-style-10 .td-header-top-menu-full {
display:block!important;
text-align:center;
}

With this result – https://www.screencast.com/t/q6gp4DICz
Thanks

Hello,

You can try to add a bottom border to the main menu like so:
@media(max-width:767px){
.td-header-wrap{
border-bottom: 2px solid grey!important;
}}
Add the code in the theme panel-> custom css box.
You can change the color of the border to one you prefer.

Thank you!

Hello Christophera,

If you want to change the backgroiund for your modal log-in you sohuld use a bit of CSS code and place it in Theme panel->Custom CSS area.

The code is ->

.white-popup-block:after{
background: white!important;
}
.white-popup-block, .td-login-panel-title, .mfp-content .td-login-inputs, .mfp-content .td-login-info-text, .mfp-content #register-link{
color:black!important;
}

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

Thanks for the message!

Hello illusio26,

First of all, if you are using some untested plugin with our theme, you should disable all of them because these can interact with the theme core files and cause a lot of unknown issues. Remove all of them, leave just Visual Composer to active, clear all your caches and install only the plugins that come bundled with the theme core files and rule out any conflicting plugins. After this, if your problem is still there, please try to revert the theme to the default stat. I have inspected your source page and I saw that you minified all your CSS and js code. That’ could be the reason in your case, that your block to not work as expected.

Hope this helps and let us know how it goes!

Thanks for your understanding!

Hi,

That is happening because there is a custom width set on the logo – https://www.screencast.com/t/aT675AEpl0 and there simply is no space available in the header to display the logo and the menu on the same line. Look for the custom css code that is more likely in Theme panel->Custom Css and remove it or decrease the value – https://www.screencast.com/t/ZaicXM5y Also I see that the height of the header menu has been changed – https://www.screencast.com/t/ITDFz7KnBG83 from the default one – https://www.screencast.com/t/j6Gaa4lauefa and that is most likely done in theme’s stylesheet. These are the default header styles available in the theme – https://forum.tagdiv.com/header-styles/ and the recommended logo sizes – https://forum.tagdiv.com/logo-favicon/

Thanks

Hi,

You can try this code, just enter it in Theme panel->Custom Css with this result – https://www.screencast.com/t/ZaAojA4h5

.td-related-title.td-block-title
.td-cur-simple-item {
background-color: #007200;
}
.td-related-title.td-block-title {
border-color:#007200;
}

Thanks

Hello,

1) It is not a bug. You simply did not modify the css properly on a responsive layout.
please also add this code:
@media (max-width: 767px){
.td-post-template-7 .td-post-header-holder {
width:100%!important;
}}

2) You can change the site width with css but please keep in mind that this is not recommended as the theme elements will not position properly anymore and there could be css issues. If you did change this, please note this change is not recommend by us and if you have future css styling issues, you should definately start by removing the width alteration as our elements were created based on the fixed width of the containers. I did not say it is not possible. I said there is no solution I can provide because simply changing the width will not be enough for this modification to function properly.

7) We implemented a fix for this in the next theme version we plan to release in the near future. I have passed this information on to my colleagues and we will fix this in the next update.

8) In order to remove pinterest from the post sharing options you can either hide it with css or remove it from the theme code.
css version:
.td-social-pinterest{
display:none!important;
}

The code version:
Please remove this line of code for top sharing:
https://www.screencast.com/t/bTiYLtemTyK
and this line for the bottom sharing:
https://www.screencast.com/t/ZXoSzECDzYeY

Thank you!

Hello,

You can use this code in the theme panel-> custom css box:

.td-main-sidebar.td-module-comments{
display:none;
}

Thank you!

Hi,

If you would set those properties to the logo image it would look like this – https://www.screencast.com/t/PVOTeniNMq since there is no space available for the logo to display in the same line with the header ad, in these conditions. The best you could do with this header style and still display properly is like this – https://www.screencast.com/t/as8bMlPxscQw using this code, you should enter it in Theme panel->Advanced Css in the desktop section – https://www.screencast.com/t/7geRJitW0

.td-header-style-1 .td-header-sp-logo img {
min-height: 131px;
min-width: 340px;
}
.td-header-style-1 .td-header-sp-logo {
min-height: 131px;
min-width: 340px;
margin:0;
}

Thanks

Hi,

Well you could use some css for this, like here if you are using a stars based review – https://www.screencast.com/t/MobNKsJReS7W or here for the other two options – https://www.screencast.com/t/RseaZj8VC
These are the codes used, just enter the one that applies in your case, in Theme panel->Custom Css

.td-review-row-stars,
.td-review-header {
display:none;
}

.td-review-row-bars,
.td-review-header {
display:none;
}

Thanks

Hi,

Some of the properties you are trying to change about the blockquote, are available in Theme panel->Theme Fonts->Post content – https://www.screencast.com/t/5oDw4aI9xDCP But if you want to change them through that css code, try it like this

.td-post-content blockquote p {
max-width: 600px;
margin: 20px;
padding: 10px;
text-align: center;
font-family: sans-serif;
font-size: 16px;
color: #7f7f7f;
border-left: 6px solid #38b6cd;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
}

With this result – https://www.screencast.com/t/NPHUZkcN8
Thanks