Simple Pictures
Mr. Blackford likes the store you created, but he just realized the products don't have any pictures. "Sears catalog has pictures," he tells you, "Can you add a picture capability to my store's products?"
Let's add an image capability to products. As usual, you can look into using a gem or addon (such as Filepicker) to help with uploading and processing images. However, since products are just created by admins you can host an image elsewhere and just display it on the product page. This means you just need to add a column to products for an image_url, and can they display it on the product page.
1 - Go ahead and create the migration to add image_url to products.
Enter the following code in your terminal:
rails generate migration AddImageURLToProducts image_url:string
Then enter rake db:migrate
to run the migration.
2 - Display an image from a product's imaeg_url on the product show page.
Use the Rails helper image_tag
to add an image to a page. You can add the following code below the title products/show.html.erb:
<%= image_tag @product.image_url %>
3 - Next it's time to host your images. There are many cheap and free options for easy image hosting, such as Free Google Drive Hosting. Once you have the URL of an image, update the image_url of one of your products to point to that address. You can do this from the Rails console or from your admin dashboard.
Now view your product page with an image:
You can also make adjustments to how the image is displayed by passing options to image_tag or by adding CSS to the image.