- 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
I tried to do this and don’t work.
All that inside in class style don’t server to webP. The images in src for example are server fine.
I don’t know how to solve this.
For example this class: entry-thumb td-thumb-css tdi_34 have style=background-image and url to png and don’t change to webp….
I hope you can help me…
Best regards,
Sergio
I have encountered this from time to time and wonder how best to solve it. When moving or arranging an element I sometimes found the element loses all focus and ability to edit. I was working with the Header Live Search and now I can’t select it, I can see it, but no matter where I click on can’t get access, it will not give focus. I added an extra one just to see if the would “reset” something and I can edit it, but the original is still sitting there and I don’t really see it in Inspector either. Maybe there is a CSS trick to make it editable in Composer again?
Screenshot of the elements: https://snipboard.io/kdZF75.jpg
The black one is original and can’t select, blue one was added and can edit and select?
When you click on the black search it just shows Row as element nothing else?
Hello,
If you can import a section -> https://i.imgur.com/qBp92J7.png the section will be set at the bottom page content, but you can move it where you want, select the row => https://i.imgur.com/HaWdX8R.png
Also, in that section is create a custom code CSS to design it like this, you can find the code in row CSS-> https://i.imgur.com/64f8nrC.png -> https://i.imgur.com/KjxPg4x.png Also, if you want to change the position for the description you can change the code CSS this Property to flex-direction: row-reverse; -> https://i.imgur.com/yDJ2iUF.png
Thank you!
Hello,
Please provide the link to your website.
Also, please try this custom code css
.td-menu-login-section a
{
color:red!important;
}
Thank you!
Hello,
To change the color you need to use a custom code CSS -> https://i.imgur.com/shMU9Qo.png
.td-main-menu-logo .td-logo-text
{
color: black;
}
.td-main-menu-logo .td-tagline-text {
color: green;
}
The code needs to be set in Theme Panel> Mobile Theme > Custom code> CSS.
Thank you!
Hello mgiannelis,
The theme already has the function to see and test certain elements per view port -> https://i.imgur.com/oVx7OZj.png The Single Post Featured Image element can also be used, then the image will generally be displayed at its width, and the height will be adjusted automatically. if you do not want this, then you need to select a thumb with a fixed width and height -> https://i.imgur.com/vLBLdvX.png
When Single Post Bg Featured Image is used then the height of the element can be set and the image can be set as a background image with css so that it fits in the height and width of the element (that’s why it appears cropped).
What is recommended if you want all images to appear the same everywhere on your website is to use images that are the same size.
Thank you for your understanding!
Hi,
For the classic editor plugin, the sidebar can be removed only from them files, for this you need to go in -> wp-content/themes/Newsmag/editor-style.css and comment these lines of css -> https://i.imgur.com/MIuDveD.png
If you are using the Gutenberg editor, then there will be no sidebar in editor, this will look like this -> https://i.imgur.com/F6PUBhU.png
I hope this will help you!
Hello.
Once again I come with this because solutions are not working.
I have discovered and a dev has looked and also confirmed. It is impossible to centre my content on single post template I am using while keeping the content area the same width and the sidebars equal width. It cannot be done with my current single posy template.
This is very frustrating limitation causing me to now almost change whole theme because this issue that cannot be solved in the way I need (and it should be easy) cannot be done. The actual theme and builder and will simply not allow or cater for this simple change.
Also by trying to use css margins it wont move it with anything I try. CSS option are not good for this simple thing I am trying to. They don’t achieve it
100% impossible to simply centre this content under the header correctly while keeping its current width and then adjusting sidebars to match. You cannot do it unless you have to make the content area thinner which I don’t want to do
And then by trying to just move things around, it maxes out server resources. And I have a very good and expensive Google Cloud server data centre server hosting.
Then I try to email support back that helped with this but made width so small. Not hear back from them for 3 days now.
I am not happy at all
Good sunday to everyone!
I just saw that the images in my frontpage are showing in jpg/png instead in webp. Why? I don’t know.
I saw in the inspector on Google Chrome that the style backgroud-image call to url with file jpg/png.
The class is entry-thung td-thumb-css tdi_34.
If you would like to see more about the frontpage, you can see http://www.redesbinarias.com
In each page post appears well in format webp.
Best regards,
Sergio
Hi,
I tried TagDiv’s block 14,15 and 16 on my homepage ( https://best11.co.uk/ ), and they all are loading only 10 posts per load (although it’s set on infinite load), and so it’s leaving 2/3rds of some rows empty, here is my screen capture ( https://www.screencast.com/t/z0pCzMMV10 ) I zoomed out so you can see it’s repeating and have highlighted them to show what exactly I mean.
I just want to have every row showing 3 posts, (mainly on block15) I don’t mind if last row is displaying 1 or 2 posts only.
I have gone above and beyond playing with TagDiv options and css stylesheet, is this solvable with js?
regards – Sam
Hello,
If you don’t set a featured image on the post, then the theme will load a placeholder image, the placeholder image can be set in Theme Panel -> Block Settings -> Thumbs on Modules/Blocks => https://i.imgur.com/iISRuoX.png
Or you can hide the featured images, from the posts loop block.
The Posts Loops settings are divided into 5 tabs: General, Layout, Style, ADS and CSS. The Posts loop is a special block and doesn’t have filtering options.
Also, one of the options for pagination of the Posts Loop has the option for normal numbered and the flex blocks do not have this option.
The Posts Loop is automatically filtering the posts depending on the cloud template you set (for example on the category page there will be posted posts from that category).
You can use the Flex Block 1 and you can filter it to display the posts only from a category -> https://i.imgur.com/Nnt3zGX.png and you can design it to look like a posts loops block.
Thank you!
Hello —
I am using this CSS as you wrote above. It works great.
.td-theme-slider .td-slide-nav {
opacity: 1!important;
z-index: 1!important;}
Three questions:
— Can I adjust the vertical position of the “Previous” and “Next” slide icons? If I could, I would like the slide icon arrows to be close to the top of the image.
— Is it possible to add a “Pause” button — probably through CSS — and select that icon, color, and location?
— A question about saving for a Mobile layout. I would like to have the slide icon arrows be different size for Mobile than for desktop/laptop. Would I just save while the Mobile icon is shown, and the program will recognize that one parameter for a Mobile?
I tried this one time — it did not work well for me. The settings for Mobile layout also were displayed on a tablet, which made for a bad display on the tablet. When saving a page or post for Mobile, do you suggest that “Landscape viewport” and “Portrait viewport” also be adjusted and saved at the same time?
It would seem that the display settings for a tablet would be better if it defaulted to Desktop viewport rather than defaulting to Mobile viewport.
Thanks much for a very flexible program.
— Fred
—
Hello!
Try this CSS:
#td-mobile-nav .td-menu-login-section a {
color: #fff!important;}
Thank you!
Hi Anamaria,
The accessibility plugin is so that users with eyesight issues can increase the font size to read better.
It is something very common in newspapers.
Is there any way to turn off the !important CSS rules on the builder so that the plugin can work?
Thanks
Is there any way to have it as a template since i can’t make all the required changes? Such as move the menu, change the menu colors, move search icon etc, that with tagdiv is very very easy and without CSS changes?
Hello,
You can set the color on the row in the CSS tab background color -> https://i.imgur.com/yWfpeNg.jpg -> https://i.imgur.com/FZLQPaQ.jpg
Thank you!
We know this! Can you please let the developers know for future updates? Can we get a work around for this for the meantime? Like the css?
Thank you. I have article titles on top of the image, and it turned out that padding-right:100% affected the display of the titles — making a short line out it and doing line breaks in the middle of a word.
So that won’t work.
I am using your first CSS suggestion with padding-top: 100%;
so I’ll see what the user response is.
Thank you.
I looked at your website — so I could see that it could be done.
More clever than the original “200px” approach.
But still doesn’t work completely.
If area where the link is valid is the width of the text.
If the text is the width of the image, then the link will also be with width of the image. But if the text is only a few words and is short, then the link extends only to the area above the text. So it does not work well — someone would have to click right in the area above the text.
Any thoughts? Your solution is better. Is there a CSS that would cover the entire image?
Thanks you.
I added custom css to newspapaer->theme panel -> custom css
.td-theme-slider .td-slide-nav { opacity: 1!important;z-index: 1!important;}
.td_block_slide .td-slide-meta a{
padding-top: 100%;
}
You need to remove category etc from slide also only title should be there to this work.
-
This reply was modified 4 years by
furkan-g.
Catlin, with that CSS Code —
If area where the link is valid goes up from the text. If the test is the width of the image, then the link will also be with width of the image. But if the text is only a few words and is short, then the link extends only to the area above the text. So it does not work well — someone would have to click right above the text.
Any solution on this ? I designed my home page around the Slide element. Is there a different Slide you can suggest?
Or different CSS ? Or different place to put the ?
Thank you.
Hello —
I tried this CSS code.
.td_block_slide .td-slide-meta a{
padding-top: 200px;
}
It resulted in a gray or black-colored square over the image, coming up from the Category. So that is not good.
Any other CSS perhaps?
I tried putting text in the caption.
That does not work at all. — the link is not connected to the image.
Is there another way of putting in the ??
Thank you — my site is Arcata1.com
Hello,
Since there is no option for this, we can try to provide some css
Maybe this one will work better:
.td-is-sticky .wpb_wrapper {
top: 100px!important;
}
Thank you!
Hi there,
We need to integrate an accessibility solution into our website (colors, font size changes, etc).
After some research, we decided to go with “WP Accessibility Helper”.
https://wordpress.org/plugins/wp-accessibility-helper/
However, we notice that the font size increase does not apply to all elements. After some digging we believe that this has to do with the fact that tagDiv applies !important rules to some CSS elements.
Is there any way to make sure the builder does not use !important so that the plugin may work properly? If not, do you recommend any other plugin for this?
Thanks
I had purchased newspaper theme in last october. I have been having a trouble in my wordpress dashboard. WHen I click New post, the page that shows up will be having certain CSS like codes in text format. I have to scroll down to use the wordpress editor.
I also have purchased two more licenses for my new two websites. They are online but haven’t customised to use yet. I fear, i might encounter this problem in them too.
From the expert advices, It came to know that this problem was because of the tagdiv plugin cloud builder. As I used the pre designed designs of tagdiv, I cannot uninstall that. If I uninstall it, there will be error codes and some other stuffs on my website.
I am attaching a screenshot of the issue here : https://prnt.sc/MAHWOJwmQrWU , https://prnt.sc/7Bfy33ZZhGQ4