Bitcoin Forum
December 10, 2016, 07:04:22 AM *
News: To be able to use the next phase of the beta forum software, please ensure that your email address is correct/functional.
 
   Home   Help Search Donate Login Register  
Pages: [1]
  Print  
Author Topic: Pure CSS/HTML (no images) Bitcoin donation logo/button for your website  (Read 3535 times)
joepie91
Sr. Member
****
Offline Offline

Activity: 294


View Profile
June 15, 2011, 12:54:34 PM
 #1

A button / logo to show that you accept Bitcoin donations. Using only HTML and CSS, no javascript (obviously) or images are used.
Displays as intended in Chrome and Firefox. Surprise surprise, doesn't work properly in IE9, but doesn't look too bad, although I have no clue why the border is not showing correctly.
Not tested in other browsers, all feedback is welcome Smiley
(I know the code is a bit messy, but it should work alright)

If you like it, of course donations are always welcome at 13m9CAKrYsdLKhqsNm4UkHHJqDM19F4oKv Tongue

EDIT: Obviously when placing the code on your site, you should edit the Bitcoin address to have your address Smiley

EDIT2: Forgot to set a background color for the white part of the "button", that is now fixed. If you have a non-white page background, please update your code Smiley

Screenshot of how it looks in various browsers:


Code:
Code:
<span style="overflow: hidden; border: 1px solid black; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding: 4px; padding-left: 0px; font-family: Arial; font-size: 12px; font-weight: bold; background-color: white;">
<span style="padding: 4px; padding-left: 8px; background-color: #E98A0A; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; color: white;">
<a href="http://www.bitcoin.org/" style="text-decoration: none; color: white;">
<span style="-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; font-weight: normal; color: white; font-size: 15px; background-color: white; color: #E98A0A; padding: 1px 5px; padding-top: 0px;">&#3647;</span>
Donate using Bitcoin!
</a>
</span>
<span style="padding: 5px;">
13m9CAKrYsdLKhqsNm4UkHHJqDM19F4oKv
</span>
</span>

I may work on some other buttons soon as well Smiley

Like my post(s)? 12TSXLa5Tu6ag4PNYCwKKSiZsaSCpAjzpu Smiley
Quote from: hawks5999
I just can't wait for fall/winter. My furnace never generated money for me before. I'll keep mining until my furnace is more profitable.
1481353462
Hero Member
*
Offline Offline

Posts: 1481353462

View Profile Personal Message (Offline)

Ignore
1481353462
Reply with quote  #2

1481353462
Report to moderator
1481353462
Hero Member
*
Offline Offline

Posts: 1481353462

View Profile Personal Message (Offline)

Ignore
1481353462
Reply with quote  #2

1481353462
Report to moderator
Advertised sites are not endorsed by the Bitcoin Forum. They may be unsafe, untrustworthy, or illegal in your jurisdiction. Advertise here.
Xiong Zhuang
Member
**
Offline Offline

Activity: 102


View Profile
June 15, 2011, 03:27:59 PM
 #2

Great job! I really love your work.
genjix
Legendary
*
Offline Offline

Activity: 1232


View Profile
June 15, 2011, 03:49:34 PM
 #3

Haha, that's awesome. Was going to donate 50 millis before seeing it was you XD

joepie check this out, http://forum.bitcoin.org/index.php?topic=17368.0
Coineer
Member
**
Offline Offline

Activity: 119


NewsBTC Canada


View Profile WWW
June 16, 2011, 12:28:40 AM
 #4

Great code!!! Cheesy

Coineer - The World's First Bitcoin Magazine Available in Print and Online is Now NewsBTC Canada!
Pages: [1]
  Print  
 
Jump to:  

Sponsored by , a Bitcoin-accepting VPN.
Powered by MySQL Powered by PHP Powered by SMF 1.1.19 | SMF © 2006-2009, Simple Machines Valid XHTML 1.0! Valid CSS!