Uploading images

Admin Requests, General Enquiries and Forum Issues
Post Reply
User avatar
coulomb
Site Admin
Posts: 3638
Joined: Thu, 22 Jan 2009, 20:32
Real Name: Mike Van Emmerik
Location: Brisbane
Contact:

Uploading images

Post by coulomb » Sat, 15 Dec 2018, 06:56

Uploading or Attaching Images to Forum Posts

This is an update to my New Forum Tips post. It's specifically oriented to uploading images, since this seems to be the thing most new (and a few seasoned) users have trouble with. Hopefully, it will be easier to find, too.

When posting an image, there are basically two ways to go:
  • Host it on a third party image hosting site such as imgur.com, or
  • Upload it to the AEVA server, by dragging and dropping it into your post.
My suggestion is that unless you have a good reason to use a third party image hosting site (e.g. you're already blogging your project there), then you may as well use the AEVA server. That way, your image will always exist, regardless of what happens to the third party site, as long as the AEVA forum exists. I find it really irritating to find a great post, and half or more of the images are broken for whatever reason.

For uploading images to the AEVA server, see the post after next.

Third Party Image Hosting
It's up to you to choose your hosting service, register with them, and get your images uploaded there.

Here is the number one thing to keep in mind when attempting to link to an image not stored on the AEVA server:

You have to link to an image, not a web page.

You might think that a page like this example one is practically just one image. Maybe to you, but to the forum software, it's completely different. It's a HyperText Markup Language (HTML) text file, with a tag buried in it somewhere that has a link to the actual image. Notice in the screenshot below that besides the image, there are various bars, a link to Facebook, often there are advertisements, etc. If you are in a screaming hurry and don't want to do the below, use URL tags instead of IMG tags around the URL to the whole web page. Readers will have to click on the link, but then they'll actually see the image (along with banners and advertisements etc), and not just the "broken image" icon.

For your image to embed and display properly, you have to get to the actual image itself. In Firefox and many other browsers, you can use the right mouse button to bring up a "context menu", and select "Copy Image Location".

Firefox context menu.jpg
Firefox context menu.jpg (165.89 KiB) Viewed 550 times
Now you have the URL to your actual image. To check this (you won't need to do this checking every time), open a new tab and paste the URL.

Firefox image test.jpg
Firefox image test.jpg (78.91 KiB) Viewed 550 times
Notice that the URL ends in .jpg (it could be .jpeg or .png or .gif etc). That tells you it's a real image, though sometimes it's not so easy to tell from the URL. Also, you see just the image, and nothing else (other than a border in this case). Also notice that in my example the URL is fairly compact. I like that about Imgur; the URLs for sites like Google Images can be 8 lines of text!

The Chrome browser doesn't have a "Copy image URL" context menu, but you can do the same thing with the "Open image in new tab" context menu. Go to the new tab by clicking on it; it is usually the next tab after the current one (which is always highlighted).

As a third alternative, specific to Imgur.com only, you can use their provided facility:

Imgur share menu 1.jpg
Imgur share menu 1.jpg (67.22 KiB) Viewed 543 times
This leads to the following; pressing the Copy button highlighted gives you the URL of the image with [img] and [/img] tags already attached. You may wish to edit these tags to image=512 (for example) and /image respectively.

Imgur share menu 2.png
Imgur share menu 2.png (27.04 KiB) Viewed 545 times

Ok, so we still have the URL to the image in the clipboard, and we know it's a good URL. To link to the image in an AEVA post, merely paste the URL between IMG tags. The easy way to do that is to use the image toolbar button (highlighted in green below) at the top of the edit window (you may need to scroll your screen to see it; note that there are two scrollbars when composing a post).

AEVA compose toolbar.png
AEVA compose toolbar.png (29.38 KiB) Viewed 543 times
Notice that the text cursor is between the two img tags, ready to paste the URL. Use Ctrl+v (control-v, or whatever your browser uses for paste). Of course, if you used Imgur's BBCode (Forums) method above, you merely paste the URL, and don't use the image toolbar. It should end up like this:
[img]https://i.imgur.com/IvRi39L.jpg[/img]
I've inserted special tags to show what you what it will look like when composing. When I take these tags out, the image itself will appear:

Image

For advanced posters: How do I post BBCode examples without them being interpreted? I use empty italics tags inside the Image. How did I post that example then? I used empty italics tags inside the tag to disable it from being active! You can generate empty italics tags by clicking the I icon at the top of the editor.


Often the image will display too large; images from megapixel cameras can be really huge. To fix this, use the other image toolbar button, the one that says "image=" (highlighted in blue). The image= should be followed by a number, being the desired display width of the image, in pixels. For example:

[image=320]https://i.imgur.com/IvRi39L.jpg[/image]

comes out like this:




[ Edit: Many revisions resulting from excellent suggestions from Weber. Thanks! ]
Nissan Leaf 2012 with new battery May 2019.
5650 W solar, PIP-4048MS inverter, 16 kWh battery.
1.4 kW solar with 1.2 kW Latronics inverter and FIT.
160 W solar, 2.5 kWh 24 V battery for lights.
Patching PIP-4048/5048 inverter-chargers.

User avatar
brendon_m
Groupie
Posts: 261
Joined: Sat, 28 Oct 2017, 11:00
Real Name: Brendon McCarrol

Re: Uploading images

Post by brendon_m » Sat, 15 Dec 2018, 07:19

I'm assuming the permissions have changed because I previously never had the hamburger icon to get to attachments in the member machines area but I do now. I think that may have been the stumbling block for a lot of people.

User avatar
coulomb
Site Admin
Posts: 3638
Joined: Thu, 22 Jan 2009, 20:32
Real Name: Mike Van Emmerik
Location: Brisbane
Contact:

Re: Uploading images

Post by coulomb » Sat, 15 Dec 2018, 08:01

Posting an Image via Attachment

When composing a post and you're ready to place an image, by far the easiest way is to locate the image file using a file explorer, and dragging the image to the edit window. This will make the Attachments tab the active tab, though if you want to place the image inline (as opposed to leaving it as a thumbnailed attachment), you may still have to scroll down to the attachmnents area, which is under the Submit button. If necessary, use the browser's scrollbar (drag the scrollbar down). Note that the edit window, when it's full enough, has its own scrollbar, but that only scrolls the text in the edit window.

Note: if you use the "Place inline" button, just before you click that button, scroll to the edit window and place the cursor where you want the image to be placed. Then scroll back to the Place Inline button and click it. If you don't do this, often the attachment is placed at the end of the post. If that happens, find the attachment text, highlight it, and use Cut and Paste to place it where you want it.

You can inline other files if you want, like this:
BMU.zip
Example attachment; I can't even remember what's in this
(66.95 KiB) Downloaded 22 times
brendon_m wrote:
Sat, 15 Dec 2018, 07:19
I'm assuming the permissions have changed because I previously never had the hamburger icon to get to attachments in the member machines area but I do now. I think that may have been the stumbling block for a lot of people.
Yes, hopefully that's sorted now. If your Attachments tab is still missing (and you are using the browser's scrollbar to see the end of the browser's page), post here and hopefully our webmaster can sort it out.
Nissan Leaf 2012 with new battery May 2019.
5650 W solar, PIP-4048MS inverter, 16 kWh battery.
1.4 kW solar with 1.2 kW Latronics inverter and FIT.
160 W solar, 2.5 kWh 24 V battery for lights.
Patching PIP-4048/5048 inverter-chargers.

Post Reply