Search Results for 'css'

Hello,

Unfortunately our theme does not have any such ad spots. You will have to either use plugins that can ofer this feature or create it custom with css positioning.
Here is a related topic: https://forum.tagdiv.com/topic/how-to-place-ad-codes-in-left-and-right-hand-side-gutter-space/

Thank you!

Hello theasder,

If you want to change the title of your category page, you should use a bit of CSS code to do that. Try the code below and place it in Theme panel->Custom CSS area.

.td-category-header .td-page-title {
text-transform: capitalize!important;
}

The result is here -> http://screencast.com/t/cDfZQiGbl

Thanks.

Hello,

Id you want to change the fonts for the big grids, you can do it from the fonts section and the module mx tab. Here is an example: http://screencast.com/t/GWcIqbiGtl

This will affect all big grids though so if you only want to target a specific big grid, and not affect others it can only be done through css customization. For example on your specific big grid 3 on a category page =we would use this css:

.category .td-grid-style-2 .td-big-thumb .entry-title{
font-size: 24px;
}
.category .td-grid-style-2 .td-medium-thumb .entry-title{
font-size: 24px;
}
.category .td-grid-style-2 .td-small-thumb .entry-title{
font-size: 15px;
}

This code will only affect a big grid 3 on a category page. you can get even more specific than this if you want by using the category id so you will only be affecting the big grid 3 on the specific category page you want.

I hope this helps.

Thank you!

Hello fwoedit,

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

The code is ->

.td-header-gradient:before {
background:none;
}

The result -> http://screencast.com/t/FUgYHrEG

Thanks for the message!

Hello,

The footer elements were not aligned center from the theme copde so they have to be aligned through customization as there is no setting added for this. Luckily the code is not all that complicated:
.td-footer-wrapper{
text-align: center!important;
}
Add this code in the theme panel-> custom css box. Now the footer elements are aligned center.
As for the content elements vertical alignment, the theme has no options to make the text align vertically. It will have to be made custom. You can select the rows to be equal height first so you will have the proper layout for an alignement: http://screencast.com/t/XPuOgaUcSW you can also assign some extra classes to your elements so you will be able to target them with css and then use this guide and choose your preferred method to align elements vertically: http://vanseodesign.com/css/vertical-centering/

Thank you!

Hello Chloe,

Unfortunately you still have quite a bit of adjustments to make until you ‘go live’. Please use this guide and make the proper page speed adjustments: https://forum.tagdiv.com/how-to-make-the-site-faster/
The ‘cascading’ css can be seen as this is the way css works by rewriting itself. If the site is adjusted for better loading speeds, this effect will not be so visible anymore.
There are multiple threads on our forum regarding page speed optimization. You can try to do a search through the forum but be advised as it gets very technical. Unfortunately running a website always is.

Thank you!

Hello fwoedit,

You should use a bit of CSS code to do that.

The code is ->

.author .td-page-title{
display:block!important;
}

The result -> http://screencast.com/t/HGCStduX6tLq

Thanks.

Hello Syams,

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

.header-search-wrap .td-icon-search{
color: black;
}

The result is here -> http://screencast.com/t/rPagrLtsgz

Thanks.

Hello Syams,

If you want to make these changes, please notice that you should use a bit of CSS code to do that. Try the code below and place it in Theme panel->Cusotm CSS area and you can adjust the values by your desire.

The code is ->

.td-scandal .td-scandal-big-grid .td-grid-style-2 .td-big-grid-meta {
background-color: transparent!important;
}
.td-scandal .td-scandal-big-grid .td-grid-style-2 .td-big-grid-meta a{
color:white;
}

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

Please notice that you should have installed the Scandal Magazine demo if you want that the above code to work as properly.

Thanks for the message!

Hello Wildwood,

I guess that you want to achieve the similar layout with our Car News demo, right? Please notice that this demo is fully available in Theme panel and if you want you can install it, according to our documentation here -> https://forum.tagdiv.com/newsmag-installing-demos/ -> https://forum.tagdiv.com/import-revolution-sliders-on-demos/ Notice that this is the surest way in this regard….each of demo has own CSS which can be found here -> http://screencast.com/t/61PADe0Gcj9t Also, using your Inspector browser you should inspect our demo and identify what elements are used in that demo. You can check our tutorial in this regard, like this -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks for the message!

Hello,

If you want to reduce the mega-menu space on the about section, you can use this css:

.menu-item-657.td-mega-menu ul{
width:660px!important;
}

The height of the pagination container was added so that the text can position properly if it falls on 2 or 3 rows like this example: v

Thank you!

Hello johanvillegas,

In order to achieve the top bar menu for mobile, you should use a bit of CSS code to do that. Try the code below and place it in Theme panel->Custom CSS area.

The code is ->

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

The result is here -> http://screencast.com/t/2zb92IQf4

Thanks.

Hello,

You can make the logo smaller using this css:

.td-header-style-5 .td-main-menu-logo img{
max-height: 40px;
}

Unfortunately it cannot go any more left as it;s on the far left of the main container. It cannot go outside of these boundaries: http://screencast.com/t/Vppz9FCoVzTf

Thank you!

Hello,

Unfortunately this will not be an easy thing to adjust as thre is no particular code for each of these elements and just as the other method, it will affect lots of other things.l There are many many links on a website.
The correct path to take when you want to change the link colors like so is to style each post content link in particular. This way you can be certain that no other link is affected by the change. You can add an extra class to each link you add on your site and assign a certain color to the class. FOr example add this class on each of your links in html mode like so:
<a href="#" class="customlink">My custom link text</a>
Then you can add this custom css code in the theme panel and wherever you add the class, the css will apply:

.customlink{
color:#b87333!important;
}

The other elements (static content) that cannot be edited in the pmce editor muust be targeted separately with css. I will have to know exactly which one to target. You mentioned categories and tags. What links do you want changed on these pages?
Css needs very precise instructions to work properly.

Thank you!

Please try this css cod ein Theme Panel > Mobile Theme > Custom Css – http://screencast.com/t/5gNOlB7Xq – http://screencast.com/t/PJgPfRCRs2

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

Thanks!

Please try this css code to remove the top padding on homepage in Theme Panel > Custom Css – http://screencast.com/t/K2CAgQrCp

.home .td-main-page-wrap {
padding-top: 0;
}

Hope this helps!

Yes, if you refer only to the css code, you can add your custom css to Theme Panel > Mobile Theme > Custom Css. If you refer to code modifications for the mobile theme files then you cannot overwrite them using the child theme, sorry!

Thanks!

Hi,

Do you use the Mobile Theme plugin? In this case please note that the Mobile Theme comes with it’s own layout and the footer logo and About Us are predefined.
Please provide your site url so we can inspect this and provide you a css to hide them. Or disable the Mobile Theme plugin to have the same content and settings like on desktop.

Thanks!

hello,

Well the mega-menu options needs the list to be populated with content. If you do not have content, the container will not shrink. It’s the same on our end if you we do not have enough items to fill in the container: http://screencast.com/t/zH5ug25C
The right space is for the content that needs to be placed to fill in the gap and the bottom space is the pagination container:
http://screencast.com/t/UQq79Z7hR – http://screencast.com/t/HZot1VgT0
This is the default state of the theme. If you want to alter it you can modify the css and reduce some of the margins and padding but there is no problem here. Just the theme in action and not enough elements to fill in the spaces.

Thank you!