On 11/15/2013 06:06 PM, Reinhardt Christiansen wrote:

I would like to add "frames" to some of the graphics I'm using on a website. The frame I want is really just a white border of 8 or 10 pixels on each of the four sides; the pictures will all be rectangles.

I tried doing a frame like this in Gimp 2.8 (in Windows 8) earlier today and couldn't think of a way to do this very easily. I thought about drawing a white line along the edge of each side of the rectangle but didn't know a good way to draw a straight line of the desired thickness exactly where I want it. I thought about using the eraser to turn the edges white but that seemed clumsy.

I'm guessing there is a much simpler way so I hope someone can tell me what it is. :)

Hi Reinhardt,

I have a need for a similar type of thing, so I have a little experience with it.

HOWEVER, first of all, if the purpose of this is for using the pictures on a website, you should probably consider if you want to do this task with HTML and/or CSS and NOT modify the pictures (if _you_ control the HTML/CSS being used on the page). The framing is really nothing to do with the pictures, it is a matter of who you want them presented on a particular web page. What happens if you want to use the same picture in some other manner, in some other place, with some other type of frame or no frame at all.

However, if you still want to alter the image...

First of all, if it were me, I would COPY all the images to a new folder and do this work on the copies. I would not muck up the original images with something like a "frame".

Secondly, if your images are in a "lossy" format such as JPEG/JPG, I would seriously consider in that "copying" process, actually saving-as (exporting) the original files to a non-lossy format (such as TIFF/TIF -- maybe somebody will recommend a less bulky format). Then do all your frame-adding, editing in that COPY that is in the NON-lossy format. Then, after all editing is done, save-as (export) from the non-lossy format to the JPEG/JPG or GIF or PNG or whatever format you are using on the website. If in the future you have to do any more editing on those images, edit the NON-lossy version and re-save-as (export) to the lossy format. (PNG is non-lossy and could be used throughout, but it may not be a suitable format for your type of images).

Following those kinds of procedures will insure that you don't unintentionally degrade the quality and it will give you back-up original files that you may someday be very thankful that you have.

Given all that, what I would do -- and it may not be the best way -- is to:

1) Set the background color to white (or whatever). In the tool box, there is a foreground/background selector. There is a force-to white/black button, a flip white/black back-and-forth button, and clicking on the main area will put you into a dialog where you can select any color you want.

