# A CMS widgettárolója: 43 widget és hogyan add hozzá őket

> Körút a totaljs/cms-widgets tárolóban, a Total.js CMS hivatalos widgetjeinél: mit fednek le, melyek jelennek meg a szerveren, hogyan készül a db.json, és hogyan telepíthetsz egy widgetet fájlból.

Framework: cms
Product: CMS (cms@8071e48)
Language: hu
Content-SHA256: 84d71e7f49b35bec8411f895101243d346ae39b67cd9b6c48e9fac38286bdf16
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: 
Review: not-recorded

A [`totaljs/cms-widgets`](https://github.com/totaljs/cms-widgets) a Total.js CMS hivatalos widgeteit tartalmazza. Az itt dokumentált revízióban (`dc92cb7`) **43 widget** van a `widgets/` mappában, egyenként egy HTML fájl, mind a *Content* csoportban, valamint a katalógust előállító szkript (`db.js`). Az egyes fájlok formátumát a [widgetek](/en/cms/widgets/) írja le.

## Mit fednek le

A tároló az összes widgetet egy csoportba teszi; az alábbi táblázat csak aszerint rendezi őket, amit a nevük sugall, hogy könnyebben megtaláld őket.

| Fajta | Widgetek |
|---|---|
| Szöveg | `headline`, `paragraph`, `paragraph2`, `article`, `alert`, `list`, `keyvalue`, `properties`, `summary`, `tags`, `code`, `codehighlighter` |
| Elrendezés | `container`, `vcontainer`, `columns100`, `columnshalfs`, `columnsthirds`, `panelsthirds`, `box`, `emptyspace`, `line`, `gradient` |
| Szöveg képpel | `textimageleft`, `textimageright`, `textimagecenter`, `textimageflex`, `features2`, `features3`, `insight`, `team`, `partners`, `expansionlist` |
| Képek és média | `picture`, `images`, `imagelinks`, `gallery`, `video`, `bufferwall` |
| Hivatkozások és gombok | `linkbutton`, `buttonsgroup`, `socialnetworks` |
| Integráció | `importer`, `uibuilder` (lásd [UI Builder](/en/uibuilder/what-is-uibuilder/)) |

Kilenc közülük az `exports.render` segítségével építi fel a HTML-jét a szerveren (`bufferwall`, `code`, `codehighlighter`, `images`, `imagelinks`, `importer`, `picture`, `partners` és `uibuilder`); a többi statikus blokk, amelyet a szerkesztő beállít, a CMS pedig változatlanul kiszolgál.

## Widget hozzáadása a CMS-edhez

Minden fájl egy teljes widget. Az adminban nyisd meg a *Widgets* bővítményt, és importáld a fájlt, vagy küldd el az API-val:

```json
{ "schema": "widgets_save", "data": { "html": "<the content of headline.html>", "singleton": true } }
```

Küldd `POST` kéréssel a `/admin/` címre a munkamenet-cookie-val vagy az `x-token` fejléccel ([az admin API](/en/cms/the-admin-api/)).

## A katalógus: `db.json`

A szerkesztő egy katalógus widgetjeit tudja listázni. A `db.js` hozza létre: beolvassa a `widgets/` minden fájlját, az `exports` részből kiveszi a `name`, `author` és `preview` értéket, felépíti a `https://cdn.totaljs.com/cms/<file>` címet, és névsorba rendezve írja a `db.json` fájlt, widgetenként egy bejegyzéssel (`id`, `name`, `url`, `author`, `preview`). A `db.js` a `require('total4')` sorral kezdődik, ezért a futtatásához Total.js 4 kell, mint a Flow komponenstárolójában ([a komponenstároló](/en/flow/the-components-repository/)).

## A saját widgetjeid

Másold le a legközelebbi widgetet, változtasd meg az `exports.id` és `exports.name` értéket, és igazítsd a stílust, a tervet és a beállításokat. Ha a widgetnek könyvtár kell, sorold fel az `exports.dependencies` mezőben, és a CMS hozzáadja az azt használó oldalak fejlécéhez.