size=’thumbnail’ doesn’t work

@violetta666 I will check this weekend. Sorry for the delay.

• This reply was modified 1 year ago by johnzenausa.

ok thanks, important to resolve.
I used this shortcode
[netsposts thumbnail=’true’ size=’thumbnail’ hide_excerpt=’true’ paginate=’true’]
Thank you

First of all you did understand the tutorial correctly.

When I inspect the html it is grabbing the correct thumbnail. You can see that the source is: https://andco.app/wp-content/uploads/sites/2/2023/11/1653467544_cijene-nekretnina-u-hrvatskoj-150×150.jpg. So it is grabbing the 150×150 image. As you can see in the below images.

When I inspect the image there is a CSS class causing it to fill the whole container. It is the class involving the .wp-lazy-load.

See how it’s giving it a width of 100%? So that’s why it’s growing to full size. So you may add a simple class and shortcode ID.

First add this to the specific shortcode shortcode_id='immobili_page' so the full shortcode will look like so:

[netsposts shortcode_id='immobili_page' thumbnail='true' size='thumbnail' hide_excerpt='true' paginate='true']

Then you may add the following to your CSS file or wherever you add your custom CSS.

#immobili_page .netsposts-content .post-thumbnail.wd-lazy-load { width: 150px; }

This should overwrite the other CSS and take priority. Let me know if it doesn’t work.

Note: This will only work for this instance of the shortcode. If you want it to work everywhere ignore the part about the ID. Then the CSS would just be:

.netsposts-content .post-thumbnail.wd-lazy-load { width: 150px; }

Plus the shortcode would remain the same as you had it.

• This reply was modified 1 year ago by johnzenausa. Reason: Had multiple typos that needed to be corrected
• This reply was modified 1 year ago by johnzenausa. Reason: Changed shortcode to CSS for clarity. Miss-typed again

Perfect

https://andco.app/immobili/

Thank you

• This reply was modified 1 year ago by violetta666.
• This reply was modified 1 year ago by violetta666.
• This reply was modified 1 year ago by violetta666.
• This reply was modified 1 year ago by violetta666.

Hi, how to hide publish date?

Hi you want to just hide the date or all the meta data?

Hi @violetta666;

There is no shortcode parameter to hide it so you’ll have to use some css. You may use the following:

.netsposts-source > span:not(:last-of-type) { display: none; }

If you want to target this particular shortcode just put the shorcode_id in the front as such:

#immobili_page .netsposts-source > span:not(:last-of-type) { display: none; }

It’ll look like the following image:

• This reply was modified 1 year ago by johnzenausa.
• This reply was modified 1 year ago by johnzenausa.

Perfect, just how I wanted it.
thank you for everything, you were very kind

One more small question: how to center content in the column?
thanks

I added two parameters for the post date meta info. You may now hide it with the following attribute.

hide_post_date_meta_info='true'

Plus if you want to style that particular text individually you may add the following wrap shortcodes.

wrap_post_date_start & wrap_post_date_end

An example would be:

wrap_post_date_start='<div class="some-class">' wrap_post_date_end='</div>'

Hello and thanks for the update. But the problem of centering content on the page remains.
Thanks

tomorrow I’ll try to set up a grid or flex layout. If it’s already flex did you try justify-content: center?

• This reply was modified 1 year ago by johnzenausa.

Hi, Your shortcode is in wpbakery column set with centered text, but it doesn’t work.
https://andco.app/immobili/

thanks

• This reply was modified 1 year ago by violetta666.
• This reply was modified 1 year ago by violetta666.

@violetta666 I see that you have some custom html code already added.

immobili_page .netsposts-items { display: grid; grid-template-columns: repeat(auto-fit, 300px); gap: 1em; }

So all you need to do to center them is to add justify-content: center; to the css code above so it will look like such.

immobili_page .netsposts-items { display: grid; grid-template-columns: repeat(auto-fit, 300px); gap: 1em; justify-content: center; }

You may see the image here showing what I mean.

https://photos.app.goo.gl/qxvpqX2VQLbbewBq6

Perfect, thank you so much for everything