Results 1 to 15 of 15
  1. #1
    Join Date
    May 2008
    Location
    London
    Posts
    206

    Have designed a button in photoshop..how do i save the button and not the whole page

    this picture should help explan it

    http://i42.tinypic.com/smt4c6.jpg

    so i have the button and i want to save JUST the button and not the whole dimesions of the page, when i flatten image to try and save it, the background just turns white and it ends up saving the whole page

    also i want to add some twirly graphics to the button, how do i extract the button with the twirls that are inside the button and leave out the rest that are on the transparent background

    http://i40.tinypic.com/2zsa879.jpg

    any ideas anyone

    much appreciated.
    Last edited by Beatplexity; 05-10-2010 at 01:00 AM.

  2. #2
    Join Date
    Jan 2010
    Location
    good ole UK
    Posts
    341
    First you need to remove the excess of swirl pattern from the button:

    select the button outline layer in the layers pallette, then goto Select -> load selection, in the top menu, the buttons outline should now be selected with the dashed line. Then goto Select -> Inverse, this will select the area outside the button outline.

    Go to the layers pallette again and select the swirl pattern layer and just hit delete on the keyboard. Now that should of removed all of the excess pattern outside the button outline.

    Remove the selection, Select -> Deselect

    Now you need to remove all background and just leave the button, Goto the top menu, Image -> Trim. Based on transparent pixels, top, left, bottom and right.

    Now you can save your button. File -> save for web and devices.
    I H4t3 l33T, l33T i5 4 l053r5!
    ██
    ███
    ████ Personally I'm always ready to learn, although I do not always like being taught.

  3. #3
    Join Date
    May 2008
    Location
    London
    Posts
    206
    thanks for the tip - ive managed to do this but now it seems that some pixels are making this look slightly off

    how can i change the pixels in the image below to the colour they should be?

    http://i42.tinypic.com/30jpaf6.jpg

    oh also i have saved the image as a png, what difference does saving it for web do instead of just normal 'save as' ?

  4. #4
    Join Date
    Jan 2010
    Location
    good ole UK
    Posts
    341
    Sorry I'm not sure what you mean? The saving for web and devices will allow you to choose different settings/formats and will optimize the size for the web.
    I H4t3 l33T, l33T i5 4 l053r5!
    ██
    ███
    ████ Personally I'm always ready to learn, although I do not always like being taught.

  5. #5
    Join Date
    May 2008
    Location
    London
    Posts
    206
    if you look at the image i posted you will understand - http://i42.tinypic.com/30jpaf6.jpg

    the light coloured border that runs around the button is being overlapped by some of the swirl and it makes the button look wrong
    Last edited by Beatplexity; 05-10-2010 at 03:38 AM.

  6. #6
    Join Date
    Jan 2010
    Location
    good ole UK
    Posts
    341
    Ok so you want to change it so the border has no pattern overlapping is that correct?
    I H4t3 l33T, l33T i5 4 l053r5!
    ██
    ███
    ████ Personally I'm always ready to learn, although I do not always like being taught.

  7. #7
    Join Date
    May 2008
    Location
    London
    Posts
    206
    yes, the border needs to be the same colour and not have bits of the twirl pattern overlapping it

  8. #8
    Join Date
    Jan 2010
    Location
    good ole UK
    Posts
    341
    Without actually having the psd, its difficult for me to say. Where does the border come from?
    I H4t3 l33T, l33T i5 4 l053r5!
    ██
    ███
    ████ Personally I'm always ready to learn, although I do not always like being taught.

  9. #9
    Join Date
    May 2008
    Location
    London
    Posts
    206

  10. #10
    Join Date
    May 2008
    Location
    London
    Posts
    206
    ok ive managed to fix it, i was just selecting the wrong layer for editing

    still getting my head around ps haha.....thanks for the help

    finished button -

    http://i5.photobucket.com/albums/y15...adbutton-1.png

  11. #11
    Join Date
    Jan 2010
    Location
    good ole UK
    Posts
    341
    I H4t3 l33T, l33T i5 4 l053r5!
    ██
    ███
    ████ Personally I'm always ready to learn, although I do not always like being taught.

  12. #12
    Join Date
    Jan 2010
    Location
    good ole UK
    Posts
    341
    Very Nice!
    I H4t3 l33T, l33T i5 4 l053r5!
    ██
    ███
    ████ Personally I'm always ready to learn, although I do not always like being taught.

  13. #13
    Join Date
    May 2008
    Location
    London
    Posts
    206
    thanks for the help Driver, this is the first thing ive ever created in photoshop

  14. #14
    Join Date
    Jan 2010
    Location
    good ole UK
    Posts
    341
    my pleasure.
    I H4t3 l33T, l33T i5 4 l053r5!
    ██
    ███
    ████ Personally I'm always ready to learn, although I do not always like being taught.

  15. #15
    Join Date
    Oct 2002
    Location
    /roof/ledge
    Posts
    28,089
    As an alternate method:
    Regarding the "swirly pattern", rather than select and delete, simply stack that pattern layer directly above the button graphic (the rectangle) layer, and while holding ALT click the bar in between the two. That makes it a clipping layer, and everything outside of the lower graphic will not be visible. It is still there, and movable, making it far more versatile if you decide to change things around.

    So in the layers pallette, border layer above all, then the swirl layer, then the button rectangle layer. Clip the swirl to the rectangle.
    Your one stop shop for decentralization

Similar Threads

  1. Replies: 1
    Last Post: 08-25-2007, 06:55 PM
  2. button works on mac not on pc (html button) + mysql backup
    By blasto333 in forum Programming Discussion
    Replies: 2
    Last Post: 03-08-2003, 11:32 AM
  3. Need a advertising button designed ASAP!
    By 0wned in forum Other Offers & Requests
    Replies: 6
    Last Post: 11-23-2002, 02:06 AM
  4. Home Page Button Ads Available
    By abctracker in forum Other Offers & Requests
    Replies: 0
    Last Post: 07-12-2002, 02:49 AM
  5. Folder's button in PM page.
    By Glexicon in forum WHT Announcements, Feedback and Questions
    Replies: 1
    Last Post: 09-23-2001, 07:31 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •