Site Toolbox II: Images and Video

This thread will contain information/instructions on posting images and video on the site so if you have any wishlist please pm me. As it's a sort of guide, if you need to give feedback then don't hesitate to PM me with your problems/difficulties/bile etc.

There should be another guide coming along soon about using offsite technomechanical systems so if there is anything you might need to know about using an item of technology that involves posting here (a video camera, mobile phone etc.) then please pm me and I'll put a wishlist together and then give it to EvotingMachine0197.

The link below is a thread for posting anything as a test or for playing around and has also been used for asking questions about your own computer problems.

Sandbox thread for messing around in

While editing, if you click on the last A/A button you see either the code behind an effect or the effect itself i.e. an image, a video, a link. When the button is grey you see the code, when the button is pink you see the effect. The button is grey for this exercise - I find it easier to edit but there is one drawback - if you insert a new image etc. it will appear at the end of the post not at the cursor where it should.

Images A and B are the same editor with the A/A switched on/off. The first is a lot less crowded. The thick red and blue underlines were done by me in an editor

A


B


Other effects with the button switched off

For this exercise I went to Google, clicked on Images and typed in the word 'valves'. I got the page below.


I'd like the one near the bottom measuring 280 x 257 as it's small so this is how I go about getting it:


1) When you hover your mouse over it the mouse pointer will indicate that the picture is actually a link to something. Hopefully if we click we'll find a picture and not something else.

When we click we find there's two pictures of it and one is still a link so click again on the top image which goes to a final image that is not a link. Here:




2) Once you've clicked on the top image, right-click and select Properties like this:




3) You will get a Properties panel and you need to copy the URL address as in the screenshot below - highlight, right-click, copy




4) Now you have the address/image you need to paste it here. You can type it in manually between the img /img tags or you can select the little telly button, paste your image there and press ok...



Which is how these images were all pasted here including the original one

This is how you put a youtube video into a post although it should work for any video embed code - yahoo google whatever.

If you are a user of youtube you will be familiar with the below screen. On the right you will see embed code simply highlight and copy that code then paste it in your post.

I refer you to the A/A post above about the code view button - I find it easier to switch that code button to grey not pink when you are posting so you can see your embed code. When the button is pink you can't see the code you see the video instead. Get used to the code because it is less buggy than the other way. You'll have a few more surprises if you use the A/A button (the final one) on pink - your youtubes will disappear from time to time. Get used to the embed code.

Copy


You will see the embed code on the next post...

The embed code will look like this while you are posting once the A/A button is switched to grey.

<object width="425" height="355"><param name="movie" value="https://www.youtube.com/v/VOJLqdcJZJ0&hl=en"></param><param name="wmode" value="transparent"></param><embed src="https://www.youtube.com/v/VOJLqdcJZJ0&hl=en" type="application/x-shockwave-flash" wmode="transparent" width="425" height="355"></embed></object>

If not you will see the video itself.

Anywhere you see embed like this to copying and pasting into a post should produce an embedded video.

There's an easier way of course which I inconveniently forgot to mention last time - using the green celluloid button


pasting the address you got like this into that box


break out the vodka

A simple way to embed YouTube videos is to surround the url(rather than the embed code) with [youtube][/youtube] tags like this for example:



It saves time and effort.

[quote="Ard-Taoiseach"]A simple way to embed YouTube videos is to surround the url(rather than the embed code) with [youtube][/youtube] tags like this for example:

[youtube]www.youtubeurl.com[/youtube]

It saves time and effort.[/quote]
Very true if you are comfortable with this. However there seems to be an issue with links that are "related" in youtube i.e. the little links you see on the right on the youtube page - it doesn't seem to work. Here are two examples with HTML disabled for this post (I'll enable it for the quote of this)

[youtube]https://www.youtube.com/v/nKn2xTo2HA8[/youtube]

[youtube]https://www.youtube.com/watch?v=pQAUzPhz_v4&feature=related[/youtube]

Ard-Taoiseach wrote:

A simple way to embed YouTube videos is to surround the url(rather than the embed code) with [youtube][/youtube] tags like this for example:



It saves time and effort.

Very true if you are comfortable with this. However there seems to be an issue with links that are "related" in youtube i.e. the little links you see on the right on the youtube page - it doesn't seem to work. Here are two examples with HTML disabled for this post (I'll enable it for the quote of this)

This is the button you need for uploading an image from your own computer:


Pressing it will allow you to look through your machine for your file. When you've found it, resize it to 640 for this website like this and then press 'host it'



After a short while of uploading your computer will produce an address of where the file has been uploaded to (an image server). Copy and paste this address into the other little monitor button which basically puts the image tags around that address


Have a try and let me know how it goes.[/quote]

If you are using the above to upload the autograph image then you don't have to resize it to 640 - leaving it at 800 should be ok.