- 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
Hi,
For the icons, please remove any custom css you might have in place as the header css has been changed a bit and a h1 tag was added to the logo for seo purposes.
As for the social counter, you have not updated it. Please make sure you update your plugin by removing you currently installed one (disable and delete files) and install the new version from here: http://screencast.com/t/SZshTPHj
Thank you!
Hey!
I didnt have custom css for logo size, only to align further to the left.
How can I make the logo not scale on the desktop site? I have limited knowledge of CSS so example would be much appreciated.
Hello amorpeth,
I suppose that you have some additional customizations and the logo was increased with a bit of CSS, right? So, with the new update, the logo has been changed because it was introduced the H1 tag the class was changed to another one and that’s why your old CSS is not applied in the latest update, as you can see here -> http://screencast.com/t/103uqsss43 You will have to adjust your custom CSS in order to achieve as you wish.
Thanks for your understanding!
Hi All,
I have few long post and have inserted a page break between different points within them. Currently the navigation are appearing to be numbered with less visibility. I am looking to change this to a button clearly visible.
Any leads on the code change or plugin that might do this trick is highly appreciated. This is what I was trying – using the code below I was able to come with this (copy and paste to see what this would look like here Remove the apostrophe before the links. Would you be able to help me out as to where this code should go in the theme –
<!DOCTYPE html>
<html>
<head>
<style>
ul.pagination {
display: inline-block;
padding: 0;
margin: 0;
}
ul.pagination li {display: inline;}
ul.pagination li a {
color: white;
float: left;
padding: 16px 40px;
font-size: 35px;
text-decoration: none;
background-color: #000;
border-radius: 0px;
}
ul.pagination li a.active {
background-color: #DF0101;
color: white;
border-radius: 0px;
}
ul.pagination li a:hover:not(.active) {background-color: #fff;
color: black;}
</style>
</head>
<body>
<ul class="pagination">
<li><a href="#">«</a></li
</li>
<li><a href="#">1</a></li
</li>
<li><a href="#">2</a></li
</li>
<li><a href="#">3</a></li
</li>
<li><a href="#">4</a></li
</li>
<li><a href="#">5</a></li
</li>
<li><a href="#">6</a></li
</li>
<li><a href="#">7</a></li
</li>
<li><a href="#">»</a></li
</body>
</html>1. For the pagination to be available
On all the pages
Only on the homepage
Only on the post/article page
For all the other pages
2. Include a text “Pages” within the pagination block itself not linked to anything.
My theme supports custom theme so where should these be targeted. Help or links to the required details is much appreciated.
Current Navigation Setup – Financial Talkies
Expected Navigation Setup – Tricky Photoshop
Thanks,
Somil
Hello
If you want to change the background-color for your menu items when you are hovering over these, you will have to use a bit of CSS code and place it in Theme panel->Cusotm CSS area.
The code is ->
.sf-menu ul .td-menu-item > a:hover, .sf-menu ul .sfHover > a, .sf-menu ul .current-menu-ancestor > a, .sf-menu ul .current-category-ancestor > a, .sf-menu ul .current-menu-item > a, .sf-menu > .current-menu-item > a:after, .sf-menu > .current-menu-ancestor > a:after, .sf-menu > .current-category-ancestor > a:after, .sf-menu > li:hover > a:after, .sf-menu > .sfHover > a:after, .td_block_mega_menu .td-next-prev-wrap a:hover, .td-mega-span .td-post-category:hover, .td-header-wrap .black-menu .sf-menu > li > a:hover, .td-header-wrap .black-menu .sf-menu > .current-menu-ancestor > a, .td-header-wrap .black-menu .sf-menu > .sfHover > a, .header-search-wrap .td-drop-down-search:after, .header-search-wrap .td-drop-down-search .btn:hover, .td-header-wrap .black-menu .sf-menu > .current-menu-item > a, .td-header-wrap .black-menu .sf-menu > .current-menu-ancestor > a, .td-header-wrap .black-menu .sf-menu > .current-category-ancestor > a {
background-color: blue!important;
}
The result -> http://screencast.com/t/QtaALwAm
If you refer to something else, please provide more details.
Thanks for the message!
I am getting some CSS issues on the practice of infinite scroll on the single post which described here https://forum.tagdiv.com/topic/implement-infinite-scroll-on-single-posts/#post-43481 .
I tried the same here on my site: http://marwadisong.in . Find any single post and see, I have implemented the same thing two places and both have display issues.
http://marwadisong.in/new-video-lagyo-4g-tower-chale-che-internet-alfa/
Let me know what I need to do.
Thank you.
Hello mrthemeforest,
If you want to remove that strings ‘About Us’ please notice that you will have to use a bit of CSS code because our theme does not have such an option in Theme panel to do that. Please try the code below and place it in Theme panel->Custom CSS area.
.footer-text-wrap .block-title {
display:none;
}
If you refer to something else, please provide more details.
Thanks for your understanding!
Hi
That delay appears because when the page it’s loaded first time is requested the style from style.css file then the one from theme panel. A possible solution to avoid that delay would be to insert all css generated by the theme in style.css. To do that you’ll have to locate the custom css in page’s source, copy it and paste it in style.css. However in your case this won’t be an easy task because page’s source is minified and it’s hard to find that code. Currently you have this code generated in theme panel: http://pastebin.com/VnAmUDPH so try to paste in style.css file then test again. If you will make some changes in theme’s options you will have to update the code.
Thanks!
Hello doublemd12,
If you want to add some spaces above your website, you will have to use a bit of CSS code to do this. Please try the code below and place it in Theme panel->Custom CSS area.
The code is ->
@media (min-width: 1180px){
#td-outer-wrap {
margin-top: 40px!important;
}
}
The result -> http://screencast.com/t/g6Iy9MFEAtD
Thanks.
Hi,
you can translate the word HOME from the translation settings: http://screencast.com/t/A5hlphFS3oCB but you cannot remove it unfortunately (you can translate it to an empty space though)
You can also hide it with css if you want:
.home .entry-crumb{
display:none!important;
}
Thank you!
Hi
Yes it is possible to remove the date only from homepage, To do that replace the previous css with this one:
.home .td_block_4 .td-post-date, .home .td_block_4 .td-post-author-name span{
display: none;
}
To remove the date from slider use this css:
.home .td-theme-slider .td-post-date, .home .slide-meta-author .td-post-author-name span{
display: none;
}
The code it’s made for homepage but is you want to use it for all site just remove .home class.
Thanks!
Hi
Try this css ion theme panel > custom code > custom css: http://screencast.com/t/BhEC0iolM
.td_block_11 .td_module_10 .td-excerpt {
border-top: 1px solid #ff823a;
}
Thanks!
Blockquotes are a styled element so you just need to add some custom CSS to your Custom Code in the theme panel. Probably easiest to use inspector in your browser to copy the styles of the quote style you like, and then modify those styles for the classes of the default blockquote. It’s a bit of custom work but it’s not bad if you’re not new to CSS.
As Js composer team have integrated font-awesome-CSS, user don’t need to install Font Awesome 4 Menus plugin. Installing this plugin adds unnecessary one more CSS to you your code along with one external CSS in performance result.
When I conducted a google pagespeed test, I got the below result. Help me fix this.
Eliminate render-blocking JavaScript and CSS in above-the-fold content
Your page has 2 blocking script resources and 7 blocking CSS resources. This causes a delay in rendering your page.
None of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.
Remove render-blocking JavaScript:
http://principiaboxed.com/…s,qver=1.12.3.pagespeed.jm.Mce7qJ7uQ5.js
http://principiaboxed.com/…js,qver=1.4.0.pagespeed.jm.S4TTOO46U-.js
Optimize CSS Delivery of the following:
http://principiaboxed.com/…s,qver=4.6.1.pagespeed.cf.B7_8y6haOq.css
http://fonts.googleapis.com/…%2C600italic%2C400%2C600%2C700&ver=4.5.2
http://fonts.googleapis.com/…%2C900%2C500italic%2C400%2C300&ver=4.5.2
http://fonts.googleapis.com/…0%2C700%7CAmarante%3A400%2C700&ver=4.5.2
http://principiaboxed.com/…,qver=4.11.2.pagespeed.cf.DDuiy5Iwfj.css
http://principiaboxed.com/…css,qver=7.0.pagespeed.cf.OXJRwv_GHJ.css
http://principiaboxed.com/…css,qver=7.0.pagespeed.cf.4wPCTK4rGZ.css
Hi
I’ve removed your credential as this is a public forum and any member can see them.
I am not really sure what layout you’re trying to achieve for menu so please provide more detail about this, also a screen pointing the desired result would help.
Use this css in theme panel > custom code > custom css to make a white background for excerpts:
.home .td-excerpt {
background-color: white;
}
To hide whatsapp button use this code:
.td-social-whatsapp{
display: none!important;
}
Thanks!
Hi
Try this css as example:
.menu-item-abc a {
color: #AD2929 !important;
}
.menu-item-abc a:hover {
color: green!important;
}
You will have to replace the abc with the numerical id of menu item.
Thanks!
Hi,
There is no option to have a different color for each menu item, but you could do this using custom css, here you can find an example how to target them – https://forum.tagdiv.com/topic/different-colours-for-menu-buttons/ You will need some basic css skills as the theme doesn’t have an option to change the color/hover color for each menu item.
Regarding the home icon please check this guide to add it – https://forum.tagdiv.com/how-to-add-icons-in-menu/ I have tested this and did not found any issues.
Thanks!
Hi
Leverage browser cache won’t comperes images, it only comperes resources like css/js/html. To optimize the images follow the above guide and also you could try a lower compression for them. You could also check these tutorials to optimize the images: https://premium.wpmudev.org/blog/fix-jpeg-compression/ – http://www.wpbeginner.com/beginners-guide/speed-wordpress-save-images-optimized-web/
Thanks!
Hi
The theme is written according with WordPress standards and it’s optimized for best performances. However there are many factors which can influence site’s load time. In terms of page-speed we made a guide which covers most important aspects google notifies you about, you can find it here: https://forum.tagdiv.com/how-to-make-the-site-faster/
I’ve checked your site with google page-speed and from its reports i’ve noticed that there are a few images which slow the load time. Try to optimize the images following google’s docs: https://developers.google.com/speed/docs/insights/OptimizeImages Also you can use leverage browser cache to reduce the size of the css/js resources served by the server: https://gtmetrix.com/leverage-browser-caching.html
To move render-blocking resources in page’s footer you can use Speed Booster plugin. We covered in our documentation at point 5 how this plugin can be used.
Other useful information about page speed can be found in these topics: https://forum.tagdiv.com/topic/help-moving-style-css-and-fonts-googleapis-com-to-footer/ – https://forum.tagdiv.com/topic/speed-booster-questions/ – https://forum.tagdiv.com/topic/mobile-view-problem-3/
Hope this helps.
Thanks!
Hi
Do you want to load a different logo depending by site’s language? If so that can’t be don using the current theme’s implementation because the logo from theme panel will be displayed on the site even if chose a different language. The container which keeps the logo is td-header-sp-logo and logo’s css class is: td-main-logo http://screencast.com/t/V81IcWoRuZ
If this is not what you mean please provide more detail about what you re trying to do and we will get back to you Tuesday.
Thanks!
I just bought and tried to install the Newspaper Theme but kept getting an error message as follows…
“The package could not be installed. The theme is missing the style.css stylesheet.”
Hi,
The image that cannot be foundis the mobile menu background that is also used on the search for mobile: http://screencast.com/t/Jug2oVdTPEk
Please change this image in the theme panel.
As for the bbprtess and woocommerce css these inluine styles were added as there are thme elements such as colors or hover effects that were designed to also affect woocommerce and bbpress. The theme general style will be applied to these plugins as well so the code for them was added inline to the theme code. There is no easy way to remove these parts of the code unfortunately.
I hope this helps.
Thank you!
Salut, fiindca vad ca se cunoaste romana, cel asa cred eu 🙂
Suntem din R.M. , si tocmai am cumparat si noi template-ul, e foarte reusit, am avea nevoie de ceva suport daca se poate.
1. Vrem sa adaugam sus in header inca o iconita social media (www.ok.ru) si nustiu dc nu mi vede din radacina temei cand modific.
2. Vrem sa adaugam sursa postului pe imagine :
Cunoastem un pic de php, mai mult html si css, puteti sa de indrumati putin ?
Va multumesc!
After checking my site with GTMetrics, I found in the Waterfall section that the theme tries to load a JPG that doesn’t exist. I based my site on the Recipes demo, and after completing my site I deleted all JPG’s in the library that are not used anymore. Somehow the theme tries to load a demo JPG through this style:
.td-search-background {background-image: url('http://MYDOMAIN/wp-content/uploads/2016/05/8.jpg');
I don’t know where I can remove that style. I don’t even use an element with class td-search-background as far as I know. I want to remove the call for that JPG because it takes about 600ms for the theme to try and find it. It slows down my site.
Please let me know what to do.
BTW It would be nice to be able to remove any non-used, left-over demo styles after creating a site using a demo? Why is there a whole bunch of non-used CSS loaded? The same goes for unused plugins like bbpress and woocommerce.
