Including images in your posts
After a good formating, it is also highly recommended to use images in your posts but Steemit didn't have the capacity of hosting image files until february 2017. Before the feature release it was necessary to upload your image in a third party site like Imgsafe.org or SteemIMG. Then, copy the image link (that usually start with http or https and ends with .jpg, .png or .gif - the most popular image file formats), and paste this image adress in the post (Steemit Submit a Story window) you are editing.
Also, make sure that you are not violating any copyright laws if you are using someone else's material/images. It is a good idea to list the sources and provide credit to the original authors.
As promised in the 2017 Roadmap, the Steemit pictures host limitation changed in february, a free integrated image hosting service was deployed, permitting anyone to drag-and-drop any image on their computer into any post or comment. This feature was announced to be available in Q2 (april to june) but the release happened in february 2017.
Image Hosting Sites
To host the posts' pictures before the upload feature release, despite the Steemit users oriented site SteemIMG, many steemians prefered using Imgsafe.org, where registration is optional, not mandatory. Other alternative was Supload.com, a host and sharing image site that pays bitcoin to registered users acording to their pictures' number of views. More options were Imgur.com, Pictub.club, Postimg.io etc.
The default image alignment is on the left, but In the "Markdown" mode option it is possible to align images to the center using the code below:
Or like floating left or right next to a text. To do that, as explained by @ervin-lemark, you can use these codes:
- <div class="pull-right">http://yourimage/link.png</div> Left side column
- <div class="pull-left">http://yourimage/link.png</div> Right side column
Optimal Image Sizes & Resizes
After some experimentations the steemian @pkattera recommended the "perfect" dimensions for the post's main image. Within the main feed on Steemit, this image when presented as a thumbnail should display in full on smaller mobile screens, while the area within the "safe zone" (see the template) should be visible on desktop.
- 1680 x 1292 pixels, 840 x 646 pixels or smaller images with the same 1.3:1 ratio
And according to @rossenpavlov's tip there is a easy way to resize pictures inside the Markdown editor. He explains that when you insert a image link the editor adds the following prefix:
- https://img1.steemit.com/0x0/http://yourimage/link.png - where the value /0x0/ render the original size.
Knowing that you can change the value to resize the image replacing the 0s by other numbers of pixels. If the original image is 600x300 and you want to have it smaller to half, the code would look like this:
You can also specify only the height or width and leave the other attribute empty, and the code will also work.
Mobile App & Chrome Extension
A current feature in eSteem, mobile and desktop application for Steem(it) developed by @good-karma, allow the users direct upload images to Imgur.com that is listed in a gallery where you select to post.
Other steemian, @savandra, annouced in july 2016 a Google Chrome Extension called Steemitor. The idea was to allow users to just drag and drop one image and get ready-to-go picture but the link to Chrome Store is not active anymore.
- Steemit : https://steemit.com
- SteemIMG : http://www.steemimg.com, created by @blueorgy in July 2016
- Steemithelp.net : https://www.steemithelp.net
- @steemitblog : Steemit 2017 Roadmap. January 2017
- @steemitguide : Tips on how to Edit & Customize Images via Steemit's Raw HTML Editor; Add Links, Source Reliable Image Hosting Services and Center Align Images. January 2017
- @billbutler : Adding images to your Steem posts. June 2016
- @boarddavid : Inserting "zoomable" images on your Steemit post. July 2016
- @savandra : The easiest way to post photo/image on Steemit (Chrome Extension). July 2016
- @ace108 : How to include image in your post - Reference to using Steemimg.com in include pictures your post. July 2016
- @questd23 : Beginners Guide on how to post images and video to steemit (video tutorial). July 2016
- @blueorgy : Steemit Emoji Master List. September 2016
- @ervin-lemark : How Can You Left Or Right Align Parts Of Your Steemit Article, Images Included?. October 2016
- @pkattera : The perfect dimensions for the main image in your Steemit.com post are.... December 2016
- @rossenpavlov : Easy Resize Images Inside The Steemit Editor. January 2017
- @good-karma : eSteem - Feature Set #7 (Select Image, My Images, Manage My Images, CopyPaste Image). January 2017
- @edrivegom : New Function in Steemit To insert images. February 2017
- @scrooger : Pimp your post with this simple Cheat Sheet! Just copy and paste! June 13th, 2017
- @dmcamera : Why not to use images you find on the internet – it's illegal – you are stealing! January 6th, 2018
- @justineh : How To Change Your Profile Photo And Other “Settings” on Steemit.com June 18th, 2019
- Arcane Bear YouTube Channel : How to: Add a profile picture | STEEMIT Video tutorial by Tijo (@thearcanebear} published in 5/19/2017
- Frot Design : A bunch of stuff about Steemit Written by unsigned, published in 10/27/2016
In other languages
| Help keep this wiki page updated. Register, click in edit, add or modify the text and save. |
If you're already a steemian you can be rewarded with steem, see how in @steemcenterwiki.