Search Results for 'css'

Results from the Forum
Bogdan B.
tagDiv Staff

Hello,

The sidebar on mobile is moved under the content by default. If you want to remove sidebars, please use this code in the theme panel -> custom css box:

@media(max-width:767px){
.td-main-sidebar{
display:none!important;
}
}

Thank you!

arredoannunci
tagDiv Member

Hello,
First of all, thank you for having responded to me
I have entered the css code
but it does not work
Mobile slider is always crushed

Bogdan B.
tagDiv Staff

Hello,

This is the way the slider is implemented on mobile devices. It has the same behavior on our demo page: https://demo.tagdiv.com/newspaper/ios-slider/
I will add this to our list for future updates and see if we can change the responsive nature of the thumb, Until then you can adjust the slider image height on mobile devices using this css:
@media (max-width: 500px){
.iosSlider-col-3 .td_module_slide .td-module-thumb, .iosSlider-col-3 .td_module_slide .entry-thumb {
height: 120%;
}

You can add the code in the theme panel-> custom css box.

Thank you!

Simion C.
tagDiv Staff

Hi,

Please try the code provided below, it should make the images inside the gallery not clickable. If you have the mobile theme activated enter the code in Theme panel->Mobile theme Custom Css section. If you do not have this plugin active, you need to enter it in Theme panel->Custom code->Advanced Css in the Phones section.
Please let me know if this is working for you.

.td-slide-galery-figure {
pointer-events: none;
}

Thanks

Simion C.
tagDiv Staff

Hi,

If you mean something like this
https://www.screencast.com/t/MImPUbnJ
You can do that with a code like the one below, just enter it in Theme panel->Custom CSS

.td-header-style-10 #td-header-menu {
float: right;
}

Thanks

Catalin
tagDiv Staff

Hello breakingtech,

.td_block_trending_now{
border-top:1px solid #4facea;
border-width: 1px 0 0 0!important;
}

Try the code above and place it in Theme panel->Custom CSS Area.

Thanks.

Simion C.
tagDiv Staff

Hi,

You could edit these two files from the theme and remove that text. This is displayed when there is no menu selected for the header section
https://www.screencast.com/t/mSVCZTmExLF
https://www.screencast.com/t/kKGJGFx8
The search could be disabled in the same files by commenting or removing the responsible code
https://www.screencast.com/t/FwGZw79HAek
Or you could hide it with Css
https://www.screencast.com/t/U2GCaW4NN
The code must be entered in Theme panel->Custom Css

#td-top-search {
display: none;
}

Thanks

TheY
Participant
#0

Hello guys,

Im using header style 10, but I would like the main menu to be aligned to the right as in style 7. Could you tell me what custom CSS I need to use to achieve this? https://tinyurl.com/y95nxm22

Thanks!

Simion C.
tagDiv Staff

Hi,

That category template will display the image as a background on the page. That is the way this style was designed. It would not be easy to modify the category template to display that way.
You could use some Css to set an image background, without placing one in the category settings. But this may not work properly, or may need further testing
https://www.screencast.com/t/9VZfDGSBs4Q
Here is the code used if you want to try it or experiment with it

.td_category_template_8
.td-category-header {
background: url("");
background-size: cover;
}

Thanks

Catalin
tagDiv Staff

Hello Dave,

I have inspected your website and I saw that your sub-footer container has display: none rule and that’s why you cannot saw it. Use the code below and place it in Theme panel->Custom CSS area.

The code is ->

.td-sub-footer-container {
display: block;
}

Hope this helps!

Thanks for the message!

Richard
tagDiv Member

Hi Catalin

My apologies, I may not have been very clear in my last update. I put your suggested CSS code in but it didn’t reduce the gap between the bottom of the content and the footer on womensgolf.com. The CSS I put into Custom CSS was
.home .td-main-content-wrap {
padding-bottom: 20px;
}

Because it didn’t work can you suggest any other potential solutions or errors I may have made.

Thank you
Richard

guytruong
tagDiv Member

Thanks Simion,

But for some reason in the theme panel the “Modules MX and others blocks” keep on loading and won’t open. (all others open fine under Theme Fonts, it’s a bit slow tho)

Have you encountered this issue ? If so could you give me some fix for this issue ? Or any directions on why it does not load.

All I recall is that I’ve changed couple things under Custom Code > Custom CSS but reverted back as changing CSS didn’t help Big Grid Full 9, it might have nothing to do with it.

Thanks

Catalin
tagDiv Staff

Hello Votac,

