Guide: Embedding Images into your Post

Be sure to read and follow the guidelines for our forums.

Jul 7, 2016 8:46 pm
There are two steps to insert (aka embed) an image into your post on GamersPlane.

1) Getting the URL for the image

All image files must be hosted on some other web server with a publicly accessible URL. GamersPlane.com does not currently support hosting image files.

This first step is the more complicated of the two because there are a wide variety of file and image hosting options available. In the posts below, I will explain the necessary steps to get the image URL from Dropbox, Google Drive, and Other internet locations. But once you have the image URL, proceed to Step 2.


2) Inserting the Image

To insert your image, you can either use the following brackets around your URL (replace {} with [])

{img}INSERT IMAGE URL HERE{/img}

Or you can click on the Insert Image icon above the post:
https://dl.dropbox.com/s/12mpjdknzcgwa1v/GP_InsertImage.jpg

Then paste the image URL into the dialogue box and click OK:

Chrome:
https://dl.dropbox.com/s/n1i7e8ddgjndhd3/GP_SelectImageURL.jpg

Internet Explorer:
https://dl.dropbox.com/s/95ixq6uu4o245uz/GP_SelectImageURL_IE.jpg

Firefox:
https://dl.dropbox.com/s/5wpuwltvelry6tz/GP_SelectImageURL_FF.jpg


Example:

Image URL = http://gamersplane.com/images/bodyComponents/logo.png
Insert Code (replace {} with []) = {img}http://gamersplane.com/images/bodyComponents/logo.png{/img}
Final Result:

http://gamersplane.com/images/bodyComponents/logo.png
Last edited March 19, 2017 2:08 pm
Jul 7, 2016 8:50 pm
Something I've not experimented with, nor asked Keleth specifically, but can image sizes be modified to fit within the forum constraints? If the answer is provided within the guide itself, I will delete this post to clean up the thread.
Last edited July 7, 2016 8:51 pm
Jul 7, 2016 8:52 pm
CancerMan says:
Something I've not experimented with, nor asked Keleth specifically, but can image sizes be modified to fit within the forum constraints?
I don't think so....the only way I've been able to tweak the size was to adjust it before uploading it.
Jul 7, 2016 9:07 pm
I will end up splitting the extra posts off to a separate thread. We're trying to figure out how guides should be setup; we're thinking of locking them so they can be expanded later, and having discussions in separate threads. I donno quite how we should do it. If njohn858 doesn't oppose, I, Naatkinson, and phil_ozzy_fer will work on editing the guide.
Jul 7, 2016 9:09 pm
Keleth says:
I will end up splitting the extra posts off to a separate thread. We're trying to figure out how guides should be setup; we're thinking of locking them so they can be expanded later, and having discussions in separate threads. I donno quite how we should do it. If njohn858 doesn't oppose, I, Naatkinson, and phil_ozzy_fer will work on editing the guide.
I don't oppose. I'm planning on getting the additional write-ups for Dropbox, Google Drive, and Other done in the next week or so....if you're planning on locking this thread, where would you have me put those?

Also, what are the supported image types? I'm aware of .jpg and .png but are there others?
Last edited July 9, 2016 1:51 am
Jul 7, 2016 9:15 pm
We'll hold off on locking it for now. Right now, any image type is supported.
Jul 8, 2016 8:29 pm
Inserting images from Dropbox:

To use Dropbox, you must first create an account with them. When you create an account, they will give you 2GB storage for free (2.5GB if you use this link to sign up), though there are options to increase that storage space later.

1. Store image in Dropbox

2. Get Public Share link

You can get the Public Share link either from the website or from your computer/mobile device.

~~~~~~~~~~~

Website:

Go to dropbox.com and browse to your image file then,

Click Share
https://dl.dropbox.com/s/wr5bccqay2f55ym/GP_DB_ShareButton.png

Click Create a Link
https://dl.dropbox.com/s/qna8mp23u8dxspc/GP_DB_CreateLink.png

Click Copy Link
https://dl.dropbox.com/s/z9tleri3e2m439n/GP_DB_WebCopyLink.png

The link is now in your clipboard. Proceed to Step 3.

~~~~~~~~~~~

From your Computer:

--Using Windows

R-click on File >> Copy Dropbox Link
https://dl.dropbox.com/s/4reayil093sz1zv/GP_DB_RClick.png

The link is now in your clipboard. Proceed to Step 3.

--Apple?

--Linux?

~~~~~~~~~~~

From mobile device:

--Android

Launch Dropbox app and browse to image file

Tap the Menu icon >> Share
https://dl.dropbox.com/s/x6sjoxlto9cqqn8/GP_DB_MenuShare.png

Tap Share
https://dl.dropbox.com/s/0h25xmsp0ubfa7q/GP_DB_LinkShare.png

Tap Copy Link
https://dl.dropbox.com/s/ysbya3rsbt2o7nr/GP_DB_AndroidCopyLink.png

The link is now in your clipboard. Proceed to Step 3.


--iOS?


3. Modify URL

Paste the URL into your post then:

1. Change 'www' in the URL to 'dl'

https://www.dropbox.com/s/6upkeqhysa1ugf8/GPLogo.png?dl=0

Becomes

https://dl.dropbox.com/s/6upkeqhysa1ugf8/GPLogo.png?dl=0

2. Remove '?dl=0' from end of URL

https://dl.dropbox.com/s/6upkeqhysa1ugf8/GPLogo.png?dl=0

Becomes

