Using an image from amazon s3 as header image in Generatepress

Hi Ben,

The "Image" tab in Page Header won't work with external URLs, but you can use the "Content" tab and then use HTML in the textarea:

<img src="URL TO YOUR AMAZON S3 IMAGE" alt="" />

Thanks very much Tom!

Best Regards,
Ben Foo

One more question Tom,

If I successfully place the picture in the header using the content tab as instructed above, does it mean that the picture will appear in Masonry? Thanks again.

Best Regards,
Ben Foo

It should - as long as you're adding a post and you check the "Add to blog excerpt" option.

Hi Tom,

Thanks. I've got the picture up. At the same time, I can't seem to change the size of the image like you did in the video. How do I go about doing it?

Since you're adding it as HTML, GP doesn't have as much control over it.

If you can't control the dimensions of the image before uploading it to Amazon, you can use CSS:

<img src="URL TO YOUR AMAZON S3 IMAGE" alt="" style="max-width:1000px;" />

Hi Tom,

I do not know much about css. Can you help me on this? If I want to change the height and the width, what do I key. I believe the css below is only for width right?

Thanks again Tom!

Best Regards,
Ben Foo

You can also do height, but it may cause quality loss if you use both:

<img src="URL TO YOUR AMAZON S3 IMAGE" alt="" style="height:300px;" />

It's best if your resize your image to the dimensions you want before uploading it to Amazon.

Thanks again Tom!

No worries :)

Hi Tom,

What is the optimal dimensions I should resize my image to so that I can do what you did in the video with the masonry? What I'm planning to do is to get all the pictures to one side of the webpage. Like what you did with your website under masonry. Thank you.

Best Rgds,
Ben Foo

Hi Ben,

It's really your preference/whatever looks good.

You want to resize your images to be as close to the displayable size as possible, but GP will make sure they fit in their container no matter how big they as (as long as they're not too small).

Let me know if you need more info :)