Svelte component for Google Publisher Tags
[](https://www.npmjs.com/package/@rigu/svelte-gpt)
## Svelte-gpt
Svelte library to render google ADS using google gpt (Google Publisher Tags)
### Installation
```
npm install @rigu/svelte-gpt
```
```
yarn add @rigu/svelte-gpt
```
### Usage
In your `app.html` file, in the `` tag insert the script to load the Google Publisher Tags
```HTML
...
...
```
In the `svelte` component you can import the `` component to load ADS that you want.
```
```
### Properties
| Prop | Type | Default | Description |
|---------------|--------|----------------------|----------------------------------------------------------------------------------------------------------------------|
| networkCode | string | undefined | Your `Network code` from Google Ad Manager |
| unitCode | string | undefined | The `Ad unit code` that should be displayed |
| containerId | string | 'svelte-gpt-ad-slot' | ID attribute for `` container where the banner will be injected.
It is used also to define the gpt `Slot` |
| maxHeight | number | 60 | The value for `max-height` CSS style of the container |
| size | number | [] | List of sizes that are provided for this `Ad unit` |
| sizeMapping | number | {} | Map of the sizes, to create a responsive `Slot` |
### CSS custom properties (variables)
You can style a component by overriding [the available CSS custom properties]
```
```
[](https://opensource.org/licenses/MIT)