Before you upload an image to your website, make the most out of this and ensure the image is high quality. Are you wondering what image size and type is best to use before uploading it to Rocketspark? Check out this guide for best practices: What size and type of pictures should I upload to websites?
There are various ways you can display images on your website. Below are the different types of ways you can add an image to your website.
- Column Background
- Stack Background
- Picture Block
- Grid Gallery
- Product Image
Column Background
A column background is great to utilise if you wish to have an image behind the content on your website. If you have multiple columns within a stack and want to upload a background image on just one section of the stack, a column background is the best way here.
To add a column background:
- Go to a specific stack and edit the design.
- Further, go to "Column Settings"
- Upload a background image to the specific column.
- Here is more information: Column Settings
Once you have added a Column background image, you can now be creative by adjusting the image design. Here is How to Edit the Column Design Controls
Stack Background
A stack background will be displayed in the full background of a specific stack. This is different to a column background (as the image is stack-wide).
To add a stack background:
- Go to a specific stack and edit the design.
- Further, go to "Stack Background"
- Toggle to "Image and upload a background image.
- Here is more information: How to Add a Stack Background Image
Or there is a pencil icon when you hover over the stack in the top left-hand corner, you can click this and it will take you straight to the Stack Background settings.
Picture Block
If you simply want to upload a statement image to your website, a picture block will be best here. You can customize the image size and shape to display next to other content within the same stack.
To add a Picture Block:
- Go to a specific stack and Add a new block.
- Further, choose "Picture Block".
- From your device, select the image to display.
- Here is more information: Add a Picture to your Website
Grid Gallery
A Grid Gallery is best if you have a selection of images you wish to upload to your website. This is a great option if you want all of the images to be the same size and perfectly aligned. You can also display text on each image and use different image effects.
Check out our Inspiration Gallery for more ways of utilizing this feature.
To add a Grid Gallery:
- Go to a specific stack and Add a new block.
- Further, choose "Grid Gallery".
- From your device, select the multiple images to upload.
- Here is more information on How to Add a Grid Gallery.
Once you have added the Grid Gallery, you will have more options for Editing the Grid Gallery.
Product Image Block
If you have products on your website, why not feature them on your home page? Simply add a product block and select the different products you wish to display. This will add the main image of your product with the product title and text.
To add a Product Block:
- Go to a specific stack and Add a new block.
- Further, choose "Product".
- Select the product and click save.
- Here is more information on How to add a product block
Product Image Styling
You can change the styling of your product images that upload to your Rocketspark shop. This means if your product images are rectangular or square for example, you alter the shape within Rocketspark.
Check out this guide to learn how to Change Your Product Shape