Hello,
Please try to add !important to the css like so:
#td-mobile-nav {
position: fixed!important;
}
Thank you!
Hello,
Please make sure ssl is properly implemented on your site.
In order to properly implement ssl please follow these tutorials:
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/
https://forum.tagdiv.com/topic/moving-to-ssl/
I hope this helps.
Hello fakhri,
You should use the code below and place it in the Theme panel -> Custom CSS code.
The code is here ->
.td-related-title .td-cur-simple-item{
background-color:black;
color:green!important;
}
Thanks.
Hello leahmaarit,
Yes, this change could be possible from CSS code but it’s needed to provide your website URL so I can take a closer look at it.
Thanks for your understanding!
Hello willysawa,
If you want to hide the meta info date only for Block 17, please try using the code below and place it in Theme panel -> Custom CSS area.
The code is ->
.td_module_4 .td-module-meta-info .td-post-date, .td_module_8 .td-module-meta-info .td-post-date{
display:none;
}
Hope this helps!
Thanks for your understanding!
This is a message for the TagDiv team
Tag “style amp-custom” cannot have “CSS !important”.
https://www.ampproject.org/docs/fundamentals/spec#stylesheets
HTML “col” not allowed
https://www.ampproject.org/docs/fundamentals/spec#html-tags
Template is missing. Standalone themes need to have a index.php template file. Child themes need to have a Template header in the style.css stylesheet.
Even I used FTP to upload the theme they gove me this message
I uploaded just the theme for wordpress
Hello all,
I have a problem with the newsletter. I chose mailerlite, but I have the following error : Newsletter mailerlite > embedded form code configuration is not correct ; when I tried to add the embed form as Mailerlite provided me :
<style>
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700,700i&subset=cyrillic,cyrillic-ext,latin-ext');
#mlb2-8437606,
#mlb2-8437606 *,
#mlb2-8437606 a:hover,
#mlb2-8437606 a:visited,
#mlb2-8437606 a:focus,
#mlb2-8437606 a:active {
overflow: visible;
position: static;
background: none;
border: none;
bottom: auto;
clear: none;
cursor: default;
float: none;
letter-spacing: normal;
line-height: normal;
text-align: left;
text-indent: 0;
text-transform: none;
visibility: visible;
white-space: normal;
max-height: none;
max-width: none;
left: auto;
min-height: 0;
min-width: 0;
right: auto;
top: auto;
width: auto;
z-index: auto;
text-shadow: none;
box-shadow: none;
outline: medium none;
}
#mlb2-8437606 a:hover {
cursor: pointer !important;
}
#mlb2-8437606 h4 {
font-weight: normal;
}
#mlb2-8437606 .subscribe-form {
padding: 20px;
width: 350px !important;
border: 2px solid #F6F6F6 !important;
background: #f6f6f6 none !important;
border-radius: 0px !important;
box-sizing: border-box !important;
}
#mlb2-8437606 .ml-block-form {
margin-bottom: 0px;
}
#mlb2-8437606 .subscribe-form .form-section {
margin-bottom: 20px;
width: 100%;
}
#mlb2-8437606 .subscribe-form .form-section.mb10 {
margin-bottom: 10px;
float: left;
}
#mlb2-8437606 .subscribe-form .form-section.mb0 {
margin-bottom: 0px;
}
#mlb2-8437606 .subscribe-form .form-section h4 {
margin: 0px 0px 10px 0px !important;
padding: 0px !important;
color: #000000 !important;
font-family: 'Open Sans', sans-serif !important;
font-size: 28px !important;
line-height: 100%;
text-align: left !important;
}
#mlb2-8437606 .subscribe-form .form-section p,
#mlb2-8437606 .subscribe-form .form-section li {
line-height: 150%;
padding: 0px !important;
margin: 0px 0px 10px 0px;
color: #000000 !important;
font-family: 'Open Sans', sans-serif !important;
font-size: 14px !important;
}
#mlb2-8437606 .subscribe-form .form-section a {
font-size: 14px !important;
}
#mlb2-8437606 .subscribe-form .form-section .confirmation_checkbox {
line-height: 150%;
padding: 0px !important;
margin: 0px 0px 15px 0px !important;
color: #000000 !important;
font-family: 'Open Sans', sans-serif !important;
font-size: 12px !important;
font-weight: normal !important;
}
#mlb2-8437606 .subscribe-form .form-section .confirmation_checkbox input[type="checkbox"] {
margin-right: 5px !important;
}
#mlb2-8437606 .subscribe-form .form-section .form-group {
margin-bottom: 15px;
}
#mlb2-8437606 .subscribe-form .form-section .form-group label {
float: left;
margin-bottom: 10px;
width: 100%;
line-height: 100%;
color: #000000 !important;
font-family: 'Open Sans', sans-serif !important;
font-size: 14px !important;
}
#mlb2-8437606 .subscribe-form .form-section .checkbox {
width: 100%;
margin: 0px 0px 10px 0px;
}
#mlb2-8437606 .subscribe-form .form-section .checkbox label {
color: #000000 !important;
font-family: 'Open Sans', sans-serif !important;
font-size: 14px !important;
}
#mlb2-8437606 .subscribe-form .form-section .checkbox input {
margin: 0px 5px 0px 0px;
}
#mlb2-8437606 .subscribe-form .form-section .checkbox input[type=checkbox] {
-webkit-appearance: checkbox;
opacity: 1;
}
#mlb2-8437606.ml-subscribe-form .form-group .form-control {
width: 100%;
font-size: 13px;
padding: 10px 10px;
height: auto;
font-family: Arial;
border-radius: 0px;
border: 1px solid #cccccc !important;
color: #000000 !important;
background-color: #FFFFFF !important;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
clear: left;
}
#mlb2-8437606.ml-subscribe-form button {
border: none !important;
cursor: pointer !important;
width: 100% !important;
border-radius: 0px !important;
height: 40px !important;
background-color: #000000 !important;
color: #FFFFFF !important;
font-family: 'Arial', sans-serif !important;
font-size: 16px !important;
text-align: center !important;
padding: 0 !important;
margin: 0 !important;
position: relative!important;
}
#mlb2-8437606.ml-subscribe-form button.gradient-on {
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
background: linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
}
#mlb2-8437606.ml-subscribe-form button.gradient-on:hover {
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);
background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);
background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);
background: linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);
}
#mlb2-8437606.ml-subscribe-form button[disabled] {
cursor: not-allowed!important;
}
#mlb2-8437606.ml-subscribe-form .form-section.ml-error label {
color: red!important;
}
#mlb2-8437606.ml-subscribe-form .form-group.ml-error label {
color: red!important;
}
#mlb2-8437606.ml-subscribe-form .form-group.ml-error .form-control {
border-color: red!important;
}
@media (max-width: 768px) {
#mlb2-8437606 {
width: 100% !important;
}
#mlb2-8437606 form.ml-block-form,
#mlb2-8437606.ml-subscribe-form .subscribe-form {
width: 100% !important;
}
}
</style>
<div id="mlb2-8437606" class="ml-subscribe-form ml-subscribe-form-8437606">
<div class="ml-vertical-align-center">
<div class="subscribe-form ml-block-success" style="display:none">
<div class="form-section">
<h4>Newsletter</h4>
<p>Thank you! You have successfully subscribed to our newsletter.</p>
</div>
</div>
<form class="ml-block-form" action="https://landing.mailerlite.com/webforms/submit/u4e3o5" data-id="839046" data-code="u4e3o5" method="POST" target="_blank">
<div class="subscribe-form">
<div class="form-section mb10">
<h4>Newsletter</h4>
<p>Signup for news and special offers!</p>
</div>
<div class="form-section">
<div class="form-group ml-field-email ml-validate-required ml-validate-email">
<input type="email" name="fields[email]" class="form-control" placeholder="Email*" value="" autocomplete="email" x-autocompletetype="email" spellcheck="false" autocapitalize="off" autocorrect="off">
</div>
</div>
<input type="hidden" name="ml-submit" value="1" />
<button type="submit" class="primary">
Subscribe
</button>
<button disabled="disabled" style="display: none;" type="button" class="loading">
</button>
</div>
</form>
<script>
function ml_webform_success_8437606() {
var $ = ml_jQuery || jQuery;
$('.ml-subscribe-form-8437606 .ml-block-success').show();
$('.ml-subscribe-form-8437606 .ml-block-form').hide();
};
</script>
</div>
</div>
<script type="text/javascript" src="https://static.mailerlite.com/js/w/webforms.min.js?v3772b61f1ec61c541c401d4eadfdd02f"></script>
Any idea ?
Hi Bogdan,
I’m sorry for my late response.
Thanks a lot for your help!!
Could you please tell me where I have to add this code?
In Newspaper > Theme Pannel > Custom Code > Custom CSS?
I did not add the image manually over there. I only changed the header background-image of Header Box 6 (please see this topic I created: https://forum.tagdiv.com/topic/excerpt-not-shown-on-blog-page-change-background-of-headers/)
I look forward to your response!
Nick
Hi there,
I need your help in getting the Art Creek thumbnail on hover shadow look for my website https://creativetacos.com
What is the CSS code and where to place it so we can get that look ?
Thanks,
I tried inserting this code but it doesn’t seem to be working (Theme panel > mobile theme > custom css. Any ideas?
It worked perfectly, but i want to hide only the date for block 17. how do i achieve it using css ? something like hide meta info
Hello,
You will not be able to find the exact strings in the db as it is encoded base 64. Here is how you can find it.
Find your page under WP-Posts and edit it: https://www.screencast.com/t/KxK0lNgxtX
The grab the css for the hero block and decode it using https://www.base64decode.org/
https://www.screencast.com/t/MAVgX1cHa
Thank you!
Try entering it in the theme panel custom CSS code section, that would be an alternative to the live CSS window.
However the live CSS should work properly as well. I have tried it on my end and there was no problem with it. You could try deactivating all plugins except theme plugins, maybe it is a plugin conflict. Then check if the code is saved as intended. Let us know.
Now I Have problem with Live CSS, I Cant save my code
Hello,
Please add this css code to your theme panel custom css section:
.td_block_2 .td_module_6 .td-module-thumb{
display:none;
}
.td_block_2 .td_module_6 .item-details{
margin-left:0;
}
Thank you!
Hi,
There is a default margin and padding set on the module of that block, You could reduce those with a code like this
– https://www.screencast.com/t/biVMbxcDoUW
.td_block_9 .td_module_8 {
padding-bottom: 15px;
margin-bottom: 8px;
}
You can change the values in the code if needed, set them how you want. The browser inspector is a useful tool you can use to create simple CSS codes
– https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thanks
Hello,
This issue happens because all your posts have an empty div with a FB id. https://www.screencast.com/t/aZ52OA9c5Jj
There is a css in our theme regarding that id that fixed a margin issue for facebook videos, but it seems the fb-root class is used in other places as well.
It could be a plugin that adds the div with the specific class to your posts.
You can use this quick fix for now:
*add this code in your theme panel custom code section:
.td-page-content p, .td-post-content p, .wpb_text_column p, .td_block_text_with_title p, .woocommerce #tab-description p, .mce-content-body p{
margin-bottom: 26px!important;
}
Thank you!
Each module has a predefined padding space in that block and in most blocks
– https://www.screencast.com/t/UzsvKXqyOUbO
For that block you could reduce it with a code like this
– https://www.screencast.com/t/W4lHwBXk5Um
Custom CSS codes can be entered in Theme panel->Custom code section.
.td_block_7 .td_module_6 {
padding-bottom: 13px;
}
please help me with
1.css code to make the leading text more bigger
2. Css code to close the top and bottom space
3. make the div line more bigger n visible
4. hide the date
Please can you give me the css code to hide all the image on block 2, but only allow the fist one to show, also to make the first text bold as shown on this image
Hi,
I tried the following code in the css but the top bar is still not displaying on mobile.
@media (max-width: 767px){
.td-header-top-menu-full {
display: block!important;
}
.td-header-sp-top-menu {
display:block!important;
}
.td-header-style-12 .top-header-menu > li, .td-header-style-12 .td-header-sp-top-menu, .td-header-style-12 .td-header-sp-top-widget{
line-height:30px;
}
#menu-secondary-navi-menu{
text-align:center;
}
}
Please support, can you help me with the css code to reduce the space of top and bottom on block 9 just as seen in the image 
this is whole thing in my custom CSS:
.td-header-header {
border-bottom: 1px solid #353535;
}
.td-black .td-video-template-bg {
background-color: rgba(0,0,0,0.4);
}
.td-black .td-video-template-bg-small{
background-color: rgba(0,0,0,0.7);
}
.td_module_9 .td_quote_on_blocks {
font-size: 16px;
line-height: 20px;
font-weight: 300;
font-style: italic;
text-align: center;
text-transform: none;
margin-top: 10px;
}
.td-black .td_quote_box .single_template_11 {
background-color: rgba(33,33,33,0.5);
}
cite {
font-size: 12px;
color: #bbb;
}
.td-black .td-smart-list-dropdown-wrap .td-smart-next,
.td-black .td-smart-list-dropdown-wrap .td-smart-back {
color:#fff;
}
.td-black .td-smart-disable:hover {
background-color: transparent !important;
}
.td-post-sub-title {
text-align: center;
}
.td-black .post {
background-color: rgba(0,0,0,0.6);
}
.td-black .td-main-content-wrap,
.td-black .td-category-grid,
.td-black .td-category-header,
.td-black .td-big-grid-post .td-module-thumb,
.td-black .td_module_14 .td-module-meta-holder,
.td-black .td-post-template-4 .td-post-title,
.td-black .td-post-template-6 .td-post-header-holder,
.td-black .td-post-template-8-box,
.td-black .td-smart-list-dropdown-wrap .td-smart-list-dropdown,
.td-black .td_module_mx3 .td-module-meta-info {
background-color: rgba(0,0,0,0.6);
}
.td-black .td-page-content,
.td-black .td-post-content,
.td-black .wpb_text_column,
.td-black .td_block_text_with_title,
.td-black .woocommerce #tab-description {
color: #bbb;
}
