Docs

[alanjonesonline]

Hi there,

I would like to constrain the blog feature image’s size to max 900px height and max 900px width. Using Icon stack. Is this possible?

I looked through past threads but could only see how to reduce the image size by a % (e.g. 50% width). Not exactly what I’m after.

Any help would be appreciated.

http://www.alanjonesonline.com

Cheers

[Thai]

Hi There,

I would like to check your website but it’s under construction mode.

Would you mind providing us with your admin account so we can take a closer look?

Thanks.

[alanjonesonline]

Hi There,

Under construction mode is now turned off.

Is it possible for the featured image to appear it’s actual size? This would probably suit me even better given I usually save all images to 900px (longest edge) but if I can have the featured image appear it’s actual size this would allow me to have the image smaller or larger if it suits the post.

Also, is it possible to display the published date under the title in the masonry view of the blog?

Cheers

[Paul R]

Hi,

Upon checking, I can see it is already pulling the actual size of the featured image.

With regards to date, you can turn on post meta under Blog > CONTENT in the customizer.

http://screencast.com/t/1I9mLwV6j

[alanjonesonline]

Hi Paul

Thanks for your reply.

This is the code I have inserted into the custom CSS.

.single-post .entry-featured {
width:50%;
margin:0 auto;
display:block;
}

It reduces the width of the featured image to 50% of the width of the post. What I would like to achieve is for the featured image to appear as it’s actual size in pixels. If could do this I could then have one post feature image might be 920px x 350px, the next post feature image might be 750px x 230px.

I have turned on the post meta in Blog>Content as suggested. Nothing appears. The image does shifts down slightly – so it does do something – but no meta shows. Any adeas?

Thanks for your help. Much appreciated.

Cheers

[Christopher]

Hi there,

I don’t recommend adjusting image’s width in px as it stretches images since they have different dimensions. You can try it and see what I mean.

Please remove following custom code :

.p-meta span {
    font-size: 0;
}

Hope it helps.

[alanjonesonline]

Hi There

The reason I would like for the feature image to appear simply as it’s actual size is because the default Icon stack was stretching all my images into the standard width of the page. The images then lose resolution and become blurry. Also any images that are portrait format (and most of mine are) become way to big. Is there a way to make the featured image that is 750px x 230px appear that size?

I removed the code as suggested and it didn’t seem to work. Still no meta displayed.

I really appreciate your help.

Cheers

[Christopher]

Hi there,

The code is still present in your style.css file, see the attachment.

Find this code and change width value to 750px :

.single-post .entry-featured {
    width: 50%;
    margin: 0 auto;
    display: block;
}

Note that modifying both width and height properties stretch images.

Hope it helps.

[alanjonesonline]

This reply has been marked as private.

[alanjonesonline]

This reply has been marked as private.

[Rue Nel]

Hello There,

Thanks for updating in! The best way to contain the feature image is to limit the maximum attainable width. Perhaps you can find this block in your css:

.single-post .entry-featured {
  width:50%;
  margin:0 auto;
  display:block;
}

And replace it with this code instead:

.single-post .entry-featured {
  width: 100%;
  max-width: 900px;
  max-height: 900px;
  margin:0 auto;
  display:block;
}

In the code above, we set the width to 100% but the maximum attainable width and height is only set to 900 pixels only.

We would loved to know if this has work for you. Thank you.

[alanjonesonline]

This reply has been marked as private.

[Paul R]

Hi,

Please remove max height from the code above.

eg.

.single-post .entry-featured {
  width: 100%;
  max-width: 900px; 
  margin:0 auto;
  display:block;
}

With regards to post meta, we need to check your theme files.

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

[alanjonesonline]

This reply has been marked as private.

[Joao]

Update:

.single-post .entry-featured {
    width: 50%;
    margin: 0 auto;
    display: block;
}

to:

.single-post .entry-featured {
    width: 50%;
    margin: 0 auto;
    display: block;
    padding: 0;
    border: 0;
}

On the specific image http://www.alanjonesonline.com/smh-open-gallery-new-south-wales/ the border fits well you might remove border: 0; if you think it will fit to your other images as well.

Hope it helps

cheers.

joao

[Author]

Posts