- NewspaperCreate Custom Code with the browser’s Inspector or the Live CSS Box
- NewspaperScroll Animation
- NewspaperWP Rocket and Newspaper Theme: Optimization Guide
- NewspaperHow to setup Twitch for Social Counter
- NewspaperModal Popup
- NewspaperFlex Block Settings Guide
- NewspaperAutoptimize Plugin – install and configuration
- NewspaperAdding Multiple Authors to Your Articles
- NewspaperDesign your Post Pages using the Cloud Library Templates
- NewspaperBig Grid Flex Settings
- NewspapertagDiv Composer Tutorial
- NewspaperTheme modules and blocks
- NewspaperThe Mobile Theme
- NewspaperCompare theme files – Winmerge tutorial
- NewspaperUsing Other Ads
- NewspaperBlock settings tutorial
- Using custom fonts
- Using typekit fonts
- NewspaperChild Theme Support
- NewspaperHow to Make the Site Faster
Hello
The link is frugalhn.com/america
I will like to recreate this on the main menu –>http://www.screencast.com/t/gUSzWRGe
I was able to modify it now through the css. I need to modify the style on <div class=”td-header-menu-wrap-full”style height:60px;”> I tried it on my browser and works for me around 49px, but i need to add the black line on the buttom so “CENTROAMERICA” is readable on top of the black line.
Also, please tell me how to insert it on the html.
http://www.screencast.com/t/nR7OJejjiA
Hi
I am not sure at what menu you’re referring so please provide more detail about this, also a screen pointing to it would help.
We don’t have a separate css file only for woocommerce, the code which generate the style for the plugin is loaded from main css file.
Thanks!
Hi,
You did not provided your site url so we can inspect this. Also you could change the header template if you have many menu items and you can reduce the font size for your items.
The modifications for stylesheet file should work, also if you paste the code in Theme Panel > Custom Css. Please clear all your caches, maybe it is a caching issue.
Thanks!
Hi
Try this css in theme panel > custom code > custom css: http://screencast.com/t/KrHceQvjEV
.td_block_wrap .td-next-prev-wrap{
display: table;
margin-left: auto;
margin-right: auto;
}
.td-next-prev-wrap a{
color: #000;
}
Let me know how it goes.
Thanks!
Hi,
Newspaper has an fixed grid layout, responsive as it is fluid and styled for desktop/tables/mobile screens. The theme full width is 1068px(content) and it is not an easy task to change it because all the theme elements were designed for this width and you will need to redesign them.
However if you want to change the width for post pages you could try to use media queries for it – https://css-tricks.com/snippets/css/media-queries-for-standard-devices/ an example for default post style – http://screencast.com/t/YGMzwr8qC4
Thanks!
Also i tried making some modifications on the style.css and no changes reflect on the frontend. Should I add them on the theme panel for it to work?
Hi
Css code from style.css file can be overwritten with custom css in theme panel > custom code > custom css. For example you can remove that white background using this code: http://screencast.com/t/QIluxXliUp
.td-banner-wrap-full, .td-header-menu-wrap-full {
background: transparent;
}
Hope this helps.
Thanks!
Is there a seperate css style sheet for woocommerce with Newsmag?
When someone is signed into their account (/my-account/) to look at orders, account details ect, the menu that displays on the left hand side of the screen has no styling as does much accounts area for them. I realise that woocommerce is a third party plugin but as the site supports it, it would be nice that the stylesheet reflected this.
Hi,
If you use style.css in your child theme, then you have to replace it on every update as it;s a file that will be changed every time. Css does not have to be added in the child theme at all. You can use the theme panel for css customization: http://screencast.com/t/0zoq3rtLS
Please update your files form the child theme as it is not an update proof method of customization (there is no such thing)
Thank you!
Pentru a schimba fontul in altul va trebui ca acesta sa fie incarcat cu css in prealabil. Aceasta se poate face cu font-face ca si in acest exemplu: https://forum.tagdiv.com/topic/icon-library/
dupa ce se incarca fontul cu css se poate adauga in codul css de mai sus si o properietate de font-family: http://www.w3schools.com/cssref/pr_font_font-family.asp
Hello friends,
I would like to increase the width of my blog to 1170px, which is the width that has this page for example:http://one.elpais.com/wonder-quest-la-serie-minecraft-youtube-educa-los-ninos-primaria/
Some CSS code to modify please ?. Thank you
Hi,
If you want to replicate that css style from our cars demo, you can simply access this file and see every css change made specifically for the demo: http://screencast.com/t/0cFA6nuK
(why not install the demo directly?)
I hope this helps.
Thank you!
Hi,
I have just upgraded to the 7.2 version. When it came to checking my website was all okay. I found that for some reason the Child Theme CSS was not working (despite being served) on my iPad in Portrait view.
Here is a screenshot from the iPad
http://pasteboard.co/8zDzkqPA2.png
And then here is a screenshot of the same media query on Firefox responsive design view.
http://pasteboard.co/8zEn1GXnz.png
Has something changed in the new style.css that would be effecting my website on iPad portrait?
Thank you
Salutare. As vrea sa reveniti cu un update la subiectul deschis. As vrea daca se poate sa scri in subtitlu ca in aceasta imagine http://infoalert.ro/wp-content/uploads/2016/07/subtitlu.jpg, fara a mai fi nevoit sa adaug, in editor textul pe care vreau sa-l scriu, folosind codul html.
Ce cod css as putea sa adaug in costom css box pentru a scrie textul din subtitlu, la fel ca in imagine.
Pe langa acst cod (.td-post-sub-title{
background-color:black!important;
color:white!important;
}) cum pot schimba fontul, dimensiunea scrisului, iar acesta sa fie BOLD
Multumesc
If I manage to disable the background-color in style.css – it looks exactly like I want it to look like.
(line 1405 regarding to my debug console)
.td-banner-wrap-full, .td-header-menu-wrap-full {
background-color: #fff;
}
I can do simple CSS, and know a bit about !important, but honestly I have no idea how to hide a css attribute via the custom code (without deleting it from the main css).
Maybe we have a CSS Expert here that can help?
-
This reply was modified 10 years by
Edward.
Hi
I’ve checked your site and noticed that you’re using child theme. Try to deactivate it, clear all caches then test again. The issue is caused because the order in which the css resources are loaded on the page was changed a bit.
Let us know how it goes.
Thanks!
Hi
Do you want to remove the borders bellow block’s title? If so use this css in theme panel > custom code > custom css:
.block-title{
border-bottom: 0;
}
Also if you want to remove ALL tagd edit each block and deleted the word from here: http://screencast.com/t/X5VVAfg1RF7
Let us know how it goes.
Thanks!
Hi,
The menu will fall to a second row if you add too many elements to it. There cannot be infinite elements added to the same line unfortunately. It has it’s limits. Unfortunately there is little that can be done about this except remove some of the items if you want to have it on the same row. you can also reduce some of the padding of the menu items so one more element can fit if you have the proper css knowledge.
As for your second request, our theme has no such spot to add content below the menu. You can do it custom if you know your way around html and css by adding it in the files here: http://screencast.com/t/3BUFU7FOiWL
Then you can use css to style the div element.
Thank you!
Hi,
The responsive css was there all along 🙂 not part of the update. The header styles were created based on the default 728×90 ads. You can use this custom css to change the width of the container to one that will suit your needs:
.td-header-style-1 .td-header-sp-recs{
width: 620px!important;
}
I set it to 620 px but you can change this value to whatever you wish.
http://screencast.com/t/AatIN2SeXoet
Thank you!
Hi,
Unfortunately our theme has no such option, but I will add it to our list of suggestions and hopefully in a future version we will be able to provide such a feature.
The viewport detection is added in css with the @media rule. This can be seen in style.css
Thank you!
Hi,
Unfortunately we cannot help any further beyond the guide we provided. Page speed is a very personal thing that is affected starting from the host that you use, all the way down to the content of the site. Speedbooster will move all the render blocking js and css to the footer but only if you edit the code and add the other render blocks in it;s code as the guide suggests. Also speedbooster has a compatibility function that is mentioned in the topic I suggested above. If you do not remove the function, speedbooster will deactivate itself when an incompatible plugin is found.
If you require further improvement that the guide cannot provide, we suggest getting some hired help as this is a very personal thing and there is no general rule that can apply to all sites and we cannot provide any custom work at the moment.
Thank you!
Hi
Note that the Speed Booster plugin disable itself when an incompatible plugin it’s installed. We added this measure to avoid conflicts with the plugins that won’t allow to move their CSS/js resources at page bottom. To keep it always activated comment or delete the indicated lines from td-speed-booster.php: http://screencast.com/t/RZLIOPUNdqh You can check this topic for more information about speed booster usage: https://forum.tagdiv.com/topic/speed-booster-questions/
Hope this help.
Thanks!
Hi,
I replaced the code you highlighted ($td_css_cls_pb_padding_side = ‘td-pb-padding-side’;) to the code above:
<div id=”fb-root”></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = “//connect.facebook.net/pt_BR/sdk.js#xfbml=1&version=v2.6&appId=2032486450310354″;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>
Nothing changed! After that I came back with the highlighted code and replaced it with this one:
<div class=”fb-comments” data-href=”https://portalmaesefilhos.com.br/” data-width=”600″ data-numposts=”5″></div>
Nothing changed again! After that I tried with both codes got from facebook developer, but it didn´t work as well.
Should it work or I did it tottaly wrong?
Thanks again!
Actually, I only need this kind of code for the Desktop site, as I’m fine for the tablets (which is only 6-10% of my audience) and fot the mobile, I’m gonna use the mobile theme.
So, I guess if you help me with some code, I’ll use it in the Desktop section of responsive CSS which I only saw it today (was it part of the update?).
Bogdan,
Thanks for pointing out those suggestions.
Earlier today we did the following and got these results:
* Tried the wp bootser and it didn’t help. I disabled it.
* I added the code in the .htaccess file, it helped a bit.
* We have WP Super cache enabled and configured.
The website is still running slow. Would you suggest fixing leverage browser cache, enable compression, eliminate render-blocking JS and CSS? It would see the images (which we have compressed) are causing slow load times for only the main page.
Any help would be greatly appreciated!