Zachary here! A Guru with Shopify!
You can add in that image through the HTML in the featured-content.liquid section of your theme. You can use a normal image tag to insert the image. Alternatively, you can add the image with text section to your theme and blank out the text portions, this will leave just the image, and through some HTML editing, you can center that image as well! :D
For the image source, you can upload your image to the Files section of your admin, then use the URL as the image source in the image tag. When uploading images, we do suggest that you upload a PNG format image, they do seem to perform much better on our themes!
To get it at the top of the page, you'll want to insert it just above this:
<header class="section-header text-center">
*This placement only applies as long as there no customizations to this file, I'm using a fresh copy of Brooklyn as a reference.
Hope that helps! Remember that the Guru Team is always available to help!
Hey i know this is late but for other people searching like me (took me ages to fined this and put it together from other posts) i added in the following code i made to the "custom HTML" section bar of the home page: meaning you can drop it into any section order easily like the others. for brooklyn theme .
"><h2>put your heading here
<a href="put your page link here">
<img src="put your picture link here/1980x700" alt="">
for your picture, add it to your files on shopify, copy that link and put it where it says "put your picture link here" in red above (full https://).
now add your page link to where it says "put your page link here " in red above (use the last section of the link eg /mypage/page2 written in a lighter colour in the search bar.
now your home page should have a picture and clickable link on it to take you to any page. :)
How to add more then one image in a row? I would like to add set of Quality icons in png. For example 5 different icons(png) with small discription in a one row and I would like to have these images responsive to mobile version. + Under the png images I would like to add a bit bigger and with full width responsive backround rectangle in specific color. Is there some code for that? I am using Brooklyn theme! Thank you!