This article has been updated from an earlier version to reflect recent changes in Weebly that make changing the button font a whole lot easier.
Changing the text font on on Weebly buttons is easy.
Step 1. Click on the Design Tab and Then Click Change Fonts
Step 2. Under General Click Buttons
Step 3. Changing Font Color
Go again to DESIGN but this time choose Edit HTML/CSS at the very bottom.
Be sure to click on main-style.css. You will then have to scroll through and find the /* Buttons-----------------------*/ section. This is usually toward the bottom.
What you are looking for will look something like this under .wsite-button and usually under /* small */
color: #fff !important;
font-family: Arial, Helvetica, sans-serif;
padding: 0 15px 0 0;
background: url(button_red.png) no-repeat 100% -105px;
text-shadow:0 -1px 0 rgba(0,0,0,0.9);
As in the example above you might want to keep or add the override command !important to override any other color definitions that might be hiding somewhere else.
Step 4. Italics and Underline
To do so with CSS, in the above mentioned wsite-buttons styling lines add
for italics and
to underline or use other text decoration properties. (Note, be sure there isn't already a CSS command for text-decoration:none; If there is, just change none to underline.)
Step 5. Uppercase and Lowercase
in the CSS to make button text all capital letters. If you want to change this find the command in the css and change it to
And that's it! Everything you every needed to know about Weebly button fonts. If there is anything I missed, go ahead and ask about it or add to the comments.