Every New blogger Starting there the first Site hosted on blogger. Blogger is Simple, Just Create your blogger Account and Create New Post and Let’s Start Blogging. Hello Developers In this article, we will show you, How to Add Stylish button on blogger Site.
We will create a Stylish button for using HTML & CSS Coding. We will also provide this coding for free. So guys Let’s follow this step till the end.
First of All, Download CSS Code below the Download button.
Copy the CSS Code
.mybutton3{
border: 2px solid red;
outline: none;
text-align: center;
font-size: 15px;
padding: 10px 22px;
background-color: white;
color: black;
cursor: pointer;
width: auto;
height: auto;
border-radius: 30px;
}
.mycenter{
display: flex;
align-items: center;
justify-content: center;
}Open Your Google Blogger Site and Click on Theme Section.
Click on Edit HTML button and open your blogger Coding dashboard.
▼
Find <head> and Paste this shortcode below the next line of <head> . If you can’t find <head> tag, Then Press on CTRL+F & then open on Search bar, Then type on <head> and Press enter. Now detect on <head> tag.
▼
Then Save your blogger Templates.
▼
Now You have Successfully added your blogger Templates and Close your Coding Section.
Create a Post and Add Stylish Button on Blogger
Create a Post and Write your Post.
Where You want to Show the button, Just Paste on the Shortcode to the HTML Section of the Post and Publish now.
Copy The HTML Shortcode
<div class="mycenter"> <button class="mybutton3"><a href="https://www.yoursiteurl.com" style="color:red">Download Now</a></button></div>Change The Button Colour
If you want to change your button colour to according your website themes.
Then You need to change hex colour code. You can change hex colour to many online hex colour editor. Search on Google “Hex Colour Editor” . You can use any website.
More about to related change button colour, must be watch tutorial video till end. If anything doubt Comment in below.
Thanks for reading our Completely post. Hopefully You add Stylish button on blogger site. So give me your valuable feedback for improvement.
Sir ji good morning aap mere whatsapp me e dono code please send kijiey
where is the CSS Code bro?
hey how do i make the URL open in a new tab
not working please provide full code for new window target
Now try this Code
thanks for share this information
good explanation I have seen many youtube videos on how to add buttons on blogger.here my problem is solved.