1)Notice that errors do not come from our theme, sorry! It seems to be a problem caused by your browser. Check the following useful guide here -> https://support.mozilla.org/en-US/questions/936370
2)We recommend using the Background setting from our Theme panel, like this -> https://www.screencast.com/t/KoAdyujIqu and the background will be applied to the entire website. Also, if you want that your each post to have a different background, notice that you should use a bit of CSS code to do this and also, some CSS rule if you want to setup the transparency for your post images. It is not a simple task 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 custom services at the moment, sorry!
3)Unfortunately, Big Grid Full 3 does not have the Slide option available, I’m sorry! You should use the Big Grid Slide (iOS Slider).

Thanks for the message!

albedomedia
tagDiv Member

Hi Catalin.

As I understand, the mobile theme is only available for the Newspaper theme, but not for the Newsmag one (the one we’re using). Anyway, the custom CSS code, is used to customize the mobile view, and the problem is that the images are no clickable anymore (links to the post url are removed). Could you please indicate us how to put back these links? Thank you.

Simion C.
tagDiv Staff

Hi,

One way would be to edit the footer file from the mobile theme folder
https://www.screencast.com/t/QVemYoHfCo
And comment or remove the code that handles the logo and description in the footer, when using the mobile theme plugin
https://www.screencast.com/t/LCx8QoXy
https://www.screencast.com/t/mAzuadGi
Another way would be to simply hide them with some Css like this
https://www.screencast.com/t/PFUdCIt1P
This is the code, if you decide to use it it must be entered in Theme panel->Mobile theme->Custom Css section

.td-mobile-footer-wrap {
display:none;
}

If this is not what you wanted or the code is not working properly for you, please let me know.

Thanks

Richard
tagDiv Member

Hi Catalin

I have included the CSS but the gap remains – are there any other possibilities I could check for. Here is the Custom CSS I implemented for the http://www.womensgolf.com front page.

.dtherpt {display:none !important}
.entry-crumbs a {
color:black;
font-size: 12px;
}
.entry-crumbs {
color:black;
font-size: 12px;
}
.td-footer-wrapper div .td_block_template_4 .td-block-title > *{
background-color: #b50f0f;
}
.td-footer-wrapper div .td_block_template_4 .td-block-title > *:before{
border-color: #b50f0f transparent transparent transparent;
}
.home .td-main-content-wrap {
padding-bottom: 20px;
}

Thank you

Richard

simchris
tagDiv Member

Generally the only way to eliminate the render blocking with Google fonts, is to move the CSS into top of your style.css to load fonts “directly” vs loading the .css sheet off Google’s CDN.

You can also try adding your custom CSS to bottom of style.css vs adding to theme panel.

Finally, you can also ‘view source’ on your page to see WHAT is actually loading at top/bottom of rendered post pages.

Not sure that helps or not.

guytruong
Participant
#0

Hello,

Could you help with the css to change the font-size for Big Grid Full 9 ?

I’ve seen other posts related to this temporary issue but could get it to work for Big Grid Full 9.

Thank you in advance for your help.

dbelegris
Participant
#0

Dear Sir/Madame,

I am facing a theme speed issue after adding custom CSS to my theme, from the theme panel. Initial speed, without the custom CSS, is 94/97 on Speed Insights which is super.

Upon adding the custom CSS I get these 6 strange render-blocking CSS which where not there before:
http://astropaideia.wpengine.com/wp-content/plugins/contact-form-7/includes/css/styles.css?ver=4.8
http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700|Roboto+Condensed:300,300italic,400,400italic,700,700italic&ver=3.4
http://astropaideia.wpengine.com/wp-content/plugins/jetpack/_inc/genericons/genericons/genericons.css?ver=3.1
http://astropaideia.wpengine.com/wp-content/plugins/jetpack/css/jetpack.css?ver=5.0
http://astropaideia.wpengine.com/wp-content/plugins/js_composer/assets/css/js_composer.min.css?ver=5.1.1
http://astropaideia.wpengine.com/wp-content/themes/Newsmag/style.css?ver=3.4

As a result the website speeds down by 79/91, which is great, but why not speed up more (I mean your theme has amazing speed).

Even if I deactivate all erelevant plugins like Jetpack or Contact Form 7, I still get render 4 blocking sources (which I don’t get without the custom code)
http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700|Roboto+Condensed:300,300italic,400,400italic,700,700italic&ver=3.4
http://astropaideia.wpengine.com/wp-content/plugins/js_composer/assets/css/js_composer.min.css?ver=5.1.1
http://astropaideia.wpengine.com/wp-content/themes/Newsmag/style.css?ver=3.4

I followed your instructions here but I cannot seem to find these particular CSS that causes this
https://forum.tagdiv.com/how-to-make-the-site-faster/

Based on your instruction I added to the td-speed-booster.php the following code
//@todo test on newsmag
$this->move_style_to_footer_queue(‘contact-form-7’);
$this->move_style_to_footer_queue(‘jetpack’);
$this->move_style_to_footer_queue(‘js_composer_front’);
$this->move_style_to_footer_queue(‘Newsmag’);

but the issue persists.

Unfortunately I cannot use WP Cache on my server because it does not support the plugin. I can use other 3rd party plugins to optimize (Autoptimize, Above the fold) but that will only take me to 84%.

Any suggestions?
Am I doing something wrong??

My website url is this one:
http://astropaideia.wpengine.com/

Thank you for the great theme,
Dimitris Belegris

albedomedia
Participant
#0

Hi. We’re currently using blocks 11 and 12 to show entries in our homepage; however, we don’t like how they display on mobile. We have then customised (with custom CSS code for mobile) the behaviour in order to match the style of block 4 on mobiles, to show all both the featured imagen and the excerpt full width:

/* Show block 11 and 12 as block 4 on mobile */
.td_block_11 .td-module-thumb .entry-thumb,
.td_block_12 .td-module-thumb .entry-thumb,
.td_block_11 .td-module-thumb,
.td_block_12 .td-module-thumb
{
width: 100%!important;
}
.td_block_11 .item-details,
.td_block_12 .item-details{
margin-left: 0;
}
.td_block_11 .td-module-thumb,
.td_block_12 .td-module-thumb {
position: relative;
}
.td_block_11 .td-excerpt,
.td_block_12 .td-excerpt {
display: block;
}

That works fine except that the image is not linked anymore to the post url. Why? Thank you for your support.

Simion C.
tagDiv Staff

Hi,

The Big Grids and some blocks do have that effect applied on the images. There are different styles that can be selected on a Big grid for example
https://demo.tagdiv.com/newspaper/big-grid-1/
To remove that black tint from the Big Grid on your page and the module below it, you can try a code like this that will remove the effect
https://www.screencast.com/t/UIChfg9w
The code must be entered in Theme panel->Custom Css

.td-grid-style-1.td-hover-1 .td-module-thumb a:last-child:before,
.td_module_mx8 .td-module-thumb a:last-child:after {
display:none;
}

Please let me know if this is what you wanted or you need something else. I have edited your previous reply and removed the login information.

Thanks

Fenix
tagDiv Member

The problem is that it may be a temporary fix, because when tagDiv will change something of the css it will not work anymore.
I would prefer to use a permanent fix.
Thank you anyway.

jescalona
tagDiv Member

Ok, the activation is do it. Now the problem is in the Visual Composer, the image style don’t work and other css animation. In older version work it.
Need i have the license of Visual Composer? I see that the license is include in the same theme license.

  • This reply was modified 9 years by jescalona.
Simion C.
tagDiv Staff

Hi,

One way would be to use a plugin that has that option. The other would be to make some modifications to the theme. Here is a related topic
https://forum.tagdiv.com/topic/how-to-make-this/
You need to edit the corresponding file from the theme, according to the post template style that you are using.
For example if you are using Post template style 2, opening the single_template_2.php file from the main theme folder you will see the line that needs to be replaced
https://www.screencast.com/t/g53HT0PldRtj
Like this
https://www.screencast.com/t/4hGRjk2K
Then enter this code in Theme panel->Custom Css

.td-module-meta-info {
display:inline-flex;
}
.the-modified-date {
padding-left:5px;
padding-right:10px;
padding-top:2px;
}

You can use an existing class instead of the one currently in the code
https://www.screencast.com/t/ROSOqFlXMW
This way there would be no need to enter the Css code in Theme panel.
At the moment there is no setting in the theme that would allow the modified date to be displayed on posts. That is why you could probably search for a plugin that you can use. Or try the method presented above.

Thanks

Simion C.
tagDiv Staff

Hi,

For the Block 9 on your homepage you can try this code
https://www.screencast.com/t/YfJm1pIisMkO
It will remove the padding and margins for the module used on Block 9 only

.td_block_9 .td_module_8 {
padding-bottom: 0;
margin-bottom: 0;
}

The code has to be entered in Theme panel->Custom Css section. Please let me know if this is what you wanted, or you need something else.

Thanks

Viewing 25 results - 17,501 through 17,525 (of 33,436 total)