# Helyőrzők testreszabása, iframe-ek és térképek

> Közösségi helyőrzők cseréje, saját helyőrző iframe-hez a szkriptközpontban, valamint az Avada és a WP Adverts Google Maps-blokkolása.

## Közösségi helyőrzők

A közösségi tartalmak (Facebook, Instagram, Twitter és más) blokkolt helyén a Complianz helyőrző képet mutat. Az ábra szerint a gomb („Click here to accept all cookies”) nem része a képnek: ha a helyőrző aktív, a Complianz átfedésként teszi rá.

### Stílus kiválasztása

A helyőrző stílusát a **Complianz → Tools → Placeholders** oldal **Placeholder style** választójával állíthatod (alapérték: **Default**). A kiválasztott stílus előnézete az oldalon látszik, így azonnal láthatod az eredményt.

![A Placeholders oldal a helyőrző szövegeivel és a Placeholder style választóval](./kepek/blokkolas-helyorzok-helyorzok-beallitas.webp)

*A Placeholders oldal a helyőrző szövegeivel és a Placeholder style választóval* (https://minta-bolt.hu/wp-admin/admin.php?page=complianz)

Az oldal fő mezői:

| Beállítás | Mit csinál | Alapérték |
| --- | --- | --- |
| **Disable placeholder insertion** | Kikapcsolja a helyőrzők beszúrását. | Ki |
| **Blocked content text** (kategória) | A blokkolt tartalom szövege. A `{category}` karaktersort ne módosítsd és ne fordítsd le: a bővítmény a blokkolt kategória nevére cseréli (el is hagyhatod). | Click to accept {category} cookies and enable this content |
| **Blocked content text** (szolgáltatás) | Ugyanez a szolgáltatásra. A `{service}` karaktersort ne módosítsd. | Click 'I agree' to enable {service} |
| **Text on 'I agree' button** | Az elfogadó gomb felirata. | I agree |
| **Placeholder style** | A helyőrző stílusa. | Default |

### Saját helyőrző kép feltöltése FTP-vel

Ha a saját fiókodhoz vagy a webhelyed arculatához szeretnéd igazítani a helyőrzőt (például az Instagramét), a téma mappájába tett fájlokkal felülírhatod a bővítmény alapértelmezett képét. Ehhez (s)FTP-hozzáférés vagy a tárhely fájlkezelője kell.

1. Hozz létre egy mappát a témád mappájában, a gyökérben. A mappa neve a bővítmény változatától függ: `complianz-gdpr` (ingyenes), `complianz-gdpr-premium` (prémium) vagy `complianz-gdpr-premium-multisite` (prémium multisite). Például: `wp-content/themes/a-te-temad/complianz-gdpr-premium`.
2. Tedd a mappába a helyőrzőként használni kívánt képet. Az alapértelmezett helyőrzőhöz a fájl neve `placeholder.jpg`, az egyes szolgáltatásokhoz `placeholder-<szolgáltatás>.jpg` (például `instagram-minimal.jpg`).
3. Ellenőrizd az oldalon, hogy a helyőrző megváltozott, és hogy az elfogadó gomb („Accept All Cookies”) jól látszik rajta.

A közösségi helyőrzők külön, szolgáltatásonként eltérő képei a 3.1-es változattól kezdve vannak meg; az 5.5-ös változattól a stílus is választható és személyre szabható.

A felülírandó fájl nevét az oldalon találod meg: a böngésző fejlesztői eszközével (jobb klikk, **Inspect**) jelöld ki a helyőrző blokkot, és nézd meg a `data-placeholder-image` attribútumot. Ha például ez áll benne:

```html
data-placeholder-image="https://a-te-oldalad.hu/wp-content/plugins/complianz-gdpr-premium/assets/images/placeholders/default-minimal.jpg"
```

akkor a saját, `.jpg` formátumú képedet pontosan ugyanezen a néven (`default-minimal.jpg`) töltsd fel a téma mappájába:

```text
/wp-content/themes/a-te-temad/complianz-gdpr-premium/default-minimal.jpg
```

Ha a fájlokat a tárhely fájlkezelőjével vagy egy fájlkezelő bővítménnyel töltöd fel, az is megfelel.

### Saját helyőrző kép kóddal

FTP nélkül is lecserélheted a képet: tedd a következő kódot a téma `functions.php` fájljába, egy MU-pluginba vagy egy saját bővítménybe, és a `https://a-te-oldalad.hu/sajat-helyorzo.jpg` helyére írd a saját kép URL-jét. (MU-pluginban a fájl az első `<?php` sorral kezdődik; `functions.php`-ban az első sort ne ismételd.)

```php
<?php
// Egyéni helyőrző beállítása
function cmplz_my_custom_default_placeholder( $new_src, $src ) {
	$new_src = 'https://a-te-oldalad.hu/sajat-helyorzo.jpg';
	return $new_src;
}
// A kívánt szolgáltatás szűrőjével cseréld a helyőrzőt (itt: az alapértelmezett, YouTube)
add_filter( 'cmplz_placeholder_default', 'cmplz_my_custom_default_placeholder', 10, 2 );
```

Egy szolgáltatás helyőrzője a szűrő nevének cseréjével állítható. A saját képed az adott szolgáltatás összes helyőrzőjét felváltja.

| Szolgáltatás | Szűrő |
| --- | --- |
| YouTube (alapértelmezett) | `cmplz_placeholder_default` |
| Google Maps | `cmplz_placeholder_google-maps` |
| Facebook | `cmplz_placeholder_facebook` |
| Instagram | `cmplz_placeholder_instagram` |
| Google reCAPTCHA | `cmplz_placeholder_google-recaptcha` |
| Twitter | `cmplz_placeholder_twitter` |
| SoundCloud | `cmplz_placeholder_soundcloud` |
| Spotify | `cmplz_placeholder_spotify` |
| TED | `cmplz_placeholder_ted` |
| OpenStreetMap | `cmplz_placeholder_open-street-maps` |
| Calendly | `cmplz_placeholder_calendly` |
| Vimeo | `cmplz_placeholder_vimeo` |

Cserélés után ellenőrizd az oldalon, hogy az új kép látszik, és hogy a rajta lévő **Accept All Cookies** gomb jól olvasható.

## Helyőrző saját iframe-hez a szkriptközpontban

Az iframe-eket a **Complianz → Integrations → Script Center** oldalon blokkolhatod. A blokkolás önmagában nem távolítja el az iframe HTML-jét az oldalról, így hozzájárulásig üres tartalomblokk marad a helyén. Hogy a látogató értse, mi történt, tegyél a helyére helyőrzőt elfogadó gombbal.

![A szkriptközpont három listája: szkript hozzáadása, blokkolás és engedélyezési lista](./kepek/blokkolas-helyorzok-szkriptkozpont.webp)

*A szkriptközpont három listája: szkript hozzáadása, blokkolás és engedélyezési lista* (https://minta-bolt.hu/wp-admin/admin.php?page=complianz&id=integrations)

A képen a három lista látszik, mindegyik alatt az **Új hozzáadása** gombbal. Az iframe-ek blokkolására a **Szkript, iframe vagy bővítmény blokkolása** lista való: ide egy vagy több (vesszővel elválasztott) URL-t írhatsz. Ha az iframe szkriptet is tölt, azt a szkript blokkolására szolgáló mezővel kell blokkolni.

### Példa: Calendly

Az oldalon ez az iframe-szerű blokk van, amelynek az osztályai között ott a `placeholder-inactive`:

```html
<div class="calendly-inline-widget placeholder-inactive" style="min-width: 320px; height: 730px;" data-url="https://calendly.com/username"></div>
<script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js"></script>
```

A szkriptközpontban ehhez ezt kell megadni:

- szkript URL-je: `calendly.com/assets/external/widget.js`
- iframe URL-je: `calendly.com`

### A helyőrző beillesztése

A helyőrző egy `div`, amelyet az iframe alá teszel:

```html
<div class="cmplz-blocked-content-container cmplz-blocked-content-notice cmplz-accept-{category} cmplz-accept-{service} placeholder-active" style="text-align: center; cursor: pointer;">Click here to accept marketing cookies before loading this iFrame.</div>
```

A szöveg tetszőlegesen átírható. A `{category}` helyére a kategória neve kerül (például `marketing`), a `{service}` helyére a szolgáltatásé (például `google-recaptcha`). Utána ellenőrizd, hogy az iframe hozzájárulásig blokkolva van, a helyőrző szövege hozzájárulás előtt látszik, utána pedig eltűnik.

### Stílus

Az iframe osztálya a `placeholder-inactive`, a helyőrzőé a `placeholder-active`. Ezekkel tölthető ki az iframe helye, és formázható a gomb:

```css
.placeholder-active { background: #f2f2f2; min-width:320px; height:inherit; color:#333; border-radius:3px; vertical-align: middle; text-decoration:underline; font-size:1.2em; align-content: center; padding:50px; margin-top: -475px; }

.placeholder-inactive { border: 1px solid #dedede; border-radius:3px; }
```

A 6.0-s változattól a helyőrzőt közvetlenül a szkriptközpontban is megadhatod.

## Avada: Google Térkép

Az Avada beépített Google Maps eleme csak az **Embed** és a **Static** API-val tud hozzájárulással működni.

- Legjobb eredményt az **Embed API** ad. Kevesebb beállítást enged, de a legtöbb esetben elég.
- Az alapértelmezett és a JavaScript API esetén a Complianz nem tudja feldolgozni a térképet, mert a tartalom egy üres tárolóba töltődik be dinamikusan, így sem a helyőrző, sem a sütiblokkoló nem működik rajta. A megoldás a WP Consent API-integráció lehetne, ehhez azonban az Avada közreműködése kell.

## WP Adverts: térképek és helyek

A Complianz a WP Adverts „Maps and Locations” kiegészítőjével együttműködik. Ha a bővítmény aktív, a Complianz magától felismeri, és hozzájárulásig blokkolja ezeket a Google Maps-megoldásokat:

- egy hirdetés térképe (a hirdetés adatlapján);
- több hirdetés térképe (az `[adverts_mal_map]` shortcode);
- a Google automatikus kiegészítése (a hirdetés felvétele és a hirdetéslista oldalon).

A Google Maps integrációt a **Complianz → Integrations → Services** oldalon is be kell kapcsolnod.

### Beállítás a WP Adverts oldalán

1. Add meg a Google API-kulcsot: **Classifieds → Options → Maps and Locations**.
2. A hirdetés adatlapján a kiegészítő beállításaival jeleníthető meg a Google-térkép; a Complianz ezt hozzájárulásig blokkolja.
3. Az `[adverts_add]` és `[adverts_list]` oldalakon: ha a Hely mezőnél az **Use Google Autocomplete** be van kapcsolva, az automatikus kiegészítés csak a hozzájárulás után működik, mert addig a Google Maps API blokkolva van.

## A Google Térkép helyőrzőjének módosítása

A videók helyőrzői (Vimeo, YouTube, Dailymotion) a videó bélyegképéből készülnek, és a feltöltések mappába töltődnek le. Más szolgáltatásokhoz, például a Facebookhoz vagy a Google Térképhez a Complianz saját helyőrzőt ad, amelyet átállíthatsz, hogy illeszkedjen a helyszínhez vagy a térkép stílusához.

A Google Térkép helyőrzőjénél a Complianz beállításaiban kiválaszthatod a képarányt és a stílust is (Complianz Premium 5.5 vagy újabb). Próbáld ki a változatokat: a kiválasztott beállítás a helyőrzőn azonnal látszik. A helyőrzők közös beállításait lásd feljebb, a „Közösségi helyőrzők” szakaszban.