Search Results for 'css'

Results from the Forum
RadioUahid
Participant
#0

Dear Tagdiv team

I would like to knwo which CSS-classes or ids I need to address if I would like to change the colour-settings in the hover-status of the accordion?

Best regards,

Atelier Helsinki
tagDiv Member

Hi Bogdan,

Ok now I have done a fresh install. New plugins and made all my edits to the theme settings. The CSS is loading properly but VC is still having issues.

I have default template set for home and just added new blocks to the page setup. The problem is that the blocks in rows are displating properly. None of the columns are redering properly and just spreads content across full width of row.

Have tried multiple combinations using different template selections but the rows still stretch content. Can’t figure this out. Prior to this I jsut created my page through homepage blank and everything just worked.

Maybe I’m just not understanding the new templates…can you shed any light?

Thanks

Catalin
tagDiv Staff

Hi problogger,

If you want to hide the dates showing below every post, please try the code below and place it in Theme panel->Custom Css area, like this: http://screencast.com/t/pNfBdM4xD

.td-post-title .td-post-date {
display:none;
}

Hope this helps!

Thank you!

Marius
tagDiv Staff
Zone - reply

Hi,
Yes. Edit the header.php file and add this line of code like here: http://screencast.com/t/1nQV0lZzuLqD

echo td_global_blocks::get_instance('td_block_ad_box')->render(array('spot_id' => 'custom_ad_1'));

Then go to Theme Panel -> Ads -> Custom Ad 1 and paste you ad code there. Also probably you need some CSS to adjust the space.

Andrei L.
tagDiv Member

Hi

I’ve checked the link you provided as example and the image seams to be displayed fine now: http://screencast.com/t/qU0wtuMh5 However if you still have this issue you can try this css in theme panel > custom css and the image will be displayed at it’s auto size:

.td-post-featured-image img {
width: auto!important;
}

Hope this help.
Thanks!

Emil G
tagDiv Staff

Hi,

1) You could change the font size using custom css, ex – http://screencast.com/t/ErWmsISX8mHg
You can also use custom css to change the width of the title container, by default is set to 90% – http://screencast.com/t/OrTa0XYEmhttp://screencast.com/t/XnZu4yonft

.td_block_20 .td_module_14 .entry-title a {
font-size: 18px;
line-height: 20px;
}
.td_block_20 .td_module_14 .td-module-meta-info {
width: 100%;
}
.td_module_14 .td-module-meta-holder {
background-color: rgba(255,255,255, 0.9);
}

The css can be added in Theme Panel -> Custom CSS.

2) You mean to place it bellow the image? try this – http://screencast.com/t/ZdBHqpOALwAC

.td-module-image .td-post-category {
position: relative;
display: inline-block;
}

Thank you!

  • This reply was modified 10 years by Emil G.
Bogdan B.
tagDiv Staff

Hello,
Unfortunately commenting out pieces of the child theme style.css will have no effect as the styling will be then pulled from the main theme file. You will need to make this modification to the main theme file.
(Not everything can be modified via the child theme)
Thank you!

Marius
tagDiv Staff

Hi,

You can see all header styles in Theme Panel -> Headers http://screencast.com/t/CtzC4mO9d to find something that fits you need.

Hover color for individual items from menu can be customized only via CSS.(please provide your site URL to inspect it and give you an example)

Mega menu allow you to get posts from a category(not entire site). If you want to have the latest from blog, just create a category BLOG and add all your post there. Then use that category in a mega menu.

To add icons in menu, read here: https://forum.tagdiv.com/how-to-add-icons-in-menu/

For custom image profile use this plugin: Wp User avatar

Thanks for the message!

omar ahmed
Participant
#0

i have 2 problem in post page

first in this image in browser mobile 768 – 1024

pleae veiw this link

null

i add custom code css in backend but problem not solve

second problem in this image

null

i want make design second block same first block

i put arrow in image

i add cutome code but can’t make same design in background title !!

gagosg
tagDiv Member

Hi, i have fixed logo by changing CSS code

I only want to make Header style 10 look like style 01 in mobile view.

Can you help me ?

This is Header Style 10 in mobile view:

I want it look like Style 01

  • This reply was modified 10 years by gagosg.
  • This reply was modified 10 years by gagosg.
Emil G
tagDiv Staff

Hi,