2) Expand the canvas to a larger size. Image, Canvas Size... In that dialog, you want to a) change the size by the total number of pixels needed; b) click the "Center" button to auto-center the image on the canvas; c) In the resize layers drop-down select ALL LAYERS (even if you don't have multiple layers this is probably a good idea based on the problems I have run into). Doing this should give you a white fill on the new area surrounding the centered image.

Lastly, it sound like you are somewhat new to Gimp and thus I feel you pain. I have been there. The way you asked the question suggests that you may not yet have a good enough grounding of Gimp basics (such as images are areas within a canvas -- the image and the canvas are two different things). You would probably greatly increase your enjoyment of Gimp and your productivity using Gimp if you Googled on Gimp overview or Gimp tutorial or something to just spend 10 minutes going through the Gimp ways of doing things. I came to Gimp from Photoshop and I had to learn/re-learn lots of these concepts myself.

Best of luck.

Jay

* Reinhardt Christiansen [11-15-13 18:13]:

I would like to add "frames" to some of the graphics I'm using on a website. The frame I want is really just a white border of 8 or 10 pixels on each of the four sides; the pictures will all be rectangles.

I tried doing a frame like this in Gimp 2.8 (in Windows 8) earlier today and couldn't think of a way to do this very easily. I thought about drawing a white line along the edge of each side of the rectangle but didn't know a good way to draw a straight line of the desired thickness exactly where I want it. I thought about using the eraser to turn the edges white but that seemed clumsy.

I'm guessing there is a much simpler way so I hope someone can tell me what it is. :)

Have a look at ImageMagick.

(paka)Patrick Shanahan       Plainfield, Indiana, USA          @ptilopteri
http://en.opensuse.org    openSUSE Community Member    facebook/ptilopteri
http://wahoo.no-ip.org        Photo Album: http://wahoo.no-ip.org/gallery2
Registered Linux User #207535                    @ http://linuxcounter.net

I would like to add "frames" to some of the graphics I'm using on a website. The frame I want is really just a white border of 8 or 10 pixels on each of the four sides; the pictures will all be rectangles.

I tried doing a frame like this in Gimp 2.8 (in Windows 8) earlier today
and couldn't think of a way to do this very easily. I thought about drawing a white line along the edge of each side of the rectangle but didn't know a good way to draw a straight line of the desired thickness
exactly where I want it. I thought about using the eraser to turn the edges white but that seemed clumsy.

I'm guessing there is a much simpler way so I hope someone can tell me what it is. :)

1.

Open image

Select->All Select->Shrink (Select pixel size of shrink) Ctrl+I (invert selection)
Bucket fill (Fill whole selection)

2.

Open image

Filters->Decor->Add Border

Owen

You can use this step :
1. Ctrl+A to select the whole pict
2. Use menu "select --> border", set the thickness (in pixel) 3. Create new transparant layer
4. Fill with color (ctrl + .)
On Nov 16, 2013 6:37 AM, "Patrick Shanahan" wrote:

* Reinhardt Christiansen [11-15-13 18:13]:

I would like to add "frames" to some of the graphics I'm using on a website. The frame I want is really just a white border of 8 or 10 pixels on each of the four sides; the pictures will all be rectangles.

I tried doing a frame like this in Gimp 2.8 (in Windows 8) earlier today and couldn't think of a way to do this very easily. I thought about drawing a white line along the edge of each side of the rectangle but didn't know a good way to draw a straight line of the desired thickness exactly where I want it. I thought about using the eraser to turn the edges white but that seemed clumsy.

I'm guessing there is a much simpler way so I hope someone can tell me what it is. :)

Have a look at ImageMagick.

-- (paka)Patrick Shanahan Plainfield, Indiana, USA @ptilopteri http://en.opensuse.org openSUSE Community Member facebook/ptilopteri http://wahoo.no-ip.org Photo Album: http://wahoo.no-ip.org/gallery2 Registered Linux User #207535 @ http://linuxcounter.net _______________________________________________ gimp-user-list mailing list
List address: gimp-user-list@gnome.org List membership: https://mail.gnome.org/mailman/listinfo/gimp-user-list

On 11/16/2013 12:06 AM, Reinhardt Christiansen wrote:

I would like to add "frames" to some of the graphics I'm using on a website. The frame I want is really just a white border of 8 or 10 pixels on each of the four sides; the pictures will all be rectangles.

I tried doing a frame like this in Gimp 2.8 (in Windows 8) earlier today and couldn't think of a way to do this very easily. I thought about drawing a white line along the edge of each side of the rectangle but didn't know a good way to draw a straight line of the desired thickness exactly where I want it. I thought about using the eraser to turn the edges white but that seemed clumsy.

I'm guessing there is a much simpler way so I hope someone can tell me what it is. :)

To add an 'external' border that doesn't cover any part of the current image:

- "Image/Canvas size", and in that dialog: -- make sure hieght/width are not chained (chain link icon next to them should be open, otherwise click on it) -- add twice the required border width in both width and height. In Gimp 2.8 you can let Gimp compute the values for you, you can replace, say, '800' by '800+2*20' and Gimp will compute the answer for you. -- click the "center" button to center you current layers in the new canvas size
- Now your image is in a bigger canvas, with transparency around it (checkerboard pattern)
- Add a new layer to the image, filled with white, and move it to under the image layer(s)

On Fri, 2013-11-15 at 18:06 -0500, Reinhardt Christiansen wrote:

I would like to add "frames" to some of the graphics I'm using on a website. The frame I want is really just a white border of 8 or 10 pixels on each of the four sides; the pictures will all be rectangles.

Use CSS, border: 8px solid white;

If you really want to add borders to the images themselves, fx-foundry adds menu items to do it easily. Make sure you work on copies of your images.

Liam

Liam Quin - XML Activity Lead, W3C, http://www.w3.org/People/Quin/
Pictures from old books: http://fromoldbooks.org/
Ankh: irc.sorcery.net irc.gnome.org freenode/#xml