Link back to original language from Google-translated web page
Asked Answered
B

1

6

I have a client's site where we provide links to Google Translate via flag icons. I would like to provide a link back to the original language (English) from the translated result.

You can see what I've got so far in action on the top-right of any page at tesselaar.com

If you click one of the flags, the page gets translated and the flag icons are replaced with an English version. I would like this flag to link back, but as you can see it doesn't because Google Translate is rewriting the URL I give it. Does anyone know how to get around this?

Here's my code:

<?php

echo "<ul class=\"breadcrumb pull-right\">\n";

if (stripos($_SERVER['HTTP_REFERER'], "translate.google") !== false) { // page has been translated

  if (empty($_SESSION['return_url'])) $_SESSION['return_url'] = "tesselaar.com";

  echo "<li>View page in English:</li>\n";
  echo "<li><a target=\"_top\" href=\"http://" . $_SESSION['return_url'] . "\"><img src=\"/assets/img/flags/gb.gif\" width=\"16\" height=\"11\" title=\"English\" alt=\"English\"></a></li>\n";

} else { // regular site (not translated)

  $_SESSION['return_url'] = $_SERVER['REQUEST_URI'];

  echo "<li>Translate this page:</li>\n";
  echo "<li><a href=\"http://translate.google.com/translate?sl=en&tl=fr&u=tesselaar.com". $_SERVER['REQUEST_URI'] . "\"><img src=\"/assets/img/flags/fr.gif\" width=\"16\" height=\"11\" alt=\"French\"></a></li>\n";
  echo "<li><a href=\"http://translate.google.com/translate?sl=en&tl=de&u=tesselaar.com". $_SERVER['REQUEST_URI'] . "\"><img src=\"/assets/img/flags/de.gif\" width=\"16\" height=\"11\" alt=\"German\"></a></li>\n";
  echo "<li><a href=\"http://translate.google.com/translate?sl=en&tl=nl&u=tesselaar.com". $_SERVER['REQUEST_URI'] . "\"><img src=\"/assets/img/flags/nl.gif\" width=\"16\" height=\"11\" alt=\"Dutch\"></a></li>\n";
  echo "<li><a href=\"http://translate.google.com/translate?sl=en&tl=es&u=tesselaar.com". $_SERVER['REQUEST_URI'] . "\"><img src=\"/assets/img/flags/es.gif\" width=\"16\" height=\"11\" alt=\"Spanish\"></a></li>\n";
  echo "<li><a href=\"http://translate.google.com/translate?sl=en&tl=el&u=tesselaar.com". $_SERVER['REQUEST_URI'] . "\"><img src=\"/assets/img/flags/gr.gif\" width=\"16\" height=\"11\" alt=\"Greek\"></a></li>\n";

}

echo "</ul>\n\n";

?>

EDIT: Things I've tried, without success, since posting:

  • Wrapping various things in a "notranslate" span.
  • Using jQuery to try to rewrite the "link back" URL.
  • Using jQuery to intercept the "link back" click and rewrite the parent frame.
Brewer answered 23/9, 2012 at 21:19 Comment(1)
Just in case anyone looks at the site & wonders about the discrepancy: After trying various jQuery solutions (none of which work), I've given up for now & have disabled the flag & return link.Brewer
H
2

So i was able to solve your problem with jQuery. This is what I did:

<!-- inside your <head></head -->
<script src="http://code.jquery.com/jquery-1.10.0.min.js"></script>

<!-- inside your <body></body> -->
<?php $requestUri = str_replace('untranslate', '', $_SERVER['REQUEST_URI']); ?>
<ul class="breadcrumb pull-right">
    <?php if (stripos($_SERVER['HTTP_REFERER'], "translate.google") !== false && !isset($_GET['untranslate'])) : ?>
        <li class="notranslate">View page in English:</li>
        <li>
            <a class="untranslate" href="#">
                <img src="/assets/img/flags/gb.gif" width="16" height="11" alt="English" />
            </a>
        </li>
    <?php else: ?>
        <?php $uri = "http://translate.google.com/translate?sl=en&u=" . $_SERVER['HTTP_HOST']; ?>
        <li>Translate this page:</li>
        <li><a href="<?php echo $uri . $requestUri ?>&tl=fr"><img src="/assets/img/flags/fr.gif" width="16" height="11" alt="French" /></a></li>
        <li><a href="<?php echo $uri . $requestUri ?>&tl=de"><img src="/assets/img/flags/ed.gif" width="16" height="11" alt="German" /></a></li>
        <li><a href="<?php echo $uri . $requestUri ?>&tl=nl"><img src="/assets/img/flags/nl.gif" width="16" height="11" alt="Dutch" /></a></li>
        <li><a href="<?php echo $uri . $requestUri ?>&tl=es"><img src="/assets/img/flags/es.gif" width="16" height="11" alt="Spanish" /></a></li>
        <li><a href="<?php echo $uri . $requestUri ?>&tl=el"><img src="/assets/img/flags/gr.gif" width="16" height="11" alt="Greek" /></a></li>
    <?php endif; ?>
</ul>

<!-- right before your </body> or remove <script></script> and place in different js file -->
<script>
    $('.untranslate').click(function() {
        window.top.location = 'http://<?php echo $_SERVER['HTTP_HOST'] . $requestUri ?>?untranslate';
    });
</script>

So basically there is a link without a url with the class .untranslate and then jQuery waits for that to be clicked. Once it's clicked it will redirect the page to the original page untranslated version of your site. Also it passes a get parameter called untranslate because the redirect passes the translate.google HTTP_REFERER.

Hambley answered 6/6, 2013 at 18:25 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.