Search code examples
htmlformsgoogle-custom-search

Google CSE: breaks when I search with special characters like "é"


we have installed the custom search engine on our website.
It works fine until we try to search with accentuated letters.
Since the website is in french, it kinda needs to work...

So that if I search:
"poupee" -- works fine "poupee!" -- works fine too "poupée" -- doesn't work. The actual call to search on google is not even called

You can test it here:
poupée -- doesn't work:
http://www.ckoi.com/recherche.php?q=poup%E9e&sa=&cx=012997159615660210985%3Ask7xitg5ylq&cof=FORID%3A11&ie=ISO-8859-15&oe=ISO-8859-1&siteurl=www.ckoi.com%2F&ref=&ss=1994j797008j8

poupee -- works:
http://www.ckoi.com/recherche.php?q=poupee&sa=&cx=012997159615660210985%3Ask7xitg5ylq&cof=FORID%3A11&ie=ISO-8859-15&oe=ISO-8859-1&siteurl=www.ckoi.com%2F&ref=&ss=776j143854j6

poupee! -- works:
http://www.ckoi.com/recherche.php?q=poupee!&sa=&cx=012997159615660210985%3Ask7xitg5ylq&cof=FORID%3A11&ie=ISO-8859-15&oe=ISO-8859-1&siteurl=www.ckoi.com%2F&ref=&ss=2272j1680258j8

And the custom engine has been set to be in french.

----- EDIT: Here is the html form, which I switched back to ISO-8859-1 (the encoding of my website)

<div class="search-form">           
    <form class="search-wrapper cf" action="/recherche.php" id="cse-search-box">
        <input type="text" placeholder="Rechercher des extraits audio, articles..." name="q" />
        <button type="submit" class="search-button" name="sa"><i class="icon ion-search"></i></button>
        <input type="hidden" name="cx" value="012997159615660210985:sk7xitg5ylq" />
        <input type="hidden" name="cof" value="FORID:11" />
        <input type="hidden" name="ie" value="ISO-8859-1" original_value="ISO-8859-1" /> <!--value="ISO-8859-15"-->
        <input type="hidden" name="oe" value="ISO-8859-1" original_value="ISO-8859-1" /><!--value="ISO-8859-1"-->
    </form>
    <script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&lang=fr"></script>
</div>

Anyone knows what I need to do?


Solution

  • I would just define the encoding for that form (accept-charset="utf-8") that should work fine.

    <div class="search-form">           
        <form class="search-wrapper cf" action="/recherche.php" id="cse-search-box" accept-charset="utf-8">
            <input type="text" placeholder="Rechercher des extraits audio, articles..." name="q" />
            <button type="submit" class="search-button" name="sa"><i class="icon ion-search"></i></button>
            <input type="hidden" name="cx" value="012997159615660210985:sk7xitg5ylq" />
            <input type="hidden" name="cof" value="FORID:11" />
            <input type="hidden" name="ie" value="utf-8" />
            <input type="hidden" name="oe" value="utf-8" />
        </form>
        <script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&lang=fr"></script>
    </div>
    

    With this jsfiddle you can check it live: http://jsfiddle.net/129d21nv/

    However on that site you have still an encoding problem, but this is IMHO a diffrent problem.