create account

Tips on how to Edit & Customize Images via Steemit's Raw HTML Editor; Add Links, Source Reliable Image Hosting Services and Center Align Images by steemitguide

View this thread on: hive.blogpeakd.comecency.com
· @steemitguide · (edited)
$13.43
Tips on how to Edit & Customize Images via Steemit's Raw HTML Editor; Add Links, Source Reliable Image Hosting Services and Center Align Images
<img src="http://s.pictub.club/2017/01/02/sIld0Y.png" alt="sIld0Y.png" border="0">
This is an Educational post on how to add & edit Images  via the built-in Raw HTML Editor

<center><h1>Learn How to:</h1></center>
- Add Images to your Steemit Post
- Reliable Image Hosting Services
- Center Align Image to the Middle

<center><b>You can find the Raw HTML Editor Here</b></center>
https://img1.steemit.com/0x0/https://www.steemimg.com/images/2016/08/10/Preview-post212a16.jpg

_____

*Steemit is getting smarter over time so you should always be on the lookout for new Tutorials!*
<b>
<center><h1>Add Images to your Steemit Post</h1></center>

Let's begin with the basic's, by learning how to add an image to your Steemit Post. Keep in mind that the Raw Editor recognizes Markdown and also a subset of HTML Codes, a blend of these 2 together actually allows us to further customize & edit our Post

All you need now is an image and your blank spaced Raw Editor on Steemit to Begin with!
Let's assume you're interested in a picture you found online, before you decide to use the image make sure to check that you're not using copyright material because it could get you in a lot trouble!
<b>
**Identify the Website Link**
http://www.hits.me.uk/Responsive%20Web%20Design/images/Usef%20Links.jpg

Just copy & paste the Web link into the Raw Editor, the link can start with 
**''www.'''** or **''http"**or **"https"** 

Steemit has made it easy for you to attach Images to your Post, now you simply have to copy and paste the Image Website Link into the Raw Editor, it will appear in the preview. 
(Sometimes it won't appear, due to Internet problems but it should almost appear immediately in the preview)

<b>
<center><h1>Reliable Image Hosting Services</h1></center>

At some point, you would want to upload your own Images, so you will need to host your pictures in order for it to be accessible on the world wide web, since the pictures you keep stored on your computer are not publicly shared 

You will need to upload your Pictures with a Dedicated Image Hosting Service!

Image Hosting Service is a cloud storage service specifically for images! There are plenty of Free Image Hosting Services available however you will need to pick wisely because expect 100% Uptime!

Nobody wants downtime, this is when your file becomes unaccessible and if this happen all Images Hosted by a third party service will be unviewable in your Steemit Post, so you always want 100% Uptime

Here are my **Favourite 3 Image Hosting Service**
<b>
<center><h1>1) Steemimg.com</h1></center>
This Site was essentially build by a Steemit User @blueorgy and it's my favourite Image Hosting of-all-time.  (Steeming)[www.steemimg.com] is the ideal image hosting service to use because not only is it free but it offers you a place to showcase and share images. 

The fact that you can customize your Profile,  user-friendly interface and additional small features make this a unique image hosting platform . The only requirement is the need to sign up with Steemimg to receive your own account there, however you choose to make images private or public so you can easily share them with the Steemit Community

All Steemians can support the development of Steemimg.com, just follow @blueorgy  

<img src="http://s.pictub.club/2016/12/31/sIkXKr.png" alt="sIkXKr.png" border="0">


<center><h1>2) Imgsafe.com</h1></center>
If you're looking for a reputable Hosting Service that has a good record when it comes to uninterrupted up-time then [www.imgsafe.com](www.imgsafe.com) is for you! You don't need an account so you can start uploading pictures without registering an account, swiftly upload your images withouth restriction! Allowing Files bigger 20MB, you can surely count on imgsafe.com to host your pictures 

<center>https://box.eerhelper.me/attachment/481384/7443bad0-0bc0-4ca2-acff-4c710bd8a887/343907-IKB8tOHPIrTNEEif/screen.png</center>
If this Picture appears instead of your image, it means that it was unable to retrieve data from the Image Hosting Service. This is why you want to reliable and trusted Image Hosting Service like imgsafe.com, they been a hosting service for several years and reliable track-record of hosting images with 100% uptime.

If you pick a bad Image Hosting Service and ceases to operate in the future, there is chance of all images linked to Post to be unviewable, leaving you with scenario where all your post are outdated! 
Most Image Hosting services are free, so they have to have the storage and servers to support 

<img src="http://s.pictub.club/2016/12/31/sIkKmq.png" alt="sIkKmq.png" border="0">
<center><h1>3) Pictub.club</h1></center>

A Relatively new Hosting Service similar to Steemimg.com, users however don't require to sign up and you can immediately upload content. It offers you multiple links & codes so it definiately comes in handy if you wish to quickly upload Images 

Upload Image Size is 100MB so there is little Restriction with [Pictub.club](www.pictub.club)! 
<img src="http://s.pictub.club/2016/12/31/sIkzTL.png" alt="sIkzTL.png" border="0">

<center><h1> Center Align Image to the Middle</h1></center>

By default all your images will be aligned to the left, many Steemians are unaware of it until they previewed their Post themselves. You will need to include Markdown Code in order to center align the image

Step 1 Open Markdown Code
> \<center>

Step 2 Include the link in between Less-Than Sign and Greater-Than Sign
> \<center>www.yourimagelinkinbetweenthelessorgreatersign\<

Step 3 Close the Code
> www.yourimagelinkinbetweenthelessorgreatersign\</center>

Step 4 The Complete Code
> \<center>www.yourimagelinkinbetweenthelessorgreatersign\</center>

____
<center><h1>Beginner Tip</h1></center>
Keep In Mind that the first image you use, will be used a default pic for your Post! The First Image will appear on Steemit, so this image really to grab people attention! Make sure it's eye-catching sight because you'll get upvoted if you catch people attention
___

_______
# Here are some other Guides you might find Interesting

[Markdown and HTML Code Guide for Beginners that includes 5 Useful Tips to edit posts and comments using the raw Editor](https://steemit.com/steemit/@steemitguide/markdown-and-html-code-guide-for-beginners-that-includes-5-useful-tips-to-edit-posts-and-comments-using-the-raw-editor)

[Tutorial on how to use Unicode Characters on Steemit; Includes Cheatsheet on Smileys icons and Symbols&#128526;](https://steemit.com/steemitguide/@steemitguide/steemitguide-tutorial-on-how-to-use-unicode-characters-on-steemit-includes-cheatsheet-on-smileys-icons-and-symbols-which-are)

[How to Construct a 2 or 3 Column Table using Steemit's Raw Markdown Editor! Tutorial and Codes for Beginners](https://steemit.com/steemit/@steemitguide/how-to-contruct-a-2-or-3-column-table-using-steemit-s-raw-markdown-editor-tutorial-and-codes-for-beginners)

[HowTo Make Use of a Steemit Feature that allow's you to display content floating left & right and learn how to paragraph](https://steemit.com/steemit/@steemitguide/steemitguide-howto-make-use-of-a-steemit-feature-that-allows-you-to-display-content-floating-left-right-and-learn-to-paragraph)

[Align Text, Images, Videos & GIF's to the Center of Post using Markdown Raw Editor](https://steemit.com/markdown/@steemitguide/align-text-images-videos-and-gif-s-to-the-center-of-post-using-markdown-raw-editor)

[How to insert 2 Columns and edit Text Style with equivalent HTML tags using Steemit's Raw Markdown Editor](https://steemit.com/steemit/@steemitguide/how-to-insert-2-columns-and-edit-text-style-with-equivalent-html-tags-using-steemit-s-raw-markdown-editor)
_____
<p>
<div class=pull-right>
<a href="http://steemimg.com/image/DFFlx"><img src="https://storage.googleapis.com/steemimgimgs/2016/10/18/steemitguide47985.png" alt="steemitguide47985.png" border="0" /></a>
</div>

Doesn't this go well with the SteemVerify Logo? Anyways, if you spot an error in any of my Guides please feel free to correct me and also if there is anything you would like to see a Guide on, let me know! Dedicated young Steemian interested in getting Vested. Will write more Guides & Tutorials about Steemit, Follow me for more!
 </p>
👍  , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , and 151 others
properties (23)
authorsteemitguide
permlinktips-on-how-to-edit-and-customize-images-via-steemit-s-raw-html-editor-add-links-source-reliable-image-hosting-services-and
categorysteemit
json_metadata{"tags":["steemit","steemitguide","steemit-help","steem","markdown"],"users":["blueorgy"],"image":["http://s.pictub.club/2017/01/02/sIld0Y.png","https://img1.steemit.com/0x0/https://www.steemimg.com/images/2016/08/10/Preview-post212a16.jpg","http://www.hits.me.uk/Responsive%20Web%20Design/images/Usef%20Links.jpg","http://s.pictub.club/2016/12/31/sIkXKr.png","https://box.eerhelper.me/attachment/481384/7443bad0-0bc0-4ca2-acff-4c710bd8a887/343907-IKB8tOHPIrTNEEif/screen.png","http://s.pictub.club/2016/12/31/sIkKmq.png","http://s.pictub.club/2016/12/31/sIkzTL.png","https://storage.googleapis.com/steemimgimgs/2016/10/18/steemitguide47985.png"],"links":["www.imgsafe.com","www.pictub.club","https://steemit.com/steemit/@steemitguide/markdown-and-html-code-guide-for-beginners-that-includes-5-useful-tips-to-edit-posts-and-comments-using-the-raw-editor","https://steemit.com/steemitguide/@steemitguide/steemitguide-tutorial-on-how-to-use-unicode-characters-on-steemit-includes-cheatsheet-on-smileys-icons-and-symbols-which-are","https://steemit.com/steemit/@steemitguide/how-to-contruct-a-2-or-3-column-table-using-steemit-s-raw-markdown-editor-tutorial-and-codes-for-beginners","https://steemit.com/steemit/@steemitguide/steemitguide-howto-make-use-of-a-steemit-feature-that-allows-you-to-display-content-floating-left-right-and-learn-to-paragraph","https://steemit.com/markdown/@steemitguide/align-text-images-videos-and-gif-s-to-the-center-of-post-using-markdown-raw-editor","https://steemit.com/steemit/@steemitguide/how-to-insert-2-columns-and-edit-text-style-with-equivalent-html-tags-using-steemit-s-raw-markdown-editor","http://steemimg.com/image/DFFlx"],"app":"steemit/0.1","format":"markdown"}
created2017-01-01 17:01:18
last_update2017-01-01 17:48:03
depth0
children3
last_payout2017-02-01 20:50:12
cashout_time1969-12-31 23:59:59
total_payout_value10.629 HBD
curator_payout_value2.796 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length8,233
author_reputation35,147,549,313,619
root_title"Tips on how to Edit & Customize Images via Steemit's Raw HTML Editor; Add Links, Source Reliable Image Hosting Services and Center Align Images"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd0
post_id2,133,225
net_rshares40,150,588,229,888
author_curate_reward""
vote details (215)
@antidorsessions ·
Replied to easily find it again in my feed. Thanks for the work
properties (22)
authorantidorsessions
permlinkre-steemitguide-tips-on-how-to-edit-and-customize-images-via-steemit-s-raw-html-editor-add-links-source-reliable-image-hosting-services-and-20170101t201722253z
categorysteemit
json_metadata{"tags":["steemit"]}
created2017-01-01 20:17:21
last_update2017-01-01 20:17:21
depth1
children0
last_payout2017-02-01 20:50:12
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length63
author_reputation3,930,255,189,326
root_title"Tips on how to Edit & Customize Images via Steemit's Raw HTML Editor; Add Links, Source Reliable Image Hosting Services and Center Align Images"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id2,134,563
net_rshares0
@barrydutton ·
I will always UV and support great #Steemit101 type posts like this!  There are always people coming here who need these things.  Great post.
properties (22)
authorbarrydutton
permlinkre-steemitguide-tips-on-how-to-edit-and-customize-images-via-steemit-s-raw-html-editor-add-links-source-reliable-image-hosting-services-and-20170101t175842556z
categorysteemit
json_metadata{"tags":["steemit101","steemit"]}
created2017-01-01 17:58:42
last_update2017-01-01 17:58:42
depth1
children0
last_payout2017-02-01 20:50:12
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length141
author_reputation333,942,309,404,197
root_title"Tips on how to Edit & Customize Images via Steemit's Raw HTML Editor; Add Links, Source Reliable Image Hosting Services and Center Align Images"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id2,133,689
net_rshares0
@etcmike ·
As always another great tip!

Thank you for putting these tips together for the community!

Upvoted and resteemed,
Mike
properties (22)
authoretcmike
permlinkre-steemitguide-tips-on-how-to-edit-and-customize-images-via-steemit-s-raw-html-editor-add-links-source-reliable-image-hosting-services-and-20170101t171548233z
categorysteemit
json_metadata{"tags":["steemit"]}
created2017-01-01 17:15:48
last_update2017-01-01 17:15:48
depth1
children0
last_payout2017-02-01 20:50:12
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length119
author_reputation534,676,096,189,306
root_title"Tips on how to Edit & Customize Images via Steemit's Raw HTML Editor; Add Links, Source Reliable Image Hosting Services and Center Align Images"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id2,133,340
net_rshares0