How To Add A Button In Blogger Post

Blogger directly not allows to add button in editor But you can add buttons with the help of HTML. In this post, we will tell you how you can add buttons to Blogger posts with the help of Bootstrap and you can do this even when you do not have any knowledge of HTML and CSS.


Bootstrap is a open source CSS Framework, with the help of which you can do HTML styling very easily by just adding some classes. Let's see how we can add button in Blogger post with Bootstrap.

How To Add Button In Blogger Post -

Step 1 -

1. Copy this Bootstrap CDN link.

<!-- Bootstrap CSS --> <link rel="stylesheet" href="" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous" />

2. Open Blogger Dashboard and go to Theme section and now click to three dots and edit HTML.

3. Now paste Bootstrap CDN link  <head>...HERE...</head> and save theme.

Step 2 -

1. Create new post.

2. Select HTML view in Blogger editor and add button code given below that you want.

3. These are default button in Bootstrap.
<button type="button" class="btn btn-primary">Primary</button>
<button type="button" class="btn btn-secondary">Secondary</button>
<button type="button" class="btn btn-success">Success</button>
<button type="button" class="btn btn-danger">Danger</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-info">Info</button>
<button type="button" class="btn btn-light">Light</button>
<button type="button" class="btn btn-dark">Dark</button>
<button type="button" class="btn btn-link">Link</button>

Output -

4. You can also use <a> tag on place of <button> tag.
<a href="#" class="btn btn-primary">Button</a>

Output -

Apart from these, other colors can be used, hex codes can be used to use custom colors.
This way you can easily add custom buttons on Blogger.

0/Post a Comment/Comments

Previous Post Next Post