I’ve checked this on my side and there’s plenty of space between these two blocks – http://screencast.com/t/8t4i9yvYv
Check if you have any custom css added in Theme Panel -> Custom CSS, or directly into the style.css file, see if this css affects this area.
If you can’t find anything please provide your url so i can take a look, if you don’t want to post it here send it via email at contact@tagdiv.com

Thank you!

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

Hi problogger,

Please try the code below and place it in Theme panel->Custom Css area, like this: http://screencast.com/t/6Ee4TKLkP

.td_mod_related_posts .td-module-image {
display: none;
}

The result you should see here: http://screencast.com/t/Px0LygM41

Thank you!

Catalin
tagDiv Staff

Hi andantesash,

If you want to increase the footer height, you have to increase the padding-top of the footer-wrapper. Please try the code below and place it in Theme panel->Custom Css area like this: http://screencast.com/t/nHmfznvS

.td-footer-wrapper {
padding-top: 90px;
}

Notice: You can adjust the padding-top value as you wish until achieve what you want!

The result you should see here: http://screencast.com/t/8yLcfAlxC7cH

For more information about footer style, please consult our documentation here: https://forum.tagdiv.com/footer-templates/

If is not what you mean, please provide more details!

Hope this helps!

Thank you!

zuzu
tagDiv Member

These are not the gallery. article. You get images with css square. I would like to get automatically disconnected.

Catalin
tagDiv Staff

Hi mboydnv,

If you want to change the icons font size, it is necessary to increase the font-size parameter. Please try the code below and solve the problem. Place it in Theme panel->Custom Css area:

.td-footer-wrapper .td-icon-facebook {
background-color: #3b5998;
border-radius:20px;
font-size: 23px;
}
.td-footer-wrapper .td-icon-flickr {
background-color: #ff0084;
border-radius:20px;
font-size: 23px;
}
.td-footer-wrapper .td-icon-googleplus {
background-color: #dd4b39;
border-radius:20px;
font-size: 23px;
}
.td-footer-wrapper .td-icon-instagram {
background-color: #517fa4;
border-radius:20px;
font-size: 23px;
}
.td-footer-wrapper .td-icon-pinterest {
background-color: #cb2027;
border-radius:20px;
font-size: 23px;
}
.td-footer-wrapper .td-icon-twitter {
background-color: #00aced;
border-radius:20px;
font-size: 23px;
}
.td-footer-wrapper .td-icon-youtube {
background-color: #bb0000;
border-radius:20px;
font-size: 23px;
}
.td-social-icon-wrap i.td-icon-facebook:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-flickr:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-googleplus:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-instagram:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-pinterest:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-twitter:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-youtube:hover {
opacity: .5;
color:white;
}

The result you should see here: http://screencast.com/t/X9hluJutBhmI

Hope this helps and let us know how it goes!

Thank you!

Marius
tagDiv Staff

Hi,

1. The first top ad came from the Header ad from Theme panel -> Ads: http://screencast.com/t/FrYnEKeH2I and the second one is added in page, after the Big grid with an Ad box in your case in that ad box you call the Header ad.

The header ad default is used and appear automatic only in header. If you use an Ad box in your pages you should use a custom ad instead of header ad to be aligned. http://screencast.com/t/KtjaaEGi then go to Theme panel -> Ads and add you ad code in Custom ad 1.

Also to better align the top ad, add this CSS in Theme Panel -> Custom Code -> Custom CSS section
body .td-header-style-5 .td-g-rec-id-header > .adsbygoogle {
margin-bottom: 24px !important;
}
.td-main-content-wrap .td-g-rec-id-header {
text-align: center;
}
.td-main-content-wrap .td-g-rec-id-header .adsbygoogle {
margin-bottom: 22px;
}

2. If you mean the background color behind the big grid use this CSS and change the color like you want
.import_video_slider_bg {
background-color: #1C2451;
}

Thanks for the message!

Emil G
tagDiv Staff

Hi,

The menu should appear on all pages, if you didn’t set one that message will appear on each page.
You can disable it by commenting the following line – http://screencast.com/t/BataSrR7fI4W
If you want to disable it for one page only you have to add a condition, ex. – http://screencast.com/t/98xxVBwNrv
For more details on conditions please check this – https://codex.wordpress.org/Conditional_Tags

You can also hide it with custom css(add it in Theme Panel -> Custom CSS):

.td-header-menu-wrap-full {
display: none;
}

Thank you!

  • This reply was modified 10 years by Emil G.
Bogdan B.
tagDiv Staff

