Search Results for 'css'

Results from the Forum
christinarroot
tagDiv Member

I implemented both of those in the custom CSS portion of the Theme Panel and nothing changed. Did I do something wrong?
https://www.dropbox.com/s/ittliuuqhtlcwy9/Screenshot%202016-08-02%2010.37.20.png?dl=0

DeRothschild
Participant
#0

Hey guys,

I’m trying to achieve the following effect, via CSS:

1. Making the sidebar on an article page narrower.

2. If possible, making the main container wider (i.e. eliminating the gutters / padding from the left and right edges of the screens).

Here’s an example:
A. http://www.themarker.com/ (almost no gutters)
B. http://www.haaretz.co.il/labels/pegasus/1.2554019 (Narrower gutters)

What’s the best way to achieve these in terms of which div ID’s/Classes to play with in the CSS?

Thanks 🙂

mabaz
tagDiv Member

Hello,

I’m not aware of any straightforward solution to what you’ve asked but there are some recommendations that you can consider. On my website I have added following code to .htaccess file:
ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType image/jpeg "access plus 2592000 seconds"
ExpiresByType image/png "access plus 2592000 seconds"
ExpiresByType image/gif "access plus 2592000 seconds"
ExpiresByType text/css "access plus 604800 seconds"
ExpiresByType text/javascript "access plus 604800 seconds"
ExpiresByType application/javascript "access plus 604800 seconds"
ExpiresByType text/html "access plus 2592000 seconds"

So it’s kind of workarround but it optimize loading because those lines utilize browser caching so user’s browsers will not fetch images (I’m guessing your ads are some kind of images) that often (as it would if there’s no mentioned code in .htaccess).
As you can see I’ve done same ‘optimization’, in terms of loading those resources, for the css and js.

pedroarmindo1
tagDiv Member

Hello,

The only problem with this is that even with the Custom CSS, the ads still carry with the page, and at certain times it is possible to see the page of relocating to hide the ads.

There is a way to block the loading?

Catalin
tagDiv Staff

Hello

If you want to achieve this -> http://screencast.com/t/tfjSe2rMN , you will have to use a bit of CSS code to do that.

The code is ->

.td_module_trending_now .td-module-title a {
color:red!important;
background-color:blue!important
}

Thanks.

Andrei L.
tagDiv Member

Hi

You can try to modify html structure of block title element and to achieve that you need to edit the function which generate it: http://screencast.com/t/t5ax8sKyX
You can try something like this, it may help:

$buffy .= '

';


If that does not work try using pseudo element before: http://www.w3schools.com/css/css_pseudo_elements.asphttp://www.w3schools.com/css/tryit.asp?filename=trycss_before

Hope this helps.
Thanks!

Andrei L.
tagDiv Member

HI

You can try this css in theme panel > custom code > custom css:

.page-id-123 .td_block_2 .td-excerpt{
display: none!important;
}

Just add the page id in css class and it should work fine: http://screencast.com/t/tEB8AEJo
Let me know how it goes.
Thanks!

Catalin
tagDiv Staff

Hello christinarroot,

If you want to change the hover color for post category, please try to use the code below and place it in Theme panel->Custom CSS area.

The code is ->

.td-hover-1 .td-big-grid-post:hover .td-post-category {
background-color:red!important;
}

The result you should see here -> http://screencast.com/t/hnFlu9yTvGZ

Thanks for your understanding!

Andrei L.
tagDiv Member

HI

Try this css in theme panel > custom code > custom css: http://screencast.com/t/jndZLrh1GgUn

.td-footer-template-14 .block-title{
display: none;
}

IF this is not what you mean please provide your site url so I can have a closer look and get back to you with a more accurate answer.
Thanks!

Andrei L.
tagDiv Member

Hi

That happens because some fonts do not support Greek characters. The css works fine and the font is applied over each element, but when the title contains Greek characters is not rendered: http://screencast.com/t/OBqRZncirYXZ Try to download a font which support Greeks characters and use it as a custom font for the site: https://forum.tagdiv.com/newsmag-using-custom-fonts/

Thanks!

Andrei L.
tagDiv Member

Hi

Speed Booster plugin only moves css/js resources to page’f footer and should not affect the seo. We did not received such reports so far but if you consider that it affect the site you can deactivate the plugin.

Thanks!

Andrei L.
tagDiv Member

Hi

Unfortunately mobile theme does not have options which allows you to change the fonts yet but probably in future we will add such options. For the moment to load different fonts for mobile you have to edit theme’s code. The css code for mobile theme is located here: http://screencast.com/t/XFivsX0A1 but to change the font for all elements you have to go trough all code and locate the lines which refers to font-family. This is a quite difficult task considering the code’s size. The easiest way to keep the desktop fonts on mobile is to deactivate mobile theme plugin.
Yes we’re aware about that issue and will be fixed in next theme’s update but meanwhile you ca use this css in theme panel > mobile theme > custom code to fix it.

.td-post-author-name div { display:inline; }

Thanks!

Andrei L.
tagDiv Member

HI

This task cannot be achieve just by coping and pasting some code in a file. This may probably worked in a previous theme but we use a custom structure for files and it’s a bit more complicated.

You have to edit the file which correspond with thew post template used and paste the code in post’s meta-info container: http://screencast.com/t/ueEY2sfq You will also need some css customizations for button’s style otherwise the layout may affected a bit.
To achieve this task you need some basic codding skill as there are required changes in theme’s code. Unfortunately we can’t offer customization services at the moment so if you still need guidance on this or you’re not aware of the steps you need to take in this regard please consider hiring a developer or a freelancer to do this for you. Also consider using theme sharing buttons which include twitter, as an alternative: http://screencast.com/t/CSlSFryt

Thanks!

