How to make multiple buttons clickable - in one image.. I'll pay to get this done.

Discussion in 'Programming' started by OmarBriones, Oct 12, 2011.

0
  1. #1
    Hey guys & gals,

    I have this photo here:

    http://www.theautomatedbusinesssystem.com/wp-content/uploads/2011/10/Green-Price-Table-for-Done-For-You-Sites-copy.jpg

    It's a pricing table that consists of 3 packages that I'm selling..

    It's just a .jpg image at this point, but I need to make these 3 individual "Sign Up" buttons clickable for people to go to my order page(s)...

    I'll be happy to work out a deal with anyone who can fix this for up me.. I'm pretty sure all you need is Dream Weaver. And I have the .psd files if that helps...

    Hope someone here can help me out. :)

    Thanks in advance!

    ~Omar
     
    OmarBriones, Oct 12, 2011 IP
  2. Rukbat

    Rukbat Well-Known Member

    Messages:
    2,908
    Likes Received:
    37
    Best Answers:
    51
    Trophy Points:
    125
    #2
    <a href="the URL you want the user to get to"><img src="the image file, including path" /></a>

    Just do that for all 3 images. Put the code for each one wherever you want the images to appear on the page.

    No charge.

    (The one thing you don't need is Dreamweaver - for this or for anything. This one is so simple you can do it in Notepad.)
     
    Rukbat, Oct 12, 2011 IP
  3. OmarBriones

    OmarBriones Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Hey Rukbat,

    Thanks for trying, but you misunderstood.... Let me explain again:

    I only have one image (the one I posted in the original post)... I don't have 3 images.

    I need each of the sign up buttons in the image be clickable (not the whole image)

    Dream Weaver would be a good tool for this.

    Please, if anyone can help me get this done, I'll pay top dollar for it. :)

    Thanks

    ~ Omar
     
    OmarBriones, Oct 12, 2011 IP
  4. nyxano

    nyxano Peon

    Messages:
    417
    Likes Received:
    15
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Basically, you would use an Image Map to make certain areas of an image click-able. The following should work:

    
<img src="http://www.theautomatedbusinesssystem.com/wp-content/uploads/2011/10/Green-Price-Table-for-Done-For-You-Sites-copy.jpg" USEMAP="#PriceTable" BORDER=0>
<map name="PriceTable">
  <area name="Standard" shape="rect" coords="42,379,172,412" href="http://www.theautomatedbusinesssystem.com/STANDARD.html" alt="Standard Plan" title="Standard Plan">
  <area name="Pro" shape="rect" coords="236,388,366,421" href="http://www.theautomatedbusinesssystem.com/PRO.html" alt="Pro" title="Pro">
  <area name="Premium" shape="rect" coords="434,379,564,412" href="http://www.theautomatedbusinesssystem.com/PREMIUM.html" alt="Premium" title="Premium">
</map>
    Code (markup):
    Then just change the HREF for each section to the sign up page for each plan. Replace the IMG SRC with the above code, using HTML (not Visual) View, on your Wordpress Page.
     
    nyxano, Oct 12, 2011 IP
  5. OmarBriones

    OmarBriones Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    God I love you!! I love this forum! Thank you!!!!! What's your paypal email? :)

     
    OmarBriones, Oct 12, 2011 IP
  6. inet

    inet Well-Known Member

    Messages:
    706
    Likes Received:
    42
    Best Answers:
    0
    Trophy Points:
    163
    #6
    Excellent. Not something I was familiar with at all, but has opened up some new ideas for me. thank you very much
     
    inet, Oct 14, 2011 IP