https://dl.dropbox.com/s/6upkeqhysa1ugf8/GPLogo.png
Last edited March 19, 2017 4:42 pm
Jul 11, 2016 5:44 pm
Inserting Images from Google Drive:

To use Google Drive, you must first create an account with them. When you create an account, Google will give you 15GB of free storage to use across Google Drive, Gmail, and Google Photos. There are options to increase that storage space later.

1. Store Image in Google Drive

2. Get Share URL

You can get the Share link either from the website or from your computer/mobile device.

~~~~~~~~~~~

Website:
R-click on File in browser >> Get Shareable Link
https://dl.dropbox.com/s/jqjwz4j1loyhzcx/GP_GD_GetShareableLink.png

Copy URL
https://dl.dropbox.com/s/vgejbaq6glsz13p/GP_GD_WebCopyLink.png

The link is now in your clipboard. Proceed to Step 3.

~~~~~~~~~~~

PC:
R-click on File >> Google Drive >> Share
https://dl.dropbox.com/s/b0j0mzumfdxp1te/GP_GD_RClick.png

Copy URL
https://dl.dropbox.com/s/0f0m7y3b33ewtmm/GP_GD_ShareWithOthers.png

The link is now in your clipboard. Proceed to Step 3.

~~~~~~~~~~~


3. Modify URL

Change open? in the URL to uc?export=view&

https://drive.google.com/open?id=0By4ZjOjkb36lTWRLQkpVQ3N5Wmc

Becomes

http://drive.google.com/uc?export=view&id=0By4ZjOjkb36lTWRLQkpVQ3N5Wmc



You're now ready to insert your image into your post!
Last edited March 19, 2017 4:43 pm
Jul 15, 2016 5:58 pm
You can search for an image on the internet or find an image on a website, then copy it's URL to put it into your post.

In Chrome, r-click on the image >> Copy Image Address
https://dl.dropbox.com/s/m5z4f1vvzd3l87c/GP_Chrome_ImgURL.png


In IE, r-click on the image >> Copy
https://dl.dropbox.com/s/btvmqwe1zwhrt28/GP_IE_ImgURL.png


In Firefox, r-click on the image >> Copy Image Location
https://dl.dropbox.com/s/ytx7i9dep5y0bgg/GP_FF_ImgURL.png
Last edited March 19, 2017 4:44 pm
Jul 15, 2016 6:06 pm
@Keleth, is there any other storage location you'd like me to document? I took a look at OneDrive, but they aren't very friendly to allowing files stored there to be embedded. Eg, I had some .jpgs that would work fine while others didn't, I couldn't get a .png to work, and other sites/forums indicate it shouldn't work at all.
Jul 15, 2016 6:11 pm
You've covered all the ones I can think of!
Jul 24, 2016 3:03 am
I really like this post, and when I first signed up for GP I was a little confused about how to handle sharing images. This is really worthwhile information for people on the site, thank you for making it.

The one thing I saw that I might add is that people need accounts with Dropbox and Google to be able to make use of the services outlined here. This probably wouldn't require more than a couple lines to address.
Jul 25, 2016 6:48 pm
Phil_Ozzy_Fer says:
I really like this post, and when I first signed up for GP I was a little confused about how to handle sharing images. This is really worthwhile information for people on the site, thank you for making it.

The one thing I saw that I might add is that people need accounts with Dropbox and Google to be able to make use of the services outlined here. This probably wouldn't require more than a couple lines to address.
You're very welcome! And good catch on adding account creation text and links. I'll get those added.
Jul 25, 2016 7:00 pm
I was going to post instructions on using Photobucket, but my browser poofed my work in progress. I'll try to provide that tonight.

Edit: Photobucket began demanding money from me for even basic usage, so it ceased to meet my needs.
Last edited September 23, 2017 4:14 pm
Jan 6, 2018 4:09 pm
I was attempting to follow the instructions to share from Google Drive. I get the link to share, but when I go to modify it, there is no "open?" in the URL to modify. Here is the image file I was attempting to embed:

https://drive.google.com/file/d/1Pye_3oEWSu62GsFn3PnEUDCdjDGYU_xo/view
Jan 6, 2018 10:16 pm
I followed your URL, right-clicked the image and selected "Open image in a new tab." I then used the URL that I got from the new tab that displayed the image.

https://lh5.googleusercontent.com/IOvSw7q0jvL7KXKiFyXvjM9BuLKOhd7GMMyrxg98qw0-Hf-PVOYGblQ_28grcju29MkrxP2eu5Jwne-oRvZS=w1280-h637-rw
Last edited January 6, 2018 10:18 pm
Jul 4, 2018 2:14 pm
Sadly, all of the images on this thread are no longer showing...
Jul 4, 2018 7:28 pm
Yeah, I've been using tinypic.com. It's got ads everywhere, but it allows for some resizing which is nice.
Jan 30, 2019 1:21 am
I've been using Pasteboard for anything I need to show. Links last long enough that I've yet to see a broken link, but I don't know the actual cutoff range.
Last edited January 30, 2019 1:21 am
Jan 30, 2019 1:24 pm
Imgur is my new go-to for this sort of thing. Easy upload and then just copy and paste the direct link and you're set. I've not run into any issues with images disappearing.

Below is: "[*img*]https://i.imgur.com/yMXbNGG.png[*/img*]" (minus the leading and trailing asterisks)

https://i.imgur.com/yMXbNGG.png
Last edited January 30, 2019 1:25 pm
load next

You do not have permission to post in this thread.