How to embed a button into a Topic Post

Introducing the amazing embedded button - the ultimate solution for spicing up your topic posts! With just a click, you can add a whole new dimension to your content and leave your readers in awe. Plus, our embedded button comes with a 100% satisfaction guarantee - if you’re not completely satisfied with its awesomeness, we’ll give you your money back (just kidding, it’s totally free)! So why wait? Get your hands on our embedded button today and join the cool kids’ club!

I have created some call-to-action topics to increase sign-ups on my Discourse forum. Each topic is for a different marketing campaign. But they all share one thing in common…I want them to sign up after reading it. So instead of breaking the flow of the readers eye, I have added a button directly into the post for their convenience, and increased conversion rates. But you can use the button for whatever you want! :slight_smile:

Preview



How to Enable

  1. Add the custom CSS to your current theme.
[data-wrap="button"] a {
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    color: #FFF !important;
    background-color: #007bff;
    border-color: #007bff;
}

// Part #1 Allows text to be displayed to the right of a button.
[data-wrap="button"] {
    display: inline-block;
}

// Part #2 Allows text to be displayed to the right of a button.
[data-wrap="text-after-button"] {
    display:inline-block;
}
  1. In your posts, copy
[wrap="button"][Get Started](https://example.com)[/wrap]

Or if you want text next to your button, try this…

[wrap="button"][Sign Up](https://YourDiscourseURL.com/signup)[/wrap]
[wrap="text-after-button"]<-- Click Here to get sign up to my discourse![/wrap]
11 Likes

very nice, thank you.

1 Like

Hey @UnitedFreedom!

Your topic inspired me to create a proper topic about such modifications :+1:

You can read it here guys: Customize posts' contents with your own styles

1 Like

I’m glad I was able to inspire you. You made a very easy to follow topic with pictures. Love it :slight_smile:

1 Like