How to put an image in a post

SavvyAdmin · Site Admin Joined: 31 Mar 2007 Posts: 22

When talking about a sewing project or about a fabric or button in our collections, you may want to share a photo in your post. There are two ways to do this:

I. Using 'Img': If the image you want to use already exists somewhere on the web (for example, a product image from sawyerbrook.com or distinctivebuttons.com), you can simply create a reference to the existing location.

Find the location of the image. To keep your Salon window available, open a new window (or tab) in your web browser (under the File menu, or CTRL-N). In the new window, go to the web page where the image resides. Right-click on the image and choose Properties. Look for the field called "Address" (or "Location", depending on your browser). This is the web location (URL) of the image. You can highlight the entire address with your mouse and copy (CTRL-C) it to your clipboard.
Insert the URL into your post. When writing up your post in the Salon, simply paste (CTRL-V) the address (URL) into the body of your message. Then highlight it with your mouse and click the "Img" button (you'll see it beneath the Subject field). This will create img tags on either end of the address. Once you finish writing your post and you submit it, the image will appear exactly where you pasted the address. (To check this before submitting, you can use the "Preview" option.)

In your edit window, the code will look like this:

Code:

[img]http://www.sawyerbrook.com/images/topbanner1.jpg[/img]

For more information on this BBCode technique, see this FAQ.

II. Using Attachments: If you have an image of your own that you want to upload and share, you can attach it to your post.

Browse for the file on your computer. At the bottom of the editing window for your post, there will be a section called "Add and Attachment." In the filename field, click the browse button and find the image on your computer. When you click "Open," the location of the file will appear in the field. Note: Make sure that your filename does not have any spaces in it (it's best to stick to all alphanumeric characters, though dashes and underscores are okay, too).
Add comments and upload. Write a brief comment to identify the subject matter of the image for others. Then click "Add Attachment" to upload the file. After a few moments, the file will appear in the attachments section of the editing screen. Finish writing you post, and submit it.

Attached images will appear at the bottom of your post.

Note: The size of image file is limited to 256KB in order to make sure that there is room on our server for everyone. If your image file is too big, you will have to reduce the size of the image or save it at a lower quality.

For more information on attachments, see this FAQ.

Important: Please observe this guideline from our "Forum Etiquette":

zigzagger · Joined: 07 Jun 2007 Posts: 54 Location: Massachusetts

Help!

I posted a picture on the What About Buttons? forum, but it came out gigantic, and I can't figure out how to edit it! it's on the creative button application topic. Please help!

SavvyAdmin · Site Admin Joined: 31 Mar 2007 Posts: 22

Hi zigzagger,

Once you post an attachment, there aren't many options for editing it, but you can always upload a new, edited file. If you find an image is too large, you can edit the original file on your computer (using a graphics editor like MS Paint, or one of the tools provided with most digital camera software packages). For most browsers, an image width of 600 pixels should be plenty large enough to see. (Most digital cameras these days take pictures at a dimension of thousands of pixels, which is why the show up huge when unedited.)

Once you've edited your image to the desired size, you can save it under a new file name and upload it again as an attachment to your original post. (You can edit your own posts by clicking the "edit" button at the top right side of the post.) When the new image is uploaded, you can also delete the older attachment from the same screen. Click submit, and your changes will be made.

Hope this helps others with their attachments, too!

-SavvyAdmin
(PS: zigzagger, I noticed that you must have figured this out on your own before I even got around to answering!)

SavvyAdmin · Site Admin Joined: 31 Mar 2007 Posts: 22

Troubleshooting: I inserted the web address of my photo and used the img button, as described in the first method above, but my image doesn't show up in the post.

A member contacted us with this problem recently. The solution is to make sure that the web address you are using points to the image file itself, not just to a web page where the image is displayed.

(Beginner note: Web pages usually have addresses that end with '.html' or '.htm'. These pages display a combination of text and images, also sometimes videos or other media. Image files exist separately from the web page where they are displayed, and they have their own addresses, which usually end in '.jpg' or '.gif'.)

The img button only knows how to display the image file itself, so it is important to use the address for the image file and not for a web page that displays this file. (Web pages often display a number of different images, so the img button won't know which one you want it to show.)

From a web page where the image is displayed, you can find the address of the image file. Simply put your mouse cursor over the image, and click the right mouse button. From the menu that appears, choose 'Properties.' You will see a field called 'Address' (or in Firefox, 'Location'). That is the address/location of the image file. You can highlight it and copy (CTRL-C), then paste (CTRL-V) into your post to use with the img method above.

Another simple alternative is to download the image to your computer (again, right-click it, but this time 'Save Picture As...' in Internet Explorer or 'Save Image As...' in Firefox). Then upload it as an attachment using the second method above.