Search Results for 'css'

Hi,

@Mr_S As the top bar was not designed to work on mobiles some of containers are also hidden, like in your case a css is to display the top bar(.td-header-top-menu-full) and the other one to show the menu(.td-header-top-menu-full .td-header-sp-top-menu). In case that you had also the social icons widget active(Thomas case) this container also will be visible(it doesn’t have css to hide it).

@Thomas Please try this custom css, this should display sign in and social icons widgets – http://screencast.com/t/jxljko5scU8T

@media (max-width: 767px){
.td-header-top-menu-full {
display: block !important;
}
.td-header-sp-top-menu {
display: block!important;
}
.menu-top-container {
display: none !important;
}
}

We will consider another implementation, at least for sign in widget.

Thanks!

http://0div.com:30/paper1/wp-content/uploads/2015/07/logo-header.png

Hi,

Please try this custom css in Theme Panel > Custom Css – http://screencast.com/t/GByc71a3EF

.logo-text-container .td-logo-text {
font-family: Tahoma;
}
.logo-text-container .td-tagline-text {
font-family: Tahoma;
}

Thanks!

Hi,

Please try this custom css – http://screencast.com/t/iQ3vrHns

.author-box-wrap .avatar {
border-radius: 100%;
-webkit-box-shadow: -1px 2px 7px 4px rgba(0,0,0,0.75);
-moz-box-shadow: -1px 2px 7px 4px rgba(0,0,0,0.75);
box-shadow: -1px 2px 7px 4px rgba(0,0,0,0.75);
}

Thanks!

Hi,

Unfortunately even if you reduce the title length will not solve this issue, please provide a link and I will try to provide a css fix.

Thanks!

Hi,

@Mr_S Please use this custom css in Theme Panel > Custom Css, I have also customize a little your menu items to not drop down – http://screencast.com/t/U997mXqom

@media (max-width: 767px) {
.td-header-top-menu-full, .td-header-top-menu-full .td-header-sp-top-menu {
display: block !important;
}
.top-header-menu li a {
font-size: 12px !important;
margin-right: 5px;
}
}

@Thomas If you use this custom css the top-bar will be displayed also on mobile devices – http://screencast.com/t/p0m73r0br4 but it was not designed for this device so you will need additional customization or you can try to hide for example the menu – http://screencast.com/t/8EDkS2RE3

@media (max-width: 767px) {
.td-header-top-menu-full{
display: block !important;
}
}

Hope this helps!

Hi,

The simplest way is to modify the post limit on megamenu and display more than 5 articles on 2 rows – http://screencast.com/t/UKNMJSx1JX – http://screencast.com/t/TrFPzTb2Lv
You will need custom work to display the articles 2×3 or 6 side by side. For example if you change the limit value to 6 it will be applied on all megamenu categories(those without subcategories). If this is not a problem for you, you can add a fixed width to the megamenu, using menu item unique class(so you it will not affect the other megamenu categories). You need to use browser inspector tool to take the item class – http://screencast.com/t/kis7We6Wxg1 and use this custom css(use media queries for specific screen size) – http://screencast.com/t/37TjlBsbw

@media (min-width: 1019px ) {
.menu-item-2091 .td-mega-row {
width: 654px;
}
}

This is not an easy task, so if you don’t have basic html/css experience I suggest to hire someone to do this for you as we cannot provide custom work, sorry! I provided above an example how this can be done, but you will need additional customization.

Thanks!

Hi,

Regenerating thumbnails should solve your issue, but if you use smaller featured image than the size of the thumb, please note that WordPress doesn’t enlarge images and you will need to use plugin like Thumbnail Upscale to enlarge thumbnails: https://wordpress.org/plugins/thumbnail-upscale/ For upscale use a combination of plugins Thumbnail Upscale + Force Regenerate.
Please note that there’s no ideal image size, the modules have thumbs with different aspect ratios and a part of the image may get lost on the cropping process(the images are cropped center-top). You can add a new thumb size or modify the crop mode in td_config.php file – http://screencast.com/t/7nlYBLgcfb If you make any modifications here you need to regenerate thumbs You could read more about the featured image size here (it’s from Newsmag documentation but the principles are the same) – https://forum.tagdiv.com/image-size/

Do you refer to the gradient background used on style 1? Please try this custom css to remove it – http://screencast.com/t/IEbPVjxU

.td-grid-style-1 .td-module-thumb a:last-child:before {
opacity: 0 !important;
}

Hope this helps!

Hi,

The theme doesn’t have an option to change the gradient color and you will have to use custom css to change the color for each big grid spot. Please use browser inspector tool – http://screencast.com/t/qtwIwDjws9 You have to target something like this if you want to change this only for grid 8 – http://screencast.com/t/HKB4gtLBpq

.td_block_big_grid_8.td-grid-style-3 .td-big-grid-post-0 .td-module-thumb a:last-child:before {
background: -moz-linear-gradient(45deg, #222 0%, #4a8f5e 100%);
background: -webkit-gradient(left bottom, right top, color-stop(0%, #222), color-stop(100%, #4a8f5e));
background: -webkit-linear-gradient(45deg, #222 0%, #4a8f5e 100%);
background: -o-linear-gradient(45deg, #222 0%, #4a8f5e 100%);
background: -ms-linear-gradient(45deg, #222 0%, #4a8f5e 100%);
background: linear-gradient(45deg, #222 0%, #4a8f5e 100%);
}

This custom css is for first spot(just change to the color that you need), for the other grid spots please change td-big-grid-post-0 to td-big-grid-post-1 and so on… http://screencast.com/t/Y4tCTEbYO

Hope this helps!

Hi,

Unfortunately the top menu was not designed for mobile device and it is hidden,we will try to find a better implementation for log in widget. yYou can use this custom css to display the sign in widget on mobile – http://screencast.com/t/KOuJW9GW

@media (max-width: 767px){
.td-header-top-menu-full {
display: block !important;
}
.td-header-sp-top-menu {
display: block!important;
}
.menu-top-container {
display: none !important;
}
.td-header-sp-top-widget {
display: none !important;
}
}

Thanks!!

Hi,

I guess that you use non-adsense code, please try this custom css, the banner should be displayed at specific size – http://screencast.com/t/lGaqwLynfv

.td-a-rec-id-sidebar img {
width: inherit !important;
margin: 0 auto;
}

Thanks!

Hi,

If you want to remove comment counter only on specific block you can do this via custom css in Theme Panel > Custom Css(just change the block number) – http://screencast.com/t/xR4FapMDV1

.td_block_1 .td-module-comments {
display: none;
}

Also there is a general option to remove comments counter on post, modules, blocks in Theme Panel > Post Settings – http://screencast.com/t/O1uLS1cGl5mC

Thanks!