Instalacja widgetu rozkładzik.pl na stronie

1. Wybierz miasto

Białystok Bielsko-Biała Bolesławiec Bydgoszcz Chełm Chrzanów Częstochowa Elbląg Głogów Gniezno GOP Gorzów Wielkopolski Grudziądz Jaworzno Kielce Konin Koszalin Kraków Lubin Lublin Łódź Malbork Mińsk Mazowiecki PKS Mrągowo Olkusz Olsztyn Opole Piła Piotrków Trybunalski Płock Poznań Racibórz Radom Rybnik Rzeszów Siedlce Starachowice Starogard Gdański Szczecin Tarnów Toruń Trójmiasto Tychy Wałbrzych Warszawa Wrocław

2. Umieść poniższy kod w sekcji head swojej strony

<script type="text/javascript" src="https://www.rozkladzik.mmpk.info/js/libs/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="https://www.rozkladzik.mmpk.info/js/libs/jquery-ui-1.9.2.custom.min.js"></script>
<script type="text/javascript" src="https://www.rozkladzik.mmpk.info/warszawa/widget.js"></script>
<link rel="stylesheet" href="https://www.rozkladzik.mmpk.info/css/jq/jquery-ui-1.9.2.custom.css">
<link rel="stylesheet" href="https://www.rozkladzik.mmpk.info/css/widget.css">

3. Umieść poniższy kod w miejscu gdzie ma być wyświetlany widget

<form id="rozkladzikWidget" accept-charset="utf-8" method="get" action="https://www.rozkladzik.pl/warszawa/index.html" target="_blank">
    <fieldset>
        <legend><a href="https://www.rozkladzik.pl" target="_blank" title="Wyszukiwarka połączeń komunikacji miejskiej"><img src="https://www.rozkladzik.mmpk.info/img/logo_100.png"></a></legend>
        <input id="rozkladzik_bsFrom" class="bsName" type="text" value="Przystanek początkowy" title="Przystanek początkowy"><br>
        <input id="rozkladzik_bsTo" class="bsName" type="text" value="Przystanek końcowy" title="Przystanek końcowy"><br>

        <input id="rozkladzik_time" style="width: 50px" type="text" title="Godzina rozpoczęcia podróży">
        <select id="rozkladzik_day" style="width: 185px" title="Dzień rozpoczęcia podróży">
            <option value="0">Poniedziałek</option>
            <option value="1">Wtorek</option>
            <option value="2">Środa</option>
            <option value="3">Czwartek</option>
            <option value="4">Piątek</option>
            <option value="5">Sobota</option>
            <option value="6">Niedziela</option>
        </select>

        <input name="time" id="rozkladzik_time_hidden" type="hidden">
        <input name="from" id="rozkladzik_from_hidden" type="hidden">
        <input name="to" id="rozkladzik_to_hidden" type="hidden">
        <input value="Wyszukaj połączenie" style="background-color: #ccffff; width: 100%" type="submit">
    </fieldset>
</form>

Przykład

Jeśli chcesz zmienić szerokość lub wygląd widgetu nie dodawaj linii

<link rel="stylesheet" href="https://www.rozkladzik.mmpk.info/css/widget.css">

do sekcji head. Dodaj natomiast jego zawartość do sekcji head i zmodyfikuj odpowiednie wartości stylu css.