Bitcoin Forum
November 15, 2024, 03:16:09 AM *
News: Latest Bitcoin Core release: 28.0 [Torrent]
 
   Home   Help Search Login Register More  
Pages: [1]
  Print  
Author Topic: Pure CSS/HTML (no images) Bitcoin donation logo/button for your website  (Read 4434 times)
joepie91 (OP)
Sr. Member
****
Offline Offline

Activity: 294
Merit: 250


View Profile
June 15, 2011, 12:54:34 PM
Last edit: June 16, 2011, 10:38:03 AM by joepie91
 #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.
Xiong Zhuang
Member
**
Offline Offline

Activity: 102
Merit: 10


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

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

Activity: 1232
Merit: 1076


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
Merit: 10


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:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.19 | SMF © 2006-2009, Simple Machines Valid XHTML 1.0! Valid CSS!