---
metadata:
  - name: generator
    content: Diplodoc Platform v5.39.1
alternate:
  - https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/examples/cases/geolink.md
  - https://yandex.com.tr/dev/jsapi-v2-1/doc/ru/v2-1/examples/cases/geolink.md
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.com.tr/dev/jsapi-v2-1/doc/en/llms.txt

# Geo link

<iframe id="LIVE-EXAMPLE" style="width:100%;height: 400px;border-radius: 8px;border: 1px solid rgba(92, 94, 102, 0.14);" frameBorder="0" src="https://yastatic.net/s3/front-maps-static/maps-front-jsapi-v2-1/examples/2/out/s3-cases/en/geolink/index.html" allow="fullscreen"></iframe>

<a target="_blank" rel="noopener noreferrer" style="display: inline-block;margin-top: 10px;cursor: pointer;border-radius: 4px;padding: 9px 12px;background: #151515;color: white;text-decoration: none;font-weight: 500" href="https://codesandbox.io/p/sandbox/yq2vyr?file=index.html">Open in CodeSandbox</a>

<p>A geolink is an easy way to add a link to Yandex.Maps on your website. Just wrap the desired address in special tags.
    When the geolink is clicked, it opens a popup window with the map and a marker at the specified address.
</p>
<p>
    Clicking the "About this location" button opens interactive Yandex.Maps with detailed information about the marked point.
</p>
<p>
    Clicking "How to get here" opens Yandex.Maps with the router enabled. The address specified is automatically set as the
	destination for the route on the map. The user just needs to specify the starting point.
</p>
<p>
    <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/dg/concepts/geolink-docpage/">Detailed description</a>.
</p>

{% list tabs %}

-   index.html

    ```html
    <!DOCTYPE html>
    <html>
        <head>
            <title>Examples. Geolink.</title>
            <meta
                http-equiv="Content-Type"
                content="text/html; charset=UTF-8"
            />
            <!--
            To add a geolink to a page, you need to download the API code with the Geolink module.
    
            Set your own API-key. Testing key is not valid for other web-sites and services.
            Get your API-key on the Developer Dashboard: https://developer.tech.yandex.ru/keys/
        -->
            
            
        </head>
        <body>
            <div id="box">
                <!-- To add a geolink to a page, you need to wrap the desired text in an HTML element with the "ymaps-geolink" CSS class
    	and download the API code with the Geolink module.-->
                <p>
                    <span class="ymaps-geolink"
                        >Moscow, Lva Tolstogo Street, 16</span
                    >
                    is the address of our office.
                </p>

                <!-- You can set various parameters for a geolink: search area of the object (data-bounds), object type (data-type),
    		and the text to display in the title of the popup (data-description). -->
                <p id="whiteText">
                    <span
                        class="ymaps-geolink"
                        data-bounds="[[55.73333783240489,37.586741441564136],
            [55.73433517114847,37.59017466910319]]"
                        data-type="biz"
                        >Cafes</span
                    >
                    near our office.
                </p>
                <p>
                    Take the metro to the station Park Kultury (on the ring).
                    Exit the metro station and go to the right along
                    Komsomolskiy Prospekt about 250 meters. Take another right
                    on Timura Frunze Street. Continue along this street until
                    you reach a red brick building with the sign "dom 11, str
                    2-5," where you will see a gate and a Yandex sign.
                </p>
                <p>
                    If you are going to Yandex.Money, go to
                    <span
                        class="ymaps-geolink"
                        data-bounds="[[55.63333783240489,37.486741441564136],
            [55.75433517114847,37.69017466910319]]"
                        data-type="geo"
                        >Lva Tolstogo, 18B</span
                    >.
                </p>
            </div>
        </body>
    </html>
    ```

{% endlist %}
