블로그 글자 수 세기 도구
Google Adsense 승인받을 때 중요한 글자 수 체크!
공백 포함/제외, 단어 수, 줄 수까지 실시간으로 확인 가능한 블로거 맞춤 도구입니다.
바로 완성했을때 모습입니다.
이제 만들어 볼까요? 정말 쉬워요 (단 2개만 하면)
1.메모장에 다음 html 입력 후 저장
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>글자 수 세기</title>
<style>
body {
font-family: 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif;
background-color: #f9fafb;
color: #333;
max-width: 700px;
margin: 0 auto;
padding: 30px 20px;
}
h2 {
text-align: center;
color: #4f46e5;
margin-bottom: 20px;
}
textarea {
width: 100%;
height: 200px;
padding: 15px;
font-size: 16px;
border: 1px solid #ddd;
border-radius: 8px;
box-sizing: border-box;
resize: vertical;
}
button {
display: block;
width: 100%;
padding: 12px;
margin-top: 15px;
font-size: 16px;
color: white;
background-color: #4f46e5;
border: none;
border-radius: 8px;
cursor: pointer;
transition: background-color 0.2s ease-in-out;
}
button:hover {
background-color: #4338ca;
}
.result {
display: none;
margin-top: 25px;
background: #ffffff;
border: 1px solid #e5e7eb;
padding: 20px;
border-radius: 10px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}
.result p {
font-weight: bold;
margin-bottom: 10px;
}
ul {
padding-left: 20px;
list-style: disc;
}
li {
margin: 6px 0;
}
strong {
color: #2563eb;
}
</style>
</head>
<body>
<h2>✍ 글자 수 세기 도구</h2>
<textarea id="inputText" placeholder="여기에 글을 입력하세요..."></textarea>
<button onclick="countText()">📊 결과 보기</button>
<div class="result" id="resultBox">
<p>📈 분석 결과:</p>
<ul>
<li><strong>총 글자 수 (공백 포함):</strong> <span id="totalChars"></span></li>
<li><strong>총 글자 수 (공백 제외):</strong> <span id="charsNoSpace"></span></li>
<li><strong>단어 수:</strong> <span id="wordCount"></span></li>
<li><strong>공백 제외 단어 수:</strong> <span id="wordNoSpaceCount"></span></li>
<li><strong>줄 수:</strong> <span id="lineCount"></span></li>
</ul>
</div>
<script>
function countText() {
const text = document.getElementById("inputText").value;
const totalChars = text.length;
const charsNoSpace = text.replace(/\s/g, '').length;
const wordCount = text.trim() ? text.trim().split(/\s+/).length : 0;
const textNoSpaces = text.replace(/\s/g, '');
const wordNoSpaceCount = textNoSpaces ? textNoSpaces.match(/[^\d\W]+/g)?.length || 0 : 0;
const lineCount = text.split(/\n/).length;
document.getElementById("totalChars").innerText = totalChars;
document.getElementById("charsNoSpace").innerText = charsNoSpace;
document.getElementById("wordCount").innerText = wordCount;
document.getElementById("wordNoSpaceCount").innerText = wordNoSpaceCount;
document.getElementById("lineCount").innerText = lineCount;
document.getElementById("resultBox").style.display = 'block';
}
</script>
</body>
</html>
2. .txt -> .html로 바꾸고 연결프로그램을 Internet Explorer로 바꾸기
pc에서 더블클릭
끝입니다.
✅ 마무리
Google Adsense를 준비 중이시거나, 블로그 글 품질을 높이고 싶은 분들이라면
이 글자 수 도구가 확실히 도움 될 거예요. 😊
저는 이 도구 덕분에 실제로 애드센스 승인을 받았고, 지금도 매 포스팅마다 유용하게 사용하고 있답니다.
필요하신 분들은 아래 링크나 도구를 활용해보세요.
여러분의 글이 더 명확하고 탄탄해지길 바랄게요! ✍️
'생활정보' 카테고리의 다른 글
| 📅 6월 3일 대선 후보 프로필과 공약 한눈에 정리 | 2025 대선 핵심정보 (0) | 2025.05.18 |
|---|---|
| "일본의 땅’이 아니었다? 오키나와의 진짜 정체성 이야기” (2) | 2025.05.15 |
| 2025년 세계 주요 순위 TOP10과 대한민국 위치 비교 (4) | 2025.05.13 |
| 2025 미중 관세 전쟁, 알아보자 (2) | 2025.05.13 |
| 미중 관세 합의 이후, NVIDIA 주식은 어떻게 될까? (0) | 2025.05.13 |
