Solved

HTML Paypal Button

Posted on 2010-09-15
15
275 Views
Last Modified: 2012-05-10
will someone please go look at my site: http://clcinc.org/ and tell me how I can move the paypal button up to be even with the rest of the header?  

I am using Dreamweaver and know a little HTML.  Any help is appreciated.  Thanks
0
Comment
Question by:clcinc
  • 7
  • 4
  • 2
  • +2
15 Comments
 
LVL 1

Expert Comment

by:Simon-H
ID: 33684136
Hi,

It appears to me that you need to try formatting your button to give it the same border spacing as you have for the text-links.

Is it possible you could post a copy of your css file?

Thanks,
0
 
LVL 1

Expert Comment

by:Simon-H
ID: 33684163
http://www.quirksmode.org/js/detect.html

You can then place a query that will redirect the page based on the response your code receives from the detection.

Regards,

Simon
0
 
LVL 1

Expert Comment

by:Simon-H
ID: 33684178
sorry - please ignore that last comment. wrong thread!
0
 

Author Comment

by:clcinc
ID: 33684213
LOL, I was wondering!

I have three CSS files.  I didnt design the site so I'm not sure which one you need... Here they are:
http://clcinc.org/styles-home.css
http://clcinc.org/styles-shared.css
http://clcinc.org/styles-template.css

I would like to apply this button to all pages on the site after fixing it.  Thank you
0
 
LVL 14

Expert Comment

by:Daniel Junges
ID: 33684256
this <span> tag will help:

<span style="top:-40px;position:relative;">      
  <form action="https://www.paypal.com/cgi-bin/webscr" method="post">
  <input type="hidden" name="cmd" value="_s-xclick">
  <input type="hidden" name="hosted_button_id" value="FXUKJMBZQE76W">
  <input type="image" src="https://www.paypal.com/en_US/i/btn/btn_donate_LG.gif" border="0" name="submit"  align="right" alt="PayPal -   The safer, easier way to pay online!">
   <img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
   </form>
</span>  
0
 
LVL 2

Accepted Solution

by:
branaf earned 500 total points
ID: 33684272
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">

  <input type="hidden" name="cmd" value="_s-xclick">
  <input type="hidden" name="hosted_button_id" value="FXUKJMBZQE76W">
  <input type="image" src="https://www.paypal.com/en_US/i/btn/btn_donate_LG.gif" border="0" name="submit"  align="right" alt="PayPal -   The safer, easier way to pay online!">
   <img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
   </form>

Try putting the img tag in a span tag with class="border"
0
 
LVL 1

Expert Comment

by:Simon-H
ID: 33684400
Thanks for that .. in "styles-shared.css" try adding the below;


.topLinks a .donate{
      border: 0px;
      padding: 2px 4px 2px 4px;
}



you will then need to add "<span class="donate"> and </span> around your button, so try;

<span class="donate">  <form action="https://www.paypal.com/cgi-bin/webscr" method="post">

  <input type="hidden" name="cmd" value="_s-xclick">
  <input type="hidden" name="hosted_button_id" value="FXUKJMBZQE76W">
  <input type="image" src="https://www.paypal.com/en_US/i/btn/btn_donate_LG.gif" border="0" name="submit"  align="right" alt="PayPal -   The safer, easier way to pay online!">
   <img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
   </form></span>



Let me know how you get on with that.

Regards,
0
Control application downtime with dependency maps

Visualize the interdependencies between application components better with Applications Manager's automated application discovery and dependency mapping feature. Resolve performance issues faster by quickly isolating problematic components.

 

Author Comment

by:clcinc
ID: 33684603
@Simon-H
Thanks, but that did not seem to work.  I would really appreciate some more help here.

 I am using dreamweaver and used the Design window to drag and drop the button to the appropriate place.  As you can see @ www.clcinc.org .  But now the link does not execute, because it only moves the image tag, not the code.  and when I move the paypal code up to where I put the image code, it just puts the whole button right back where it was to begin with...

might it be easier to download the html and test it yourself?  Thanks a million fellas

0
 
LVL 14

Expert Comment

by:Daniel Junges
ID: 33684676
have you tried to put the span arround the form ?

<span style="top:-40px;position:relative;"> <form action=... </span>
0
 

Author Comment

by:clcinc
ID: 33684711
I guess I messed something up here.  If some of you all would go look at my site, you'll see that the footer is messed up.  I guess i did something wrong....  
0
 

Author Comment

by:clcinc
ID: 33684726
Please look at my shared css and see if the problem is in there.  The footer has moved, and is no longer at the bottom
0
 

Author Comment

by:clcinc
ID: 33684776
Okay, praise the lord for Sonicwall Backups.  I restored the CSS and have got back what I started with.  
0
 

Author Comment

by:clcinc
ID: 33684834
@junges
That just scrambles the whole header.  
0
 

Author Comment

by:clcinc
ID: 33718565
I guess no one is going to answer.  please close thread.
0
 
LVL 38

Expert Comment

by:BillDL
ID: 33743111
clcinc

At the moment you have the first line of your Form outside the "topLinks" DIV and the rest of it inside the DIV. Additionally you have not added the closing </FORM> tag for your PayPal <FORM> tag.

Try placing the your box-shaped navigation links inside the Form that contains the PayPal button, and have the form all inside the topLinks DIV.  Perhaps something like this will work for you to keep the button in line with the quick links:

<div id="container">

<div class="topLinks">
<FORM action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="XXXXXXXXXXXXXXXX">
<input type="image" src="etc, etc, etc, etc">
<img alt="" border="0" src="etc, etc, etc">
  <a href="about.htm">About Us</a>
  <a href="events.htm">Events &amp; Classes</a>
  <a href="contact.htm">Contact Us</a>
</FORM>
<!--End topLinks -->
</div>

<!-- ##### BEGIN NAVIGATION BAR ##### -->
0

Featured Post

Zoho SalesIQ

Hassle-free live chat software re-imagined for business growth. 2 users, always free.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

For both online and offline retail, the cross-channel business is the most recent pattern in the B2C trade space.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

863 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

22 Experts available now in Live!

Get 1:1 Help Now