# Időjárás widget

> A Weatherbit.io és az OpenWeatherMap API-kulcs beszerzése, és az Időjárás widget beállításai: hely, mértékegység, aktuális időjárás, előrejelzés.

Az **Időjárás** (Weather) widget az aktuális időjárást és az előrejelzést mutatja egy megadott helyre. Két szolgáltató ingyenes csomagjával működik: a Weatherbit.io és az OpenWeatherMap szolgáltatással. Mindkettő ad aktuális és korábbi napi adatot is, valamint előrejelzést. Az ingyenes csomagjuk korlátozott, a Weatherbité több lehetőséget nyújt.

## Követelmények

- Elementor és JetElements.
- Legalább az egyik szolgáltató API-kulcsa.

Ha az oldalad kereskedelmi célú, a szolgáltató használati feltételeinek megfelelő díjcsomagot kell választanod.

## API-kulcs beszerzése

### Weatherbit.io

1. A Weatherbit.io oldalán regisztrálj: add meg az e-mail-címedet, a felhasználónevedet és a jelszavadat, majd kattints a **Create Account** gombra.
2. A következő oldalon további adatokat kér. Elég a csillaggal (*) jelölt kötelező mezőket kitölteni. Kattints a **Proceed to Dashboard** gombra.
3. A vezérlőpulton, az **API Key** részben megtalálod a generált kulcsot. Másold ki.

### OpenWeatherMap

1. Az OpenWeatherMap oldalán jelentkezz be, vagy hozz létre új fiókot (felhasználónév, e-mail-cím, jelszó). A fiókot a postaládádba érkező hivatkozással igazold vissza.
2. A fiókban nyisd meg az **API** fület, és másold ki az alapértelmezett kulcsot, vagy a **Generate** gombbal hozz létre újat.

## A kulcs megadása

1. Nyisd meg a **Crocoblock → JetPlugins Settings** oldalt, a **JetElements** csoportot, azon belül az **Integrations** aloldalt.
2. A Weatherbit.io kulcsát a **Weatherbit.io API-kulcs** mezőbe illeszd, az OpenWeatherMap kulcsát az **OpenWeatherMap API Key** mezőbe.

![A JetElements integrációs beállításai a két időjárás-szolgáltató mezőjével](./kepek/integraciok.webp)

*A JetElements integrációs beállításai a két időjárás-szolgáltató mezőjével* (https://minta-bolt.hu/wp-admin/admin.php?page=jet-dashboard-settings-page&subpage=jet-elements-integrations-settings)

A kép alján a **Weatherbit.io API** és az **OpenWeatherMap API** blokk látszik a kulcsmezőkkel.

## A widget bekapcsolása

1. Nyisd meg a **Crocoblock → JetPlugins Settings → JetElements → Widgets & Extensions** oldalt.
2. Kapcsold be az **Időjárás** (Weather) widget kapcsolóját. A módosítás maga ment.

## A widget az oldalon

1. Nyisd meg az oldalt az Elementorral, keresd meg az **Időjárás** widgetet, és húzd a kívánt szakaszba.
2. A widget hozzáadás után maga jeleníti meg az adatokat.

A **Tartalom** fülön két blokk van: **Időjárás** és **Beállítások**.

### Időjárás blokk

| Beállítás | Mit csinál | Alapérték |
| --- | --- | --- |
| **Weather API Provider** | A szolgáltató: **Weatherbit (default)** a Weatherbit.io kulcsot, **OpenWeatherMap (free)** az OpenWeatherMap kulcsot használja | Weatherbit |
| **Hely** | A település, az állam (nem kötelező) és az ország (nem kötelező) megadása, például „London, UK”. A dinamikus címke ikonnal más mezőből is átveheted | üres |
| **Egységek** | **Metrikus** (Celsius) vagy az angolszász mértékegységek (Fahrenheit) | Metrikus |
| **Időformátum** | 12 vagy 24 órás időformátum | 12 órás |

![Az Időjárás widget Időjárás blokkja](./kepek/integraciok-idojaras-beallitasok.webp)

*Az Időjárás widget Időjárás blokkja* (https://minta-bolt.hu/wp-admin/post.php?post=5&action=elementor)

A kép a **Beállítások** blokkot mutatja nyitva; fölötte az **Időjárás** blokk összecsukva látszik.

### Beállítások blokk

| Beállítás | Mit csinál | Alapérték |
| --- | --- | --- |
| **Cím megjelenítése** | Megmutatja a város nevét; bekapcsolva megjelenik a **Cím szövege** és a **Cím HTML-címkéje** | Igen |
| **Cím szövege** | **API által visszaadott**, **Helyből** vagy **Egyéni** | API által visszaadott |
| **Cím HTML-címkéje** | A cím címsorszintje (H1 és a többi) | H3 |
| **Országnév megjelenítése** | Az ország neve is látszik | Nem |
| **Aktuális időjárás megjelenítése** | A jelenlegi időjárás | Igen |
| **Show current weather details (UTC+0)** | Részletek: páratartalom, szélsebesség, legmagasabb és legalacsonyabb hőmérséklet és egyebek | Nem |
| **Időjárás-előrejelzés megjelenítése** | Bekapcsolva megjelenik a napok számának választója (1-től 7 napig) | Nem |

### Stílus és Haladó fül

A **Stílus** fülön a cím, az aktuális időjárás, a részletek és az előrejelzés kinézetét állíthatod: szín, betűtípus, igazítás, margó, belső margó, árnyék és egyéb. A **Haladó** fülön az elrendezés, a dinamikus láthatóság, a szegély és a többi szokásos Elementor-beállítás van.