Hello,

@computernet
: replied via envato dashboard.
For other users interested in applying this customization:

For block 3 you have to alter and make these changes in theme’s module 1 and add this code: http://pastebin.com/uqu26CCs like this: http://screencast.com/t/YN03oqYghq37

This is the result you should get: http://screencast.com/t/F7CwOQkIZVq1

Use custom css to adjust it and arrange it as you would want it like I also suggested it in the forum topic, here is an example: http://screencast.com/t/7O3cBdwe and the css I’ve used is below. You can work on it.

.td_module_1 .td-social-sharing-buttons {
display: block;
margin: 0px;
margin-top: 10px;
margin-bottom: 10px;
}

For twitter use this code: http://pastebin.com/05zGW3JR in the same way and the css code from below: http://screencast.com/t/TbhT1urW7

.td_module_1 .td-social-sharing-buttons {
width: 50%;
margin: 0px;
float: left;
}

Thank you!

Catalin
tagDiv Staff

Hi StockFanatic,

Yes, it is correct. Our theme has been designed to show only in mobile version the Whatapps sharing. If you want to show it on full devices, please try the code below and place it in Theme panel->Custom Css area, like this:
http://screencast.com/t/JyijjAGJEvY

.td-social-whatsapp {
display: inline-block!important;
}

The result you should see here: http://screencast.com/t/nmEYxpIQJPmv .

Hope this helps!

Thank you!

omar ahmed
tagDiv Member

i solved this problem and define this font manully in css file and all font work fine

thanks

Marius
tagDiv Staff
Zone - reply

Hi,
I’m not sure what you mean, can you give me more details, or show me in a screenshot? Do you want a space above the top menu?

You can use this css to add a space, add it in Theme Panel -> Custom Code -> Custom CSS section

.td-header-top-menu-full {
margin-top: 50px;
}

Thanks for the message!

Hadeer
Participant
#0

Hello,

Please, I need to find out the way to edit the source code to change CSS attribute from left to right or the way to find the responsible JS file.


<div data-vc-full-width="true" data-vc-full-width-init="true" class="vc_row wpb_row td-pb-row import_dont_miss" style="position: relative; left: -73.5px; box-sizing: border-box; width: 1263px; padding-left: 73.5px; padding-right: 73.5px;">

http://demo.tagdiv.com/newspaper_video/

mboydnv
tagDiv Member

Thank you the following css looks good, would you know the best way to increase the icons (font) size within the circle? Thank you so much.

.td-footer-wrapper .td-icon-facebook {
background-color: #3b5998;
border-radius:20px;
}
.td-footer-wrapper .td-icon-flickr {
background-color: #ff0084;
border-radius:20px;
}
.td-footer-wrapper .td-icon-googleplus {
background-color: #dd4b39;
border-radius:20px;
}
.td-footer-wrapper .td-icon-instagram {
background-color: #517fa4;
border-radius:20px;
}
.td-footer-wrapper .td-icon-pinterest {
background-color: #cb2027;
border-radius:20px;
}
.td-footer-wrapper .td-icon-twitter {
background-color: #00aced;
border-radius:20px;
}
.td-footer-wrapper .td-icon-youtube {
background-color: #bb0000;
border-radius:20px;
}
.td-social-icon-wrap i.td-icon-facebook:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-flickr:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-googleplus:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-instagram:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-pinterest:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-twitter:hover {
opacity: .5;
color:white;
}
.td-social-icon-wrap i.td-icon-youtube:hover {
opacity: .5;
color:white;
}

DShafi
Participant
#0

Hello Team,

This is probably a very simple fix but I cannot find the right solution.

I would like to align my mobile logo to the left rather than in the centre.
Any CSS tricks I can pop in the Custom box?

Thanks.

Atelier Helsinki
tagDiv Member

Ok…I’ve done exactly the process I’m supposed to from 4.x to 6.0…and have also auto updated the site now to 6.6.

But the site is still having serious issues. The css is not loading properly I think and the Visual Composer doesn’t load any of your templates.

I really need this fixed up so I can present to the client soon.

Let me know what you need and can supply access to the site so you can see what I mean.

Just to add…this is now a clean install and was prepared to rebuild the site using any new updates the import script had carried out. So can’t understand why it won’t even display your demo content properly.

Thanks and look forward to a resolve within the next couple of days.

Thanks

Viewing 25 results - 25,601 through 25,625 (of 33,436 total)