{"id":64600,"date":"2025-05-12T10:39:39","date_gmt":"2025-05-12T07:39:39","guid":{"rendered":"https:\/\/wpcalc.com\/en\/?p=64600"},"modified":"2026-09-28T10:22:09","modified_gmt":"2026-09-28T07:22:09","slug":"url-encoder","status":"publish","type":"post","link":"https:\/\/wpcalc.com\/en\/web-tools\/url-encoder\/","title":{"rendered":"URL Encoder"},"content":{"rendered":"<section class=\"not-prose calculator-box\" aria-labelledby=\"calculator-title\"><div class=\"flex items-baseline sm:items-center justify-between gap-2 sm:gap-3\"><div class=\"flex flex-col sm:flex-row sm:items-center gap-2\"><span class=\"icon icon-calculator text-primary-700! text-base! dark:text-primary-300!\" aria-hidden=\"true\"><\/span><h2 id=\"calculator-title\" class=\"text-lg font-display font-bold\">String to URL Encoding Tool<\/h2><\/div><div class=\"calcdash-favorite group\">\n  <button type=\"button\" class=\"favorite\" id=\"favorite\" data-favorite-id=\"64600\" data-favorite-title=\"URL Encoder\" data-favorite-url=\"https:\/\/wpcalc.com\/en\/web-tools\/url-encoder\/\" data-favorite-excerpt=\"Encode text or a URL with JavaScript-style percent encoding. Enter a value in Text or URL to get an encoded string you can copy.\" aria-label=\"Add to Favorites\" data-favorite-icon=\"icon icon-conversion\">\n    <span class=\"icon icon-shape-star-empty\" aria-hidden=\"true\"><\/span>\n  <\/button>\n  <div class=\"calcdash-favorite__tip\" aria-hidden=\"true\">\n   <span class=\"favorite-tooltip\" id=\"favorite-tooltip\"><\/span>\n  <\/div>\n  <span class=\"sr-only\" role=\"status\" id=\"favorite-status\"><\/span>\n<\/div><\/div><form action=\"https:\/\/wpcalc.com\/en\/web-tools\/url-encoder\/\" method=\"POST\" class=\"calculator\" id=\"calculator-64600\" data-post=\"64600\"><fieldset class=\"fieldset-input is-1\"><legend class=\"sr-only\">Input Fields<\/legend><div class=\"field is-single\" id=\"input-1\"><label for=\"field-1\">Text or URL<\/label><textarea id=\"field-1\" name=\"text_or_url\">https:\/\/calcdash.com\/tools?utm_source=chat<\/textarea><\/div><\/fieldset><div class=\"buttons\"><button type=\"submit\" data-text=\"Re-Calculate\" id=\"calculate-button\" data-post=\"64600\">Calculate<\/button><button type=\"reset\">Reset<\/button><\/div><div class=\"field is-checkbox hidden!\" id=\"field-auto-calc\"><input type=\"checkbox\" id=\"auto-calc\"><label for=\"auto-calc\">Calculate automatically<\/label><small>If enabled, the result will update automatically when you change any value.<\/small><\/div><div class=\"fieldset-result is-hidden\" aria-labelledby=\"result-title\" aria-live=\"polite\" role=\"region\"> <h3 class=\"result-title bg-gradient-to-r from-primary-50 to-gray-50 dark:from-primary-900 dark:to-gray-800\" id=\"result-title\"><span class=\"icon icon-s-pulse\" aria-hidden=\"true\"><\/span> Your Results<\/h3><div class=\"result-box\"><div class=\"field-result is-column\" id=\"output-1\"><span class=\"field-title\"><span>Encoded URL<\/span><\/span><span class=\"field-value\" id=\"result-1\"><\/span><button type=\"button\" class=\"copy-result\" data-tooltip=\"Copy Result\" aria-label=\"Copy Result\"><span class=\"copy-icon icon icon-document-copy\" aria-hidden=\"true\"><\/span><\/button><\/div><\/div><div class=\"result-actions\"><button type=\"button\" class=\"copy-link\"><svg viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\"><path d=\"M12.232 4.232a2.5 2.5 0 0 1 3.536 3.536l-1.225 1.224a.75.75 0 0 0 1.061 1.06l1.224-1.224a4 4 0 0 0-5.656-5.656l-3 3a4 4 0 0 0 .225 5.865.75.75 0 0 0 .977-1.138 2.5 2.5 0 0 1-.142-3.667l3-3Z\"\/><path d=\"M11.603 7.963a.75.75 0 0 0-.977 1.138 2.5 2.5 0 0 1 .142 3.667l-3 3a2.5 2.5 0 0 1-3.536-3.536l1.225-1.224a.75.75 0 0 0-1.061-1.06l-1.224 1.224a4 4 0 1 0 5.656 5.656l3-3a4 4 0 0 0-.225-5.865Z\"\/><\/svg><span class=\"copy-link__text\">Copy link to this calculation<\/span><\/button><span class=\"sr-only\" role=\"status\" id=\"copy-link-status\"><\/span><\/div><\/div><a href=\"#respond\" class=\"hidden transition-opacity duration-300 opacity-0 w-50 text-sm justify-center items-center gap-2 px-4 py-2 rounded bg-gray-200 text-gray-700 hover:bg-gray-300\" id=\"leave-comment\"><span class=\"icon icon-comments\" aria-hidden=\"true\"><\/span>Leave a Comment<\/a><\/form><\/section><section id=\"calc-reactions\" class=\"not-prose hidden my-12 bg-gradient-to-r from-primary-50 to-gray-50 border border-indigo-100 rounded-xl px-6 py-4 shadow-sm\" data-post=\"64600\" aria-live=\"polite\" aria-labelledby=\"calc-reactions-title\"><p id=\"calc-reactions-title\" class=\"text-sm text-gray-500 text-center mb-2\">How did this result make you feel?<\/p><div role=\"group\" aria-labelledby=\"calc-reactions-title\" class=\"grid grid-cols-3 sm:flex sm:flex-row sm:justify-around gap-4 sm:items-center sm:flex-wrap\"><button type=\"button\" aria-pressed=\"false\" class=\"reaction-btn flex flex-col items-center gap-1 text-sm text-gray-700 hover:text-primary-600 cursor-pointer transition-transform hover:scale-105\" data-reaction=\"like\"><span class=\"reaction-count\" data-reaction-count=\"like\">0<\/span><span class=\"reaction text-3xl\" aria-hidden=\"true\">\ud83d\ude00 <\/span><span class=\"reaction-description font-medium\">Like <\/span><\/button><button type=\"button\" aria-pressed=\"false\" class=\"reaction-btn flex flex-col items-center gap-1 text-sm text-gray-700 hover:text-primary-600 cursor-pointer transition-transform hover:scale-105\" data-reaction=\"helpful\"><span class=\"reaction-count\" data-reaction-count=\"helpful\">0<\/span><span class=\"reaction text-3xl\" aria-hidden=\"true\">\ud83d\udca1 <\/span><span class=\"reaction-description font-medium\">Helpful <\/span><\/button><button type=\"button\" aria-pressed=\"false\" class=\"reaction-btn flex flex-col items-center gap-1 text-sm text-gray-700 hover:text-primary-600 cursor-pointer transition-transform hover:scale-105\" data-reaction=\"confused\"><span class=\"reaction-count\" data-reaction-count=\"confused\">0<\/span><span class=\"reaction text-3xl\" aria-hidden=\"true\">\ud83d\ude15 <\/span><span class=\"reaction-description font-medium\">Confused <\/span><\/button><button type=\"button\" aria-pressed=\"false\" class=\"reaction-btn flex flex-col items-center gap-1 text-sm text-gray-700 hover:text-primary-600 cursor-pointer transition-transform hover:scale-105\" data-reaction=\"disappointed\"><span class=\"reaction-count\" data-reaction-count=\"disappointed\">0<\/span><span class=\"reaction text-3xl\" aria-hidden=\"true\">\ud83d\ude1e <\/span><span class=\"reaction-description font-medium\">Disappointed <\/span><\/button><button type=\"button\" aria-pressed=\"false\" class=\"reaction-btn flex flex-col items-center gap-1 text-sm text-gray-700 hover:text-primary-600 cursor-pointer transition-transform hover:scale-105\" data-reaction=\"inaccurate\"><span class=\"reaction-count\" data-reaction-count=\"inaccurate\">0<\/span><span class=\"reaction text-3xl\" aria-hidden=\"true\">\u274c <\/span><span class=\"reaction-description font-medium\">Inaccurate <\/span><\/button><\/div><div id=\"reaction-message\" class=\"hidden mt-8 rounded-md border border-primary-100 bg-white\/50 backdrop-blur-sm px-4 py-2 text-sm text-center shadow-sm\"><\/div><\/section><div class=\"calcdash-ad not-prose calcdash-ad--calc_result calcdash-ad--in-article\"><ins class=\"adsbygoogle\" style=\"display:block\" data-ad-client=\"ca-pub-1721569815777345\" data-ad-slot=\"6317458308\" data-ad-layout=\"in-article\" data-ad-format=\"fluid\"><\/ins><script>(adsbygoogle = window.adsbygoogle || []).push({});<\/script><\/div>\n<style id=\"wpcoderpro-inline-1\">.formula-box {\r\n\tborder-bottom: none !important;\r\n}<\/style><section class=\"formula-box\" aria-labelledby=\"formula-title\">\r\n\t<div id=\"formula-title\" class=\"not-prose font-display mb-4\"><span class=\"icon icon-formula\" aria-hidden=\"true\"><\/span><h2>URL Encoder Formula<\/h2><\/div>\r\n\t<figure class=\"not-prose formula\">\r\n\t\t<figcaption class=\"formula-title\">Formula<\/figcaption>\r\n\t\t<div class=\"text-base text-gray-800\" id=\"formula\">\n\\[ E = \\operatorname{encodeURIComponent}(\\operatorname{trim}(S)) \\]\n<\/div>\r\n\t<\/figure>\r\n\t<\/p>\n<p><strong>Where:<\/strong><\/p>\n<ul>\n<li>\\(S\\) \u2014 the value entered in Text or URL.<\/li>\n<li>\\(E\\) \u2014 the encoded output shown under Encoded URL.<\/li>\n<\/ul>\n<p>The calculator removes leading and trailing whitespace, then applies JavaScript\u2019s <code>encodeURIComponent<\/code> function. Characters that need encoding are represented by a percent sign followed by hexadecimal digits for each UTF-8 byte.<\/p>\n<p>\r\n<\/section>\n<style id=\"wpcoderpro-inline-459\">.calculation-box {\r\n\tborder-bottom: none !important;\r\n}<\/style><section id=\"calculation\" class=\"calculation-box\" aria-labelledby=\"calculation-title\">\r\n\t<div id=\"calculation-title\" class=\"not-prose font-display\"><span class=\"icon icon-unordered-list\" aria-hidden=\"true\"><\/span><h2>URL Encoder \u2013 Calculation Example<\/h2><\/div>\r\n\r\n<\/p>\n<p><strong>Example:<\/strong> Enter the default value, <code>https:\/\/calcdash.com\/tools?utm_source=chat<\/code>, in Text or URL.<\/p>\n<p>\\[ \\operatorname{encodeURIComponent}(S) = \\texttt{https\\%3A\\%2F\\%2Fcalcdash.com\\%2Ftools\\%3Futm\\_source\\%3Dchat} \\]<\/p>\n<p><strong>Result:<\/strong> <code>https%3A%2F%2Fcalcdash.com%2Ftools%3Futm_source%3Dchat<\/code>.<\/p>\n<p>\n\r\n<\/section>\n<h2>How to use the URL Encoder<\/h2>\n<ol>\n<li>Enter or paste the value you want to encode into <strong>Text or URL<\/strong>. This can be a word, a query-parameter value, a path segment, or a complete URL.<\/li>\n<li>Read the result under <strong>Encoded URL<\/strong>. The calculator encodes the entire entered value after removing whitespace at its beginning and end.<\/li>\n<li>Copy the result and place it where an encoded value is needed. If you entered a complete URL, do not assume the result is a link you can open directly; its structural characters have been encoded too.<\/li>\n<\/ol>\n<h2>What URL encoding does<\/h2>\n<p>Percent encoding represents certain characters with a percent sign and hexadecimal digits. It lets data include characters that would otherwise have a special meaning in a URL. For example, a space becomes <code>%20<\/code>, an ampersand becomes <code>%26<\/code>, and a literal percent sign becomes <code>%25<\/code>. Each encoded byte has its own percent sequence, so a character outside the ASCII range may produce several sequences.<\/p>\n<p>This calculator uses <code>encodeURIComponent<\/code>, which is intended for an individual component of a URL. It encodes separators such as <code>:<\/code>, <code>\/<\/code>, <code>?<\/code>, <code>&amp;<\/code>, and <code>=<\/code>. That makes it useful when a value must not be mistaken for part of the URL\u2019s structure. For instance, encoding the query value <code>red shoes &amp; boots<\/code> gives <code>red%20shoes%20%26%20boots<\/code>. The ampersand remains part of the value rather than separating two parameters.<\/p>\n<p>The default example shows why the distinction matters: encoding a complete URL changes <code>https:\/\/<\/code> into <code>https%3A%2F%2F<\/code>. The output is an encoded string representing that URL, not the same navigable URL. If you are assembling a link, keep its structural separators intact and encode only the values that need it. To turn encoded text back into readable text, use the <a href=\"https:\/\/wpcalc.com\/en\/web-tools\/url-decoder\/\">URL Decoder<\/a>.<\/p>\n<h2>Assumptions and practical tips<\/h2>\n<ul>\n<li><strong>Outer whitespace is removed.<\/strong> The calculator trims spaces and other surrounding whitespace before encoding. Whitespace inside the value remains; ordinary internal spaces become <code>%20<\/code>. If leading or trailing spaces are significant data, this tool will not preserve them.<\/li>\n<li><strong>Some characters remain unchanged.<\/strong> Letters, digits, and <code>- _ . ! ~ * ' ( )<\/code> are not encoded by <code>encodeURIComponent<\/code>. An unchanged character does not mean the calculator skipped the input.<\/li>\n<li><strong>Encode a value only once.<\/strong> An existing sequence such as <code>%20<\/code> contains a literal percent sign. Encoding it again produces <code>%2520<\/code>. Decode first if you need to replace an already encoded value.<\/li>\n<li><strong>Spaces are not plus signs here.<\/strong> This tool outputs <code>%20<\/code> for a space and <code>%2B<\/code> for a literal plus sign. Some HTML form submissions use <code>+<\/code> for spaces instead; this calculator does not apply that form-encoding convention.<\/li>\n<li><strong>Encoding is not encryption.<\/strong> Anyone can decode the result, so do not use it to hide passwords or other sensitive information. A rare malformed text value containing an unpaired UTF-16 surrogate can also cause JavaScript encoding to fail.<\/li>\n<\/ul>\n<p>If you first need to collect links from a larger passage, use the <a href=\"https:\/\/wpcalc.com\/en\/web-tools\/url-extractor\/\">URL Extractor<\/a>. If your task calls for Base64 rather than percent encoding, use the <a href=\"https:\/\/wpcalc.com\/en\/web-tools\/base64-encoder\/\">Base64 Encoder<\/a>; the two formats serve different purposes and produce different results.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Encode text or a URL with JavaScript-style percent encoding. Enter a value in Text or URL to get an encoded string you can copy.<\/p>\n","protected":false},"author":70,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[63],"tags":[64],"class_list":["post-64600","post","type-post","status-publish","format-standard","hentry","category-web-tools","tag-converter-tools"],"acf":[],"_links":{"self":[{"href":"https:\/\/wpcalc.com\/en\/wp-json\/wp\/v2\/posts\/64600","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpcalc.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpcalc.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpcalc.com\/en\/wp-json\/wp\/v2\/users\/70"}],"replies":[{"embeddable":true,"href":"https:\/\/wpcalc.com\/en\/wp-json\/wp\/v2\/comments?post=64600"}],"version-history":[{"count":3,"href":"https:\/\/wpcalc.com\/en\/wp-json\/wp\/v2\/posts\/64600\/revisions"}],"predecessor-version":[{"id":65350,"href":"https:\/\/wpcalc.com\/en\/wp-json\/wp\/v2\/posts\/64600\/revisions\/65350"}],"wp:attachment":[{"href":"https:\/\/wpcalc.com\/en\/wp-json\/wp\/v2\/media?parent=64600"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpcalc.com\/en\/wp-json\/wp\/v2\/categories?post=64600"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpcalc.com\/en\/wp-json\/wp\/v2\/tags?post=64600"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}