5 Simple But Best Pop-Up Buttons For Blogger

7 min read

Pop-up buttons are a type of button, which when clicked will display a new sajian or pop-up a new window that will contain a list of mutually exclusive links, images, etc.

And you might have probably noticed many websites that open up a new window on clicking a button or a link. So,

How to create a popup window in Blogger

As these buttons are responsive so you can add the following pop-up buttons in your blog post for opening your external links, on sidebars as a widget to connect to other pages or links or you can use, embed or add it for any other purpose that you want.

Note: Change the URL wonderkrish.com with your own desired URL or link.

Pop-Up Button 1

 <!-- Onclick Pop-Up Button for Blogger. Powered by Wonder Krish -->    <button type="button" onclick="window.open('https://about-tutor.blogspot.com//','popup','width=1600,height=1600,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false" style="      font-size: 14px;      text-align: center;      font-weight: bold;      margin: 0 auto;      height: 14px;      display: block;      cursor: pointer;      background-color: red;      text-decoration: none;      padding-bottom: 25px;      padding-left: 10px;      padding-right: 10px;      padding-top: 10px;      border-radius: 8px;      color: #ffffff;    ">Pop-Up Button</button>    <br />

Pop-Up Button 2

 <!-- Onclick Pop-Up Button for Blogger. Powered by Wonder Krish -->    <button type="button" onclick="window.open('https://about-tutor.blogspot.com//','popup','width=1600,height=1600,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false" style="      font-size: 14px;      text-align: center;      font-weight: bold;      margin: 0 auto;      height: 14px;      display: block;      cursor: pointer;      background-color: #507282;      text-decoration: none;      padding-bottom: 25px;      padding-left: 10px;      padding-right: 10px;      padding-top: 10px;      border-radius: 8px;      color: #ffffff;    ">Pop-Up Button</button>    <br />

Pop-Up Button 3

 <!-- Onclick Pop-Up Button for Blogger. Powered by Wonder Krish -->    <button type="button" onclick="window.open('https://about-tutor.blogspot.com//','popup','width=1600,height=1600,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false" style="      font-size: 14px;      text-align: center;      font-weight: bold;      margin: 0 auto;      height: 14px;      display: block;      cursor: pointer;      background-color: #e2912c;      text-decoration: none;      padding-bottom: 25px;      padding-left: 10px;      padding-right: 10px;      padding-top: 10px;      color: #0c0c0c;    ">Pop-Up Button</button>    <br />

Pop-Up Button 4

 <!-- Onclick Pop-Up Button for Blogger. Powered by Wonder Krish -->    <button type="button" onclick="window.open('https://about-tutor.blogspot.com//','popup','width=1600,height=1600,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false" style="      font-size: 14px;      text-align: center;      font-weight: bold;      margin: 0 auto;      height: 14px;      display: block;      cursor: pointer;      background-color: #12521a;      text-decoration: none;      padding-bottom: 25px;      padding-left: 10px;      padding-right: 10px;      padding-top: 10px;      color: #ffffff;    ">Pop-Up Button</button>    <br />

Pop-Up Button 5

 <!-- Onclick Pop-Up Button for Blogger. Powered by Wonder Krish -->    <button type="button" onclick="window.open('https://about-tutor.blogspot.com//','popup','width=1600,height=1600,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false" style="      font-size: 14px;      text-align: center;      font-weight: bold;      margin: 0 auto;      height: 14px;      display: block;      cursor: pointer;      background-color: #e2912c;      text-decoration: none;      padding-bottom: 25px;      padding-left: 10px;      padding-right: 10px;      padding-top: 10px;      color: #0c0c0c;      border-radius: 12px;    ">Pop-Up Button</button>    <br />

I hope you have successfully added the HTML responsive pop-up buttons to your Blogger blog. And do leave a comment below if have any suggestions or have found any difficulties while adding the Pup-Up buttons.