Tutorial on Adding Images to Messages
Other tutorials on enhancing messages:
HTML (advanced) |
CSS (advanced)
This tutorial covers how you can display an image, hosted anywhere on the internet, in a message you post at CaneTalk. While this tutorial is long, the process is actually very simple.
The first step is getting the link (also known as an URL - uniform resource locator) to the actual image rather than using the link of the page that the image is on.
To view a tutorial on how to enhance text in your message, click
here for a tutorial on the types of HTML (HyperText Markup Language) we allow.
If you have an image file on your computer you are looking to upload, like an image from your camera, use an image-sharing website to upload the image to their site. Wikipedia has a list of some of the most popular ones
here. Then you can use the link to that image here at CaneTalk. If logged in with cookies, you can also upload an image to Imgur, an image sharing site, from below the message box at CaneTalk. Once you click "Image" below the message box, you'll find the "Upload an Image to Imgur" option.
Step 1
Simply right click on the image you want in your message and in the context menu that pops up, click "Copy image address" if you are using Google Chrome, click "Copy Image Link" if you are using Firefox, or click "Copy image link" if you are using Microsoft Edge.
Step 2
You now have the link to the image saved to your clipboard, which is where that data you copy resides until you copy something else or you restart your computer. You now want to visit CaneTalk to post a message. Keep in mind that when you post a message at CaneTalk you have the option of previewing your message first. This allows you to make sure your post looks the way you want it to. To display an image at CaneTalk you can do it using the below methods.
Method 1
The easiest way to include an image is to simply paste the link to the image in your message and leave the "Display images from image links" option checked in the "Automatic Options" section. This option works in most cases. If it doesn't, you will need to use one of the other methods on this page and unselect the automatic option. For this option to work best, make sure that each image link is on its own line in your message. Preview your message to ensure that your images are displayed correctly.
Method 2
The next easiest method is to left click on "Image" below the large text field where you type your message. Once you do that a small text field will appear below that has an "https://" in it. Right click inside that text field. If the "https://" does not disappear when you do, instead left click first inside that text field and then when the "https://" goes away, right click inside that text field. Once the context menu pops up you should see "Paste". Left click on that. Once you do, the link to the image should now have been pasted into (added into) the text field. The final step is to click the "Add" button to add the image to your message. The link to the image will now have been added into the large text field that contains your message along with some code around it that tells our system to display that image. You will notice the small text field now contains "https://" again, ready for you to add another image if you like. You can add as many images as you like.
Method 3
Another method is the manual method to what was done in method 2. You can manually type the forum image tags around the link to your image:
[img]https://canetalk.com/images/lightning.jpg[/img]
Method 4
This method is the technical way. You can actually post the HTML code for displaying an image which is in this format:
<img src="https://canetalk.com/images/lightning.jpg"/>
"img src" stands for "image source" and this line of code is what literally displays an image on a web page. The previous methods use a nicer looking format that our system uses to eventually process it into this HTML code which actually displays the image on a page. You can learn more about this technical method on our HTML tutorial page
here.
Some Notes
The safest way to get the link to an image is by following the instructions in step 1. Sometimes you may be deceived into thinking that there is nothing else on the page other than an image. Rather than take a chance in using the link to the page, simply follow step 1 each time. Even when a link ends with an image extension like ".jpg", ".png", or ".gif", it may not actually be the link to the image itself. Wikipedia is a good example of that situation. The link to an image's page at Wikipedia ends with an image extension but it is actually a page. To get the link to the image, you need to follow the instructions in step 1.
Because CaneTalk uses a secure connection ("https"), we require all images that are embedded in your message to be hosted on a site that also uses "https". Any image you try to embed that has a link that starts with "http" will not be embedded in your post and will instead remain a link.
Please try to avoid having an image with a large file size, or a lot of images that add up to having a large file size, load inside your message. It uses a lot of bandwidth on the site you are loading the image from. A 5MB file viewed two hundred times at CaneTalk will use 1GB (1,000MB) of bandwidth on the site hosting that image. If a lot of sites do that, the site hosting the image may not be able to handle that much traffic. It is better to provide a link to the image so that people can choose to view it, and therefore load it, only if they want to view it. Large image files also take a lot of time to download for people who do not have broadband. While the image may load extremely fast for you, it could take a half hour for someone not using broadband. It can also be costly for people who are using a mobile device to download a lot of content over a cellular network if they don't have an unlimited data plan. If you have an image that you would prefer to link to, uncheck the option to display your images automatically from links.
Some sites do not allow their images to be displayed on other sites. They have disabled
inline linking. (also known as hotlinking) For these kinds of sites people will be unable to see the image in your message and you will instead have to link to the page the image is on. You may not even be aware of this problem. The reason is that if you look at an image at a site that disables hotlinking by getting to the image through their site, when you try to view the image inside your post at CaneTalk you will actually see the image because it exists in your web cache. The web cache is a place where data is stored so that if you visit the image again in the future the image does not have to be downloaded again. If someone says they can't see the image you posted, and you can, it may be for this reason.