Skip to main content

Is this possible?


Button with subtitle text


I’m trying to create a button that has some extra subtitle text below the main text. See screenshot for an example.


For my first attempt, I simply added some paragraph text below the button text. The issue with this is that there was too much padding at the top half of the button - making the button look weird.


For my second attempt, I just used the box feature and turned my text into an actual link. .see screenshot] The issue with this is that if someone clicks anywhere on the button outside of the hyperlink, then the button won’t work. Not ideal if going for conversions.


Any ideas about how to do this with a normal button?

29%20PM

Hey @john_p 🙂 Easiest way I can see is to adjust the padding and text line-height via some CSS.


Make the button height on the page LESS the extra padding. You’ll have to adjust the padding/line-height to suit your button and use the preview to get the subheading text positioned in the right spot.


Here’s an example: https://sevahcreative.com/unbounce/button-subtext/


CSS I used:


<style>

  #lp-pom-button-9 {

    padding-bottom: 30px;

    line-height:6px;

  }

</style>

Sweet! Love your example 😉

Wow awesome! Thank you @Zoe_Tattersall!!!

Reply


Terms & ConditionsCookie settings