How-to Guide 5 min read

How to URL-Encode a Query Parameter (Not the Whole URL)

Encode only the value inside a query string, not the full link. See what &, +, #, spaces and ₹ turn into, why links break, and how to avoid double encoding.

url encode query parameterencodeuricomponent vs encodeuriurl encode ampersandspace %20 or plusdouble url encoding %2520

The short answer

When you add text to a link, URL-encode only the value of each parameter, not the whole URL. For a search for "chai & samosa", the value becomes chai%20%26%20samosa, and the final link is https://example.com/search?q=chai%20%26%20samosa. If you encode the whole URL, https:// turns into https%3A%2F%2F and the link stops working. The free URL Encoder/Decoder encodes exactly the text you paste, so paste just the value.

Why only the value?

A URL uses certain characters as structure:

  • ? marks the start of the query string.
  • & separates one parameter from the next.
  • = separates a parameter name from its value.
  • # starts the fragment, which is never sent to the server.
  • / and : divide the address into parts.

If your value contains any of these, the browser or server will read them as structure. A product called "rock&roll" in ?q=rock&roll is read as q=rock plus a second parameter called roll. Encoding the value turns & into %26, so it is treated as data.

But the structural characters in the rest of the URL must stay as they are. That is why you encode piece by piece.

What the URL Encoder does

The tool has two tabs.

  • Encode URL runs your text through JavaScript's encodeURIComponent. It percent-encodes every character except letters, digits and - _ . ! ~ * ' ( ).
  • Decode URL runs valid percent-encoded text through decodeURIComponent and turns sequences like %20 back into characters.

The result appears below the input as you type, with a Copy button. Switching tabs clears the box. Encoding happens in your browser.

What common characters become

These results come from the encoder (that is, from encodeURIComponent).

Your textEncoded
chai & samosachai%20%26%20samosa
a+b=ca%2Bb%3Dc
100%100%25
#hashtag%23hashtag
rock&roll/blues?rock%26roll%2Fblues%3F
name@example.comname%40example.com
₹500 off%E2%82%B9500%20off
Tom's café (2026)Tom's%20caf%C3%A9%20(2026)

Non-English characters such as ₹ or é are first converted to their UTF-8 bytes, and each byte becomes a %XX code. That is why one ₹ sign becomes nine characters.

Building a link step by step

  • Start with the base address and path: https://example.com/search
  • Encode each value separately in the encoder. "rock&roll #1" becomes rock%26roll%20%231.
  • Join them: add ?, then name=value pairs separated by &.
  • Result: https://example.com/search?q=rock%26roll%20%231&lang=en

    • Only the values were encoded. The ?, = and & that give the link its structure were left alone.

    Doing it in code

    In JavaScript, encode each value with encodeURIComponent:

    const url = "https://example.com/search?q=" + encodeURIComponent(query)

    Or let the browser do it with the URL and URLSearchParams objects, which encode each value for you:

    const u = new URL("https://example.com/search"); u.searchParams.set("q", "rock&roll #1")

    That produces https://example.com/search?q=rock%26roll+%231. Notice the space became + rather than %20. That is the HTML form style of encoding, and servers that read query strings normally accept both.

    Avoid JavaScript's encodeURI for parameter values. It is meant for complete URLs, so it leaves &, =, ?, # and / unencoded, which is exactly what breaks a value.

    %20 or +?

    StyleSpace becomesUsed by
    Percent-encoding%20encodeURIComponent, this encoder, paths and most APIs
    Form encoding+HTML forms, URLSearchParams

    The catch: in form encoding a literal plus sign must be written as %2B, otherwise the server reads it as a space. A phone number like "+91 98..." sent unencoded can arrive as " 91 98...". Encoding the value first avoids this.

    Also note that the decoder in this tool uses decodeURIComponent, which does not turn + into a space. If you are decoding form-style data, replace + with a space first.

    Double encoding (%2520)

    If you see %2520 in a link, a value was encoded twice. The first pass turned the space into %20; the second pass encoded the % itself as %25. Encoding "chai samosa" twice gives chai%2520samosa. The fix is to encode raw text once, at the moment you build the URL, and never encode a value that already contains %XX codes.

    Real situations where this matters

    • UTM links for campaigns. A campaign name like "Diwali Sale & Offers" must be encoded as Diwali%20Sale%20%26%20Offers, or analytics will record only "Diwali Sale " and treat " Offers" as a separate, nameless parameter.
    • WhatsApp and email share links. Pre-filled message text goes into a parameter, so line breaks, & and ? must be encoded or the message gets cut off.
    • Redirect parameters. When one URL is passed inside another, such as ?next= after login, the inner URL is a value. Encode it completely, :// included, so its own ? and & don't mix with the outer link.
    • API calls. Search terms, email addresses and dates with + time zones (for example +05:30) all need encoding when sent in a query string.

    How to check an encoded link

  • Paste the full link into your browser's address bar and press Enter.
  • Look at what the page received. A search page should show your whole search term, including the & or # part.
  • If something is missing, copy the value alone into the encoder's Decode URL tab to see what was actually sent.
  • If you see %25 in the decoded result, the value was encoded twice.

    • Common mistakes

    • Encoding the whole URL. Encode values, not the address.
    • Forgetting #. An unencoded # cuts the value short, because everything after it becomes the fragment.
    • Leaving + in a value. Encode it as %2B if the server uses form decoding.
    • Encoding twice. Look for %25 followed by two hex digits.
    • Using Base64 instead. Base64 output can contain +, / and =, which still need URL encoding. See Base64 encoding explained for when Base64 is the right tool.

    Related tools and guides

    For the background on why URLs need encoding at all, read URL encoding and decoding explained. If you are encoding data rather than text, the Base64 Encoder may be what you need, and the JSON Formatter helps when the value you are sending is JSON.

    Frequently asked questions

    Should I URL-encode the whole URL?

    No. Encode each query parameter value separately and then join it to the rest of the URL. Encoding the full link turns :// and ? into %3A%2F%2F and %3F, which breaks it.

    Is a space %20 or + in a URL?

    Both are used. Percent-encoding, which the Lazyblink URL Encoder and JavaScript's encodeURIComponent use, writes a space as %20. HTML form encoding and URLSearchParams write it as +. Most servers accept either in a query string.

    How do I encode an ampersand in a URL?

    Encode it as %26 inside a parameter value. An unencoded & starts a new parameter, so q=rock&roll is read as q=rock plus an empty parameter called roll.

    What is %2520 in a URL?

    It is a double-encoded space. The space became %20, and then the % sign was encoded again as %25. Encode a value only once.

    Which characters does encodeURIComponent leave unchanged?

    Letters A to Z and a to z, digits 0 to 9 and the characters - _ . ! ~ * ' ( ). Everything else, including spaces, &, =, +, /, ?, # and non-English characters, is percent-encoded.

    Try this tool on Lazyblink

    Put this guide into practice with our free online tool — no signup required.

    Open tool