Catalin
tagDiv Staff

Hello Jay,

Unfortunately, our theme does not have such a simple option that offers you a way to add different menus for different pages, sorry! Is needed to make some additional customizations through code in order to achieve best results and if you do not have any experience in PHP/HTML/CSS you will not bring good results and place consider hiring a freelancer/developer to help you because we cannot provide customization services at the moment, sorry!
As a hint, you will have to declare a new ID for your custom menu in function hook_init() from td_menu.php like this -> http://screencast.com/t/y6czZKpC2 and then depending on what header you use, you will have to add the condition, like this -> http://screencast.com/t/rbMRlAi875E9
Please notice that is not a simple task and require to have some experience in this regard to accomplish this task.

Thanks for your understanding!

Andrei L.
tagDiv Member

Hi

You have to edit page-pagebuilder-title.php file and add the code in the case which corresponds with sidebar’s position for that page: http://screencast.com/t/onVhyUOK61 Note that you will also need some css customizations in order to achieve the deserted result. This task involve some codding skills and if you’re not aware of the steps that must be taken in this regard my advice is to look for someone who can help you with implementation as we can’t offer custom work.

Thanks!

mabaz
tagDiv Member

Hello Catalin,

thanks for your effort. I’ve tried to sort it out using css in custom code and it seems to be working as I wanted.
CSS code that I’ve uesd is:
article:not(.category1):not(.category2) .td-a-rec-id-content_inlineleft {display:none;}
where .category1 and .category2 are selectors of articles with specific class attributes.

  • This reply was modified 10 years by mabaz.
Catalin
tagDiv Staff

Hello Praveen,

If you want to hide the Google Adsense for your particular post, please notice that you will have to use a bit of CSS code to hide the td-g-rec class and also, you will have to get the post ID for your particular post where you want to hide the Ads.
Below, I gave you an example for a post which I have hidden the Google Adsense, like this ->

.postid-462 .td-g-rec {
display:none;
}

-> http://screencast.com/t/lPJ1wGeUtUOL

You will have to do something similar for your side, take the post ID and apply the code provided above.

Thanks for your understanding!

Andrei L.
tagDiv Member

Hi

You have to use the code like here: http://screencast.com/t/XHuVjj3my0

<?php echo get_post_meta($this->post->ID, 'custom-field-name', true); ?>

In above example I’ve added post_views_count field in trending now block. Note that you will need this css to make the custom filed content visible: http://screencast.com/t/ynfAnosf

.td-trending-now-display-area .entry-title {
display: inline-block!important;
} 

Thanks!

MESOTU
tagDiv Member

Hi Catalin,
Thanks for this. I have added this code and it appears to have resolved the desktop/laptop browser issue. But when I look at an article on my Android phone, it is still rendering broken and disjointed as before.

I added the code as follows:

.td-post-author-name div {
display:inline!important;
}

I am not using the mobile theme by choice. I just want my site to use the regular responsive feature.

Is there any additional CSS coding I could use to force it to fix it in android?

I have emptied the cache after the change and emptied the cache in all browsers, but still no luck on the android side of things.

Thank you very much for your help.

Kind regards

  • This reply was modified 10 years by MESOTU.
KatyBee
Participant
#0

Hello again! 🙂

I cannot see a way to customise the fonts or appearance of the mobile theme. I have read that this hasn’t been implemented yet. What CSS I would need to add to change the post title and post body fonts?

Most notably, I use a custom font called font2-webfont.woff as General Font for all post titles, which renders well on mobile but disappears when I use the mobile theme. I’d like to add this into the custom CSS so it uses it on the theme. What code do I need to add to do this?

Also, are you aware of the bug with the author and date disappearing at the top on the mobile theme? I’m using a Galaxy S6 Edge Plus with the Chrome browser.

KatyBee
Participant
#0

Hello,

I have just bought the theme and may have a number of questions!

I would like to add an additional element to the line where the author and date is on posts. I know I will have to do this in the CSS files, but I do not know where to look.

I’m specifically looking to add a clickable Twitter follow button inline after the author. I already know this can be done as I did this manually on my previous theme using code as follows:

<?php if( $twitter_url = get_the_author_meta(‘twitter’) ) : ?>
” class=”twitter-follow-button” data-show-count=”false” data-show-screen-name=”false”>Follow @<?php echo basename($twitter_url); ?>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?’http’:’https’;if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+’://platform.twitter.com/widgets.js’;fjs.parentNode.insertBefore(js,fjs);}}(document, ‘script’, ‘twitter-wjs’);</script>
<?php endif; ?>

Catalin
tagDiv Staff

Hello Winock,

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

The code is ->

.td-post-content p {
text-align: justify;
}

Thanks.

Andrei L.
tagDiv Member

Hi

Sorry for misunderstanding.
This happens because you’re using homepage post element which extends by default above main menu. Try this css in theme panel > custom code > custom css to make the background black: http://screencast.com/t/yQMoNEoaV

.home .td-header-style-8 .td-header-sp-logo {
background-color: black;
}

Thanks!

Catalin
tagDiv Staff

Hello johnmiao,

If you want to decrease the padding-bottom and margin-bottom for your Block 17, please try the code below and place it in Theme panel->Custom CSS area.

.td_block_17 .td_module_8 {
padding-bottom: 5px;
margin-bottom: 5px
}

Thanks.

Bogdan B.
tagDiv Staff

Hello,
It seems your images are getting a margin from something called blogchatter: http://screencast.com/t/vnNJdxsK If I remove this margin then images position OK. You can either remove blogchatter or use this css as a quickfix:

.td-post-template-default .td-post-featured-image img{
margin:0!important;
}

Thank you!

Viewing 25 results - 21,776 through 21,800 (of 33,436 total)