- ApiPractical example – How to add a new Block and Module
- Apitd_api_block::delete
- Apitd_api_block::update_key
- Apitd_api_block::update
- Apitd_api_block::add
- ApiAPI – Blocks – Introduction
- Apitd_api_thumb::update_key
- Apitd_api_thumb::update
- Apitd_api_thumb::add
- ApiAPI – Thumbnail – Introduction
- Apitd_api_category_top_posts_style::update_key
- Apitd_api_category_top_posts_style::update
- Apitd_api_category_top_posts_style::add
- ApiAPI – Category top section style – Introduction
- Apitd_api_module::update_key
- Apitd_api_module::update
- Apitd_api_module::add
- ApiAPI – Modules – Introduction
- ApiUsing the Theme API in plugins
- ApiThe Theme API
Hi,
You can see how most blocks and grids look in the live theme demo
– https://demo.tagdiv.com/newspaper/
Check the “Features” menu item->Content blocks/Other blocks content. There the blocks can be seen in different row layouts.
Thanks
Hi,
The first code provided by Bogdan has this result
– https://www.screencast.com/t/AVBQYfnl
The arrow color and border are changed to a color of your choosing. Now, if you want these colors to change on hover, use something like this
– https://www.screencast.com/t/NOJJkYRW
.td_block_3 .td-next-prev-wrap a:hover{
color:yellow;
border-color:yellow;
}
If this is not what you need, some more details would be helpful,. I will think of a different solution depending on what exactly you need.
Thanks
Hi,
In order to change the all from blocks please open the page, select the block chege to filter and change the name from field “Filter drop down text” ( https://www.screencast.com/t/SebnMFdg ).
Thanks.
Please try to use the code below and place it in Theme panel -> Custom CSS area.
@media (max-width: 767px){
.td-header-top-menu-full {
display: block;
}
.td-header-sp-top-menu {
display: block !important;
text-align:center
}
}
Thanks.
Hello,
I had created blocks with column content (text, images, buttons) that worked perfectly fine. For some reason, the Title and Description Text is no longer editable. Specifically, when a block is selected, the tagDiv editing box is simply blank and I cannot click into it at all to edit the already existing text in the block (See link below for screen capture). This occurs with every block that already has text in the block when using the tagDiv editor. All system status parameters are green and everything is fine otherwise, as I had previously set-up and edited the blocks originally with no problems. I have emptied page cache as well with no luck. Thank you for your assistance.
The homepage does not display on here because of this weird scoped thing. https://bnn.io/ anything smaller then 767px.
Best I can tell this is the issue.
.td_uid_12_5bb8f9d677a7d_rand{
margin-top:-36px !important;
display:table !important;
<style scoped=””>
/* custom css */
.td_uid_12_5bb8f9d677a7d_rand {
min-height: 0;
}
/* inline tdc_css att */
.td_uid_12_5bb8f9d677a7d_rand{
margin-top:-48px !important;
}
.td_uid_12_5bb8f9d677a7d_rand .td_block_wrap{ text-align:left }
/* phone */
@media (max-width: 767px)
{
.td_uid_12_5bb8f9d677a7d_rand{
margin-top:-36px !important;
display:table !important;
}
}
</style>
There are indeed a ton of options!
I waste time doing the exact same thing.
You seem to have a good control of what you are doing on your new site, but I would make those fonts a little bigger.
and I also wish we could assign different size images for things more easily.
I have been using the “flex” layout blocks to get things exactly the way I want in regards to displaying images on standalone pages.
and I wish we had a little easier control over mobile menu items vs desktop menu items.
I know you can hide/show these things in CSS but they still load for a split second until css kicks in and hides them. which is hit or miss depending on your cache settings and connection speed and server speed.
can someone point me towards a visual guide for all of newspaper’s blocks and modules. ideally something i can print off as an easy reference. i needed it again today – for a particular layout i wanted for a widget, and after 10 minutes hunting just ended up doing it by trial and error of all the various widgets. there must be an easier way?
I’m sorry, but the color for the hover does not come out or something I’ve done wrong.
This is the code that I have put:
.td_block_3 .td-next-prev-wrap to {color: #143a52; border-color: #143a52;}
.td_block_3 .td-next-prev-wrap a: hover {color: #229fd7}
Thanks
Hello Tagdiv Team,
Please add custom taxonomies filter by ID or Name.
Most of the theme users are looking for a long time.
Thank you in advance
Sir,
I Test My Site (https://www.solutioninhindi.com/) Speed Test With
“https://developers.google.com/speed/pagespeed/insights/”
Then Show me lots of Optimization error. I Provide you Optimization Suggestions Link then you can easily understand
Optimization Suggestions
Remove render-blocking JavaScript:
https://www.solutioninhindi.com/âŠ-includes/js/jquery/jquery.js?ver=1.12.4
https://www.solutioninhindi.com/âŠs/jquery/jquery-migrate.min.js?ver=1.4.1
Optimize CSS Delivery of the following:
https://www.solutioninhindi.com/âŠform-7/includes/css/styles.css?ver=5.0.4
https://www.solutioninhindi.com/âŠlugins/td-newsletter/style.css?ver=4.9.8
https://www.solutioninhindi.com/âŠcss?ver=72ece2de773553959e5098a544851753
https://fonts.googleapis.com/âŠ%2C500%2C500italic%2C700%2C900&ver=9.0.1
https://www.solutioninhindi.com/âŠent/themes/Newspaper/style.css?ver=9.0.1
https://www.solutioninhindi.com/âŠcss?ver=dc11e23cd0219f30e55307de07f135fc
Enable compression
Compressing resources with gzip or deflate can reduce the number of bytes sent over the network.
Enable compression for the following resources to reduce their transfer size by 1.4MiB (85% reduction).
Compressing https://www.solutioninhindi.com/âŠent/themes/Newspaper/style.css?ver=9.0.1 could save 1,014.3KiB (89% reduction).
Compressing https://www.solutioninhindi.com/âŠwspaper/js/tagdiv_theme.min.js?ver=9.0.1 could save 155.7KiB (76% reduction).
Compressing https://www.solutioninhindi.com/âŠ-includes/js/jquery/jquery.js?ver=1.12.4 could save 61.9KiB (65% reduction).
Compressing https://www.solutioninhindi.com/âŠcss?ver=72ece2de773553959e5098a544851753 could save 59.1KiB (86% reduction).
Compressing https://www.solutioninhindi.com/âŠcss?ver=dc11e23cd0219f30e55307de07f135fc could save 55.9KiB (87% reduction).
Compressing https://www.solutioninhindi.com/ could save 55.5KiB (79% reduction).
Compressing https://www.solutioninhindi.com/âŠ-form-7/includes/js/scripts.js?ver=5.0.4 could save 10.4KiB (72% reduction).
Leverage browser caching
Setting an expiry date or a maximum age in the HTTP headers for static resources instructs the browser to load previously downloaded resources from local disk rather than over the network.
Leverage browser caching for the following cacheable resources:
https://solutioninhindi.com/âŠads/2018/09/Solutioninhindi-logo-140.png (expiration not specified)
https://solutioninhindi.com/âŠads/2018/09/Solutioninhindi-logo-272.png (expiration not specified)
https://solutioninhindi.com/âŠads/2018/09/Solutioninhindi-logo-280.png (expiration not specified)
https://solutioninhindi.com/âŠ8/09/Solutioninhindi-logo-544-300×53.png (expiration not specified)
https://www.solutioninhindi.com/âŠNewspaper/images/no-thumb/td_218x150.png (expiration not specified)
https://www.solutioninhindi.com/âŠ/Newspaper/images/sprite/elements@2x.png (expiration not specified)
https://www.solutioninhindi.com/âŠth-Se-Android-Mobile-Hack-Kaise-Kare.png (expiration not specified)
https://www.solutioninhindi.com/âŠge-custom-url-set-kaise-kare-768×417.jpg (expiration not specified)
https://www.solutioninhindi.com/âŠ-2Bvideo-2Bkaise-2Bdale-2Bin-2Bhindi.jpg (expiration not specified)
https://www.solutioninhindi.com/âŠ8/09/airtel-free-caller-tune-768×400.jpg (expiration not specified)
https://www.solutioninhindi.com/âŠo-2Bkaise-2Btode-2Bunlock-2Bkare.png.jpg (expiration not specified)
https://www.solutioninhindi.com/âŠ2Bka-2Bpattern-2Block-2Bkaise-2Btode.jpg (expiration not specified)
https://www.googletagmanager.com/gtag/js?id=UA-109288917-2 (15 minutes)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 minutes)
https://www.google-analytics.com/analytics.js (2 hours)
Minify CSS
Compacting CSS code can save many bytes of data and speed up download and parse times.
Minify CSS for the following resources to reduce their size by 214.5KiB (18% reduction).
Minifying https://www.solutioninhindi.com/âŠent/themes/Newspaper/style.css?ver=9.0.1 could save 201.1KiB (18% reduction).
Minifying https://www.solutioninhindi.com/âŠcss?ver=dc11e23cd0219f30e55307de07f135fc could save 13.4KiB (22% reduction).
Minify HTML
Compacting HTML code, including any inline JavaScript and CSS contained in it, can save many bytes of data and speed up download and parse times.
Minify HTML for the following resources to reduce their size by 13.7KiB (20% reduction).
Minifying https://www.solutioninhindi.com/ could save 13.7KiB (20% reduction).
Optimize images
Properly formatting and compressing images can save many bytes of data.
Optimize the following images to reduce their size by 227.9KiB (94% reduction).
Compressing and resizing https://www.solutioninhindi.com/âŠo-2Bkaise-2Btode-2Bunlock-2Bkare.png.jpg could save 60.1KiB (95% reduction).
Compressing and resizing https://www.solutioninhindi.com/âŠge-custom-url-set-kaise-kare-768×417.jpg could save 51.4KiB (95% reduction).
Compressing and resizing https://www.solutioninhindi.com/âŠ-2Bvideo-2Bkaise-2Bdale-2Bin-2Bhindi.jpg could save 43.9KiB (94% reduction).
Compressing and resizing https://www.solutioninhindi.com/âŠ8/09/airtel-free-caller-tune-768×400.jpg could save 42.7KiB (94% reduction).
Compressing and resizing https://www.solutioninhindi.com/âŠ2Bka-2Bpattern-2Block-2Bkaise-2Btode.jpg could save 29.8KiB (93% reduction).
Optimizations Already Present
Avoid landing page redirects
Your page has no redirects. Learn more about avoiding landing page redirects.
Minify JavaScript
Your JavaScript content is minified. Learn more about minifying JavaScript.
Hello,
Please notice that our theme only have a retina display support for the existent thumbs of the theme, only for block thumbs. The retina display means that when you are on mobile devices which has a retina display, the theme will automatically be loaded another image with high dimensions for better results on mobile. In your case, the optimal solution would be to upload a large image first to get the same result as the retina. As I saw on your sidebar, you are using a simple image which does not use any theme thumb and that’s why you do not have a retina image effect. Please follow my advice and check the results!
Thanks.
Hi,
You can use this css code to change the next and prev icons on a block 3:
.td_block_3 .td-next-prev-wrap a{
color:red;
border-color:red;
}
Thank you!
Ok, and the other question.. How can I change the color of the arrow icon in block 3 of the theme?
Hi palcomp,
If you like that, you can install that demo ( with out content/with content ) and just replace it.
Or if you like make your one, there is a row set on stretch row and content ( https://www.screencast.com/t/FQQoi8fov ) and it is set on it a background image ( https://www.screencast.com/t/e2pP6AQQp ).
For posts is a new row and drag in it the block 5 , and set margin top with – example -250 from css ( https://www.screencast.com/t/4vLbHAcwimjN )
Thank you.
Good morning, how could I place 2 columns within a row for the mobile version?
See example on my website: https://www.todosobrealopecia.com
(would be to place rows of 2 icons each)
And another question, to change the color of the arrow icon in block 3 of the theme?
Thank you very much
Hi pawmeal,
Please read our documentation about Homepage and Block settings tutorial, check tagDiv Composer tutorial .
Thank you for your understanding.
Hello
What block or other method I should use to get this same background effect like on this travel theme
https://demo.tagdiv.com/newspaper_travel/
Thank you!
Well, I have the same issue like many of you. When I try to install it, I get:
The link you followed has expired.
I adjusted the Php settings like this:
<script async src=”//s.imgur.com/min/embed.js” charset=”utf-8″></script>
which I think is a little insane, but anyway, I did everything in order to install it.
The rest of the requirements were met:
<script async src=”//s.imgur.com/min/embed.js” charset=”utf-8″></script>
I’ve edited the wp-config:
define( ‘WP_MEMORY_LIMIT’, ’96M’ );
Not working đ Same error, I just don’t know what to do besides this. Very disappointed, the theme looks amazing and I can’t wait to use it. Who would have thought installing could be such a big issue?
Hello WakeUpCallProject,
Try using the code below and place it in Theme panel -> Custom CSS area.
.td_block_8 .td-post-date{
display:none;
}
Thanks.
Hi,
The theme modules will show only the primary category of the post, not all of them
– https://forum.tagdiv.com/primary-category/
This one tag can be enabled/disabled per module
– https://forum.tagdiv.com/category-tag-on-modulesblocks/
There is no option to display all of the categories the post has, in the modules. Sorry if this is an inconvenience.
Thanks
How can you hide the date for just block 8?
Hello fujitas,
If you will deeply check the Theme Colors from Theme panel, you will found there the options for Post and Page content, like this -> https://www.screencast.com/t/ZugwJ2SI Also, on the pages, for each block, you can customize the Headings from Block Settings, like this -> https://www.screencast.com/t/dUT8QZW0c8 So, if is not what you mean, provide more details about what exactly you want to achieve with some screenshots from your website so I will be able to provide a more accurate response. Also, you have to provide your website URL.
Thanks for your understanding!
It is applied to all the thumbnails the theme creates, including the gallery
– https://forum.tagdiv.com/featured-image/
– https://forum.tagdiv.com/thumbnails-vs-featured-image-size/
It is not really an issue, that is how the theme is supposed to work. The focus will be on the center top of the images used.
Let’s take this image you use in the gallery for example, it has top and bottom empty space
– https://collabhype.com/wp-content/uploads/2018/09/black_panther_3.png
When the theme crops it and focuses on the center top, the result will be like this
– https://www.screencast.com/t/oKFrFAX7UCJ
Having better results also depends on the images you use in the first place.
Using a regenerate thumbnails plugin is needed in these cases
– https://forum.tagdiv.com/thumbnails-fix-strange-looking-images-on-blocks/
In this case regenerating will not do anything, the same thumbnails will be created.
I suggested you try a gallery plugin which may display images differently. Maybe try installing a few and make tests in a test post, with the same images from your media library.
Hello Rida,
Where is your block titles? I have inspected again your website but I did not saw them. Provide some screens with the problem because on my end, I see this -> https://www.screencast.com/t/aoBkIgddXbM
Thanks for your understanding!