{"id":1598,"date":"2026-02-04T00:42:58","date_gmt":"2026-02-04T00:42:58","guid":{"rendered":"https:\/\/samirmoustakim.com\/?page_id=1598"},"modified":"2026-02-04T01:07:55","modified_gmt":"2026-02-04T01:07:55","slug":"character-counter","status":"publish","type":"page","link":"https:\/\/samirmoustakim.com\/ar\/character-counter\/","title":{"rendered":"Character Counter"},"content":{"rendered":"
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\nCharacter Counter Tool<\/title>\r\n<style>\r\n \/* ==========================\r\n GLOBAL STYLES\r\n ========================== *\/\r\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;600&display=swap');\r\n .samir-tool * {\r\n box-sizing: border-box;\r\n font-family: 'Inter', Calibri, sans-serif;\r\n }\r\n .samir-tool {\r\n max-width: 700px;\r\n margin: 0 auto;\r\n padding: 20px;\r\n background: #FFFFFF;\r\n color: #212529;\r\n border-radius: 8px;\r\n font-size: 15px;\r\n }\r\n .samir-tool h1 {\r\n font-size: 28px;\r\n margin-bottom: 10px;\r\n color: #0D6EFD;\r\n }\r\n .samir-tool p.description {\r\n font-size: 16px;\r\n color: #6C757D;\r\n margin-bottom: 20px;\r\n }\r\n\r\n \/* ==========================\r\n TOOL BOX\r\n ========================== *\/\r\n .samir-tool textarea {\r\n width: 100%;\r\n height: 150px;\r\n padding: 0 14px;\r\n font-size: 15px;\r\n line-height: 48px;\r\n border: 1px solid #CED4DA;\r\n border-radius: 6px;\r\n resize: vertical;\r\n margin-bottom: 15px;\r\n }\r\n .samir-tool button.generate {\r\n width: 100%;\r\n height: 48px;\r\n line-height: 48px;\r\n background-color: #0D6EFD;\r\n color: #FFFFFF;\r\n border: none;\r\n border-radius: 6px;\r\n font-size: 16px;\r\n cursor: pointer;\r\n transition: background 0.3s;\r\n }\r\n .samir-tool button.generate:hover {\r\n background-color: #0b5ed7;\r\n }\r\n\r\n \/* ==========================\r\n OUTPUT BOX\r\n ========================== *\/\r\n .samir-tool .output-box {\r\n background: #F8F9FA;\r\n padding: 15px;\r\n border-radius: 6px;\r\n margin-top: 15px;\r\n position: relative;\r\n }\r\n .samir-tool .output-box pre {\r\n margin: 0;\r\n word-wrap: break-word;\r\n }\r\n .samir-tool button.copy-btn {\r\n position: absolute;\r\n top: 10px;\r\n right: 10px;\r\n background: #20C997;\r\n color: #FFFFFF;\r\n border: none;\r\n padding: 6px 12px;\r\n border-radius: 4px;\r\n cursor: pointer;\r\n font-size: 14px;\r\n }\r\n .samir-tool .copy-feedback {\r\n margin-top: 5px;\r\n color: #20C997;\r\n font-weight: 600;\r\n display: none;\r\n }\r\n\r\n \/* ==========================\r\n PROMOTIONAL BANNER\r\n ========================== *\/\r\n .samir-tool .promo-banner {\r\n background: #E9ECEF;\r\n padding: 15px;\r\n border-radius: 6px;\r\n margin-top: 25px;\r\n text-align: center;\r\n }\r\n .samir-tool .promo-banner p {\r\n margin: 0 0 10px;\r\n }\r\n .samir-tool .promo-banner a {\r\n display: inline-block;\r\n background: #0D6EFD;\r\n color: #FFFFFF;\r\n padding: 10px 20px;\r\n border-radius: 6px;\r\n text-decoration: none;\r\n }\r\n .samir-tool .promo-banner a:hover {\r\n background: #0b5ed7;\r\n }\r\n\r\n \/* ==========================\r\n SEO SECTION\r\n ========================== *\/\r\n .samir-tool .seo-section {\r\n margin-top: 30px;\r\n }\r\n .samir-tool .seo-section h2 {\r\n font-size: 22px;\r\n margin-bottom: 10px;\r\n color: #0D6EFD;\r\n }\r\n .samir-tool .seo-section ol {\r\n padding-left: 20px;\r\n margin-bottom: 20px;\r\n }\r\n .samir-tool .seo-section .faq {\r\n margin-top: 15px;\r\n }\r\n .samir-tool .seo-section .faq h3 {\r\n font-size: 18px;\r\n margin: 10px 0 5px;\r\n color: #6C757D;\r\n }\r\n .samir-tool .related-tools a {\r\n display: block;\r\n color: #0D6EFD;\r\n margin-bottom: 5px;\r\n text-decoration: none;\r\n }\r\n .samir-tool .related-tools a:hover {\r\n text-decoration: underline;\r\n }\r\n\r\n \/* ==========================\r\n RESPONSIVE\r\n ========================== *\/\r\n @media (max-width: 600px) {\r\n .samir-tool h1 {\r\n font-size: 24px;\r\n }\r\n .samir-tool textarea {\r\n line-height: 40px;\r\n }\r\n .samir-tool button.generate {\r\n height: 48px;\r\n line-height: 48px;\r\n }\r\n }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n<div class=\"samir-tool\">\r\n <!-- TOOL TITLE -->\r\n <h1>Character Counter Tool<\/h1>\r\n <p class=\"description\">Quickly count characters and words to optimize your content for ads, SEO, or social media.<\/p>\r\n\r\n <!-- TOOL BOX -->\r\n <textarea id=\"inputText\" placeholder=\"Paste your text here...\"><\/textarea>\r\n <button class=\"generate\" id=\"generateBtn\">Count Characters & Words<\/button>\r\n\r\n <!-- OUTPUT BOX -->\r\n <div class=\"output-box\" id=\"outputBox\" style=\"display:none;\">\r\n <pre id=\"outputText\"><\/pre>\r\n <button class=\"copy-btn\" id=\"copyBtn\">Copy<\/button>\r\n <div class=\"copy-feedback\" id=\"copyFeedback\">Copied \u2713<\/div>\r\n <\/div>\r\n\r\n <!-- PROMOTIONAL BANNER -->\r\n <div class=\"promo-banner\">\r\n <p>Need more productivity tools for your online business?<\/p>\r\n <a href=\"https:\/\/samirmoustakim.com\/ar\/shop\/ target=\/\"_blank\">Visit Our Shop<\/a>\r\n <\/div>\r\n\r\n <!-- SEO SECTION -->\r\n <div class=\"seo-section\">\r\n <h2>How to Use<\/h2>\r\n <ol>\r\n <li>Paste your text into the box above.<\/li>\r\n <li>Click \"Count Characters & Words\".<\/li>\r\n <li>See instant results and copy if needed.<\/li>\r\n <\/ol>\r\n\r\n <div class=\"faq\">\r\n <h3><h2 style=\"font-size: 28px\">\u0627\u0644\u0623\u0633\u0626\u0644\u0629 \u0627\u0644\u0634\u0627\u0626\u0639\u0629<\/h2><\/h3>\r\n <h3>1. Can I count characters for social media posts?<\/h3>\r\n <p>Yes! It's perfect for platforms with text limits like Twitter, Instagram, or LinkedIn.<\/p>\r\n <h3>2. Does it count spaces?<\/h3>\r\n <p>Yes, spaces are included in the character count.<\/p>\r\n <h3>3. Is this tool free to use?<\/h3>\r\n <p>Absolutely. You can use it directly in your browser without any signup.<\/p>\r\n <\/div>\r\n\r\n <!-- RELATED TOOLS -->\r\n <div class=\"related-tools\">\r\n <h2>Related Tools<\/h2>\r\n <a href=\"#\">Word Counter<\/a>\r\n <a href=\"#\">Hashtag Generator<\/a>\r\n <a href=\"#\">URL Shortener<\/a>\r\n <\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n<script>\r\n \/\/ ==========================\r\n \/\/ CHARACTER COUNTER LOGIC\r\n \/\/ ==========================\r\n const inputText = document.getElementById('inputText');\r\n const generateBtn = document.getElementById('generateBtn');\r\n const outputBox = document.getElementById('outputBox');\r\n const outputText = document.getElementById('outputText');\r\n const copyBtn = document.getElementById('copyBtn');\r\n const copyFeedback = document.getElementById('copyFeedback');\r\n\r\n \/\/ Generate output\r\n generateBtn.addEventListener('click', () => {\r\n const text = inputText.value.trim();\r\n if (!text) {\r\n alert('Please enter some text to count.');\r\n return;\r\n }\r\n const charCount = text.length;\r\n const wordCount = text.split(\/\\s+\/).filter(word => word).length;\r\n\r\n outputText.textContent = `Characters: ${charCount}\\nWords: ${wordCount}`;\r\n outputBox.style.display = 'block';\r\n copyFeedback.style.display = 'none';\r\n });\r\n\r\n \/\/ Copy to clipboard\r\n copyBtn.addEventListener('click', () => {\r\n navigator.clipboard.writeText(outputText.textContent)\r\n .then(() => {\r\n copyFeedback.style.display = 'block';\r\n setTimeout(() => copyFeedback.style.display = 'none', 2000);\r\n })\r\n .catch(() => alert('Failed to copy'));\r\n });\r\n\r\n \/\/ ==========================\r\n \/\/ HOW TO REUSE THIS TOOL\r\n \/\/ ==========================\r\n \/\/ - To create a new tool:\r\n \/\/ 1. Copy the .samir-tool div.\r\n \/\/ 2. Change the title, description, and logic inside <script>.\r\n \/\/ 3. Keep classes unique if adding multiple tools on the same page.\r\n<\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Character Counter Tool Character Counter Tool Quickly count characters and words to optimize your content for ads, SEO, or social […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"inline_featured_image":false,"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1598","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/samirmoustakim.com\/ar\/wp-json\/wp\/v2\/pages\/1598","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/samirmoustakim.com\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/samirmoustakim.com\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/samirmoustakim.com\/ar\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/samirmoustakim.com\/ar\/wp-json\/wp\/v2\/comments?post=1598"}],"version-history":[{"count":5,"href":"https:\/\/samirmoustakim.com\/ar\/wp-json\/wp\/v2\/pages\/1598\/revisions"}],"predecessor-version":[{"id":1604,"href":"https:\/\/samirmoustakim.com\/ar\/wp-json\/wp\/v2\/pages\/1598\/revisions\/1604"}],"wp:attachment":[{"href":"https:\/\/samirmoustakim.com\/ar\/wp-json\/wp\/v2\/media?parent=1598"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}