Hey Guys! Welcome back to Techly Series website.

Assuming You are observing the Contact Page Script for Blogger using Telegram Bot API. This is the Right Place to you. Since You can get this Script for free and without credit.

Today, in this article, I will Discuss with you about How to Create a Contact Page in Blogger using Telegram Bot API Without Credit.

How to Create

So, to create Contact Page using Telegram Bot API Without Credit on blogger you need to follow the following process below precisely.

What's more, with the help of these steps, you can easily make this page in your blogger website.

Step 1

• You will go to your - Blogger Dashboard
• Go to Theme
• Go to - Edit HTML
• Search - </head> or &lt;/head&gt;
• Copy this CSS Code below and Paste on top of </head> or &lt;/head&gt;
• Save Theme

<style>
.Tbody i,.Tbody span{margin:0 6px 0 0}
.Aa span{position:fixed;left:25px;bottom:-150px;display:inline-flex;justify-content:center;margin-bottom:75px;z-index:99999;background:#fff;color:#000;box-shadow:0 0 10px #000;border-radius:5px;padding:16px 25px;opacity:0;animation:2.3s forwards slideup}@media screen and (max-width:480px){.Aa span{margin-bottom:75px;left:25px;right:25px}}
@keyframes slideup{0%{opacity:0}20%,50%,80%{opacity:1;bottom:0}100%{opacity:0;bottom:-150px;visibility:hidden}}
</style>
<link rel='stylesheet' href='https://cdn.jsdelivr.net/gh/itsTSUI/tsP/toolBody.css'/>
<script crossorigin='anonymous' src='https://kit.fontawesome.com/4ad360bfd2.js'/>

Step 2

• After Save Theme
• Create a new Post or Page
• Copy this HTML & Javascript Code below and Paste in your blog - Post or Page
• Replace BOTTOKEN and Paste Your Bot API Key
• Replace CHATID and Paste Your Group Chat ID
• Publish.

<div class='Tbody'>

<form id='cForm'>
<span class='star'><i class='fa-regular fa-user'></i>Name</span>
<input id='name' placeholder='Enter Your Name Here...' required/>

<span class='star'><i class='fa-regular fa-envelope'></i>Email Address</span>
<input id='email' type='email' placeholder='Enter Your Email Here...' required/>

<span><i class='fa fa-phone'></i>Mobile Number</span>
<input id='mobile' type='number' placeholder='Enter Your Mobile No. Here...'/>

<span><i class='fa fa-at'></i>Telegram Username</span>
<input id='username' placeholder='Enter Your Username Here...'/>

<span class='star'><i class='fa-regular fa-keyboard'></i>Message</span>
<textarea id='message' rows='10' placeholder='Enter Massage Here...' required></textarea>

<button type='submit'>Send Message</button>
</form>

</div>

<div class="Aa" id="Ca"></div>

<script>
document.querySelector("#cForm").addEventListener("submit",async e=>{e.preventDefault();let a=await fetch("https://api.telegram.org/botBOTTOKEN/sendMessage?chat_id=-100CHATID",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({text:`Name : <b>${document.querySelector("#name").value}</b>
Email : ${document.querySelector("#email").value}
Mobile : ${document.querySelector("#mobile").value}
Message : <code>${document.querySelector("#message").value}</code>
${document.querySelector("#username").value}`,parse_mode:"HTML"})}),t=document.querySelector("#Ca");a.ok?t.innerHTML="<span>Message Sent!</span>":t.innerHTML="<span>Message Failed to Send!</span> :( "+await a.text(),e.target.reset()});
</script>

Final Words

You ought to indeed note by thinking in the remark box underneath. Or on the other hand you moreover bear to give some sort of Suggestion, likewise you can partake your conviction with me in the Comment Box beneath.

I didn't give this content to any individual who saw or replicated them. This content I've looked through a great deal and given by experience. So kindly don't note on this substance.

Assuming you experience any issues while copying this script you can impart me by Telegram and I'll attempt to help.