how to make call-to-action.button

Community Forums Forums General Discussion how to make call-to-action.button

This topic is: not resolved

This topic contains 4 replies, has 3 voices, and was last updated by  Joseph Lee 1 year, 3 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #37924

    Tonje
    Participant
    Post count: 37

    Hello,

    A while back I copied the button code from this site to our site http://www.iexcelbooks.no

    The buttons are square and I would like to have them more rounded.

    Is there a place here on this site where I can copy a code/find an instruction how to make it? I prefer call to action buttons like I see Studiopress has it on their homepage or coppyblogger is another good example.

     

    Thanks in advance

    Tonje

     

     

     

    #37943

    cdils
    Participant
    Post count: 421

    Hi Tonje,

    Is it the green button on your home page? If so, try adding border-radius: 10px to the button. So your CSS might look like this:

    .buttondiv {
    border-radius: 10px;
    }

    Of course I just picked 10px – you can make the rounds larger by increasing the pixel size.

    Cheeres,
    Carrie


    Have you been helped in this forum? Pay it forward and answer someone else’s question. I bet you’ll know the answer to at least one question. :)

    I host a weekly Genesis-focused podcast called Genesis Office Hours. I tweet @cdils.

    #38374

    Tonje
    Participant
    Post count: 37

    Thank you Carrie for your description.

    That looks much better. You dont happens to know how to make it glossier as well, do you? If so, would appreciate it.

    Thanks

    Tonje

     

     

    #38398

    cdils
    Participant
    Post count: 421

    Hi Tonje,

    If you want to go glossy, you’ve got two basic options:

    1) Add in some crazy CSS gradients (you can do some Googling for CSS gradient button generator). Just know that it may not look great in older browsers, especially IE.

    2) Use a background image instead of a background color for your button. This is a better option in my opinion. :) Again, if you Google for “glossy buttons” or such, you’ll find lots of images you can use.

    Cheers,
    Carrie


    Have you been helped in this forum? Pay it forward and answer someone else’s question. I bet you’ll know the answer to at least one question. :)

    I host a weekly Genesis-focused podcast called Genesis Office Hours. I tweet @cdils.

    #38402

    Joseph Lee
    Participant
    Post count: 136

    Don’t worry how things look in Internet Explorer. The people using IE deserve a bad browsing experience. LOL

     

     

    Just kidding.

     

    Just kidding about the just kidding?

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.