Tutorial: How to Insert Product Photos on Gallery Style Layout

For those who order our Blogshop Premium, here's a tutorial on how to insert the photos for your Gallery layout. Don't worry if you don't have any photo editing program on your computer. Cause I would like to recommend you to use PIXLR. This is a free photo editor online. You don't need to install anything!

Step # 1: Edit your image size
The recommended image size for the layout is 350x350px. Please follow the followings step by step. 
Go to PIXLR and click on Open photo editor.

Click on Create a new image.

Change the size to 350 for both Width and Height. I named it "Picture1".

Now it should look something like this.

Open up your image by clicking on File > Open image... I opened a file named 160.jpg.

Now that you have two files opened ("Picture1" and "160.jpg"). For your second  file ("160.jpg"), click on Image size...

Check "Constrain proportions". I only changed the Width to 350 px. The height will be automatically adjusted.

Now move your image on to "Picture1" file by clicking on the layer and dragging it.

Adjust the position of your image and save.

Now that you have a perfect square image of 350 x 350 px size.

Step # 2: Insert your image on to the blog post

Our Gallery style layout comes with automatic post layout. When you click on Posting > New Post, a post layout will automatically appear as shown below. All you need to do is to change the image and the description of the product.

Insert Image (picture icon) on "Edit HTML" tab. The picture code will appear as shown below. Delete the code highlighted in yellow and replace it with the code highlighted in blue.

Once you've done it, delete the code as shown below, and don't forget to insert the post title. I believe every product is unique, change the product specifications (highlighted in yellow), and there you go! Your post on your product is ready!

No comments:

Post a Comment


Love Us on Facebook

Subscribe for Updates

Share the Love