<!--Main Content-->
<div id="primary">
<div class="container px-0">
<div class="d-lg-flex" id="main-content">
<div class="col-lg-8 px-3" id="main">
<div class="pt-4 pb-5 section" id="blog-post"><div class="widget Blog" data-version="2" id="Blog1">
<article class="mb-5" id="page-content">
<header class="entry-header">
</header>
<div class="entry-text text-break mb-5">
<div class="at_robottxt_container"><h1>Generate robots.txt</h1>
<label class="at_level">Website URL:</label>
<input class="at_input" id="website-url" placeholder="Enter Your Website URL like ‘https://techedubyte.com’" type="text" /><br />
<label>Platform:</label>
<select id="platform-select">
<option value="blogger">Blogger</option>
<option value="wordpress">WordPress</option>
</select><br />
<button id="generate-btn">Generate</button><br /><br />
<div id="output-container" style="display: none;">
<p id="output-text"></p>
<button id="copy-btn" style="display: none;">Copy to clipboard</button>
</div></div>
<style>


.at_robottxt_container h1 {
text-align: center;
margin: 50px 0;
font-size: 36px;
color: #333;
}

.at_robottxt_container {
background-color: #fff;
border-radius: 5px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
padding: 20px;
margin: 0 auto;text-align: center;
max-width:100%;
}

.at_robottxt_container label {
display: block;
margin-bottom: 10px;
font-size: 16px;
color: #333;
}

.at_robottxt_container input[type="text"] {
display: block;
width: 100%;
padding: 10px;max-width: 80%;
margin: auto;
margin-bottom: 20px;
font-size: 16px;
border: none;
border-radius: 5px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
background-color: #f1f1f1;
color: #333;
}

.at_robottxt_container select {
display: block;
width: 100%;max-width: 80%;
margin: auto;
padding: 10px;
margin-bottom: 20px;
font-size: 16px;
border: none;
border-radius: 5px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
background-color: #f1f1f1;
color: #333;
}

.at_robottxt_container button {
display: block;
margin: 0 auto;
padding: 10px 20px;
font-size: 16px;
border: none;
border-radius: 5px;
background-color: #428bca;
color: #fff;
cursor: pointer;
}

.at_robottxt_container textarea {
display: none;
width: 100%;
padding: 10px;
margin-bottom: 20px;
font-size: 16px;
border: none;text-align: left;
border-radius: 5px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
background-color: #f1f1f1;
color: #333;
resize: none;
}
p#output-text {
text-align: left;
background: beige;
padding: 20px;
}
.at_robottxt_container button#copy-btn {
display: none;
margin: 0 auto;
padding: 10px 20px;
font-size: 16px;
border: none;
border-radius: 5px;
background-color: #5cb85c;
color: #fff;
cursor: pointer;
}

.at_robottxt_container button#copy-btn:hover {
background-color: #449d44;
}

.at_robottxt_container button:focus,
.at_robottxt_container button:hover,
.at_robottxt_container button:active {
background-color: #3071a9;
}

@media screen and (max-width: 500px) {
.at_robottxt_container {
margin: 0 10px;
}
}


</style>

<script>
const generateBtn = document.getElementById("generate-btn");
const outputContainer = document.getElementById("output-container");
const outputText = document.getElementById("output-text");
const copyBtn = document.getElementById("copy-btn");

generateBtn.addEventListener("click", () => {
const websiteUrl = document.getElementById("website-url").value;
const platform = document.getElementById("platform-select").value;

// Generate the robots.txt content based on the selected platform
let robotsTxtContent = "";
if (platform === "blogger") {
robotsTxtContent = `User-agent: *
Disallow: /search
Disallow: /p/
Disallow: /?m=1
Sitemap: ${websiteUrl}/atom.xml?redirect=false&start-index=1&max-results=500`;
} else if (platform === "wordpress") {
robotsTxtContent = `User-agent: *
Disallow: /wp-admin/
Disallow: /wp-includes/
Sitemap: ${websiteUrl}/sitemap.xml`;
}

// Display the robots.txt content and copy button
outputText.innerText = robotsTxtContent;
outputContainer.style.display = "block";
copyBtn.style.display = "block";

// Add typing effect to the output text
const textLength = robotsTxtContent.length;
let i = 0;
const typeEffectInterval = setInterval(() => {
outputText.innerText = robotsTxtContent.slice(0, i);
i++;
if (i > textLength) {
clearInterval(typeEffectInterval);
}
}, 50);
});

copyBtn.addEventListener("click", () => {
const copyText = document.createElement("textarea");
copyText.value = outputText.innerText;
document.body.appendChild(copyText);
copyText.select();
document.execCommand("copy");
document.body.removeChild(copyText);
alert("Copied to clipboard!");
});
</script></div>