{"_id":"@altinget/gpt-ads-module","name":"@altinget/gpt-ads-module","dist-tags":{"latest":"0.6.0"},"versions":{"0.6.0":{"name":"@altinget/gpt-ads-module","version":"0.6.0","description":"Google Publisher Tag ads integration for Nuxt","license":"MIT","contributors":[{"name":"Paul Gascou-Vaillancourt","email":"paul@ax2.ca"}],"main":"lib/module.js","repository":{"type":"git","url":"git+https://github.com/Altinget/gpt-ad.git"},"homepage":"https://github.com/Altinget/gpt-ad/nuxt-modules/tree/master/packages/gpt-ads#readme","publishConfig":{"access":"public"},"devDependencies":{"codecov":"latest","eslint":"5.13.0","eslint-config-airbnb-base":"13.1.0","eslint-loader":"2.1.2","eslint-plugin-import":"2.16.0","eslint-plugin-jest":"22.3.0","eslint-plugin-vue":"5.2.1","jest":"24.1.0","jsdom":"15.0.0","nuxt":"2.4.3","request-promise-native":"1.0.5","standard-version":"latest"},"gitHead":"db930bf38f5eec5696ad7978a68656436831fc59","bugs":{"url":"https://github.com/Altinget/gpt-ad/issues"},"_id":"@altinget/gpt-ads-module@0.6.0","_nodeVersion":"14.18.1","_npmVersion":"8.1.3","dist":{"integrity":"sha512-vZRO6qjOlgJZtzzdXAvDqoebtkI6l51pwXFa6Tq9iG3Jx0qnvldNiOkZfi6QELQYbfSqvLYRtVw/UH7ClGI48A==","shasum":"2a13f222ab88905dd467c41e3eb9c318590f0198","tarball":"https://registry.npmjs.org/@altinget/gpt-ads-module/-/gpt-ads-module-0.6.0.tgz","fileCount":6,"unpackedSize":16189,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDT+AaFs4SiZjRWfNaSZzcJ3GqYyMu5VKPKwnnlp65FIAIgKfDNwtcZzJLIqRMvptV/Ra/i8296Btvzkfg2NHqzahc="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjMvNNACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqx8w/7B0XPrN966osFoSw4OdF6+Ynxnkoz6Sbo+ZI1RmaftpjosQHk\r\neQuSho5nhSi0v9KKkVsxE6KEkJNVZxWBzv0NUTsmYzIrky3udr1GS7CMfZ4b\r\nKyLBMpKCHuhDysByLkQsfUSa4DRflqBLONnl6QTprKfjmib8iuxWepx4qb2J\r\nAW9LSrf3Jo5jcvwDGaTqYfcvEOc2sPhqF1izhYwqk4LNxdQvbJcPk3Ju79Hz\r\nBoyQVEifW5jYgTT8TPDKylVG62noppGmj4QSn3V5yel9EP693Kr/cqrGQrMN\r\ng2TMI9ff7msMBh58x3QHlmCffJITi6ecH5QILNhnx3hGNmZELHvjCZw2bWwb\r\nqP3f2e1v9S9yMrJ0dnsNtaoBJVjx3l8w34xEUkZ7fZkkCNu+PsCqGOn2nO9A\r\nZfoiDyxVtEnxLgBsRbID5aBhTZZvIjiLrORAsJdPquMlPskdpRIHvY385SI/\r\nqpq8XXPqHtpCbMOq1YBqI5zxUHHsbj1JcoMgdqLqJhZp7x8hI17hgHF0frS+\r\nf6mQtuaGUvpsRBMXcyZFzB1Ksd4M04Dh26mLYnIQ0A7Pe3Pu/iZWYRLrKq3t\r\nQPd3S4DYTe8+Y1XWKqfgbNrlRsNSIMfsgdzWP+VMoXNwHOjh4S+28l0Nv+fN\r\nEB+c1f/s78wGGPDhQ7LmtiiOijuIHP+j/Nc=\r\n=neJx\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"nichlas900","email":"nichlasbrodegaardlarsson@gmail.com"},"directories":{},"maintainers":[{"name":"pgraug","email":"pgn@altinget.dk"},{"name":"mikealtinget","email":"mike@altinget.dk"},{"name":"nichlas900","email":"nichlasbrodegaardlarsson@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/gpt-ads-module_0.6.0_1664283468994_0.317914167427243"},"_hasShrinkwrap":false}},"time":{"created":"2022-09-27T12:57:48.935Z","0.6.0":"2022-09-27T12:57:49.136Z","modified":"2022-09-27T12:57:49.416Z"},"maintainers":[{"name":"pgraug","email":"pgn@altinget.dk"},{"name":"mikealtinget","email":"mike@altinget.dk"},{"name":"nichlas900","email":"nichlasbrodegaardlarsson@gmail.com"}],"description":"Google Publisher Tag ads integration for Nuxt","homepage":"https://github.com/Altinget/gpt-ad/nuxt-modules/tree/master/packages/gpt-ads#readme","repository":{"type":"git","url":"git+https://github.com/Altinget/gpt-ad.git"},"contributors":[{"name":"Paul Gascou-Vaillancourt","email":"paul@ax2.ca"}],"bugs":{"url":"https://github.com/Altinget/gpt-ad/issues"},"license":"MIT","readme":"# gpt-ads-module\n[![npm (scoped with tag)](https://img.shields.io/npm/v/@ax2/gpt-ads-module/latest.svg?style=flat-square)](https://npmjs.com/package/@ax2/gpt-ads-module)\n[![npm](https://img.shields.io/npm/dt/@ax2/gpt-ads-module.svg?style=flat-square)](https://npmjs.com/package/@ax2/gpt-ads-module)\n[![Dependencies](https://david-dm.org/ax2inc/gpt-ads-module/status.svg?style=flat-square)](https://david-dm.org/ax2inc/gpt-ads-module)\n[![Code Style](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n> Google Publisher Tag ads integration for Nuxt\n\n[📖 **Release Notes**](./CHANGELOG.md)\n\n## Features\n\nIntegrate Google Publisher Tag with your Nuxt project.\n\n## Setup\n\n- Install the module with your favorite package manager.\n\n```sh\nyarn add @ax2/gpt-ads-module\n# Or npm i @ax2/gpt-ads-module\n```\n\n- Add `@ax2/gpt-ads-module` to `modules` section of `nuxt.config.js`.\n\n```js\n// nuxt.config.js\n\n{\n  modules: [\n    '@ax2/gpt-ads-module',\n ],\n}\n```\n\n- Configure the module as needed by adding a `gptAds` key to `nuxt.config.js`.\n\n```js\n// nuxt.config.js\n\n{\n  gptAds: {\n    // Module options\n  }\n}\n```\n\n## Options\n\n### networkCode\n\n- **Type**: `Array|String`: required\n\nYour network code as found in **Google Ad Manager > Admin > Global Settings**.\n\n### debug\n\n- **Type**: `Boolean`\n- **Default**: `false`\n\nEnable debug mode, when this is `true`, GPT console opens when the app loads.\n\n### componentName\n\n- **Type**: `String`\n- **Default**: `'GptAd'`\n\nName of the component that the module registers.\n\n### individualRefresh\n\n- **Type**: `Boolean`\n- **Default**: `false`\n\nIf enabled, ads won't be fetched on page load but will be refreshed individually as they are mounted.\n\n### responsive\n\n- **Type**: `Boolean`\n- **Default**: `false`\n\nSet to `true` to enable responsive mode for all ads slot. In responsive mode, ad slots listen to window resize events and refresh themselves if a different size mapping matches current window size.\n\n### collapseEmptyDivs\n\n- **Type**: `Boolean`\n- **Default**: `false`\n\nSet to `true` to have empty ad slots collapsed themselves, this can be overridden at slot-level with `collapseEmptyDiv` prop.\n\n### ghostMode\n\n- **Type**: `Boolean`\n- **Default**: `false`\n\nSet to `true` to enable ghost mode. With ghost mode enabled, ad slots aren't displayed and are replaced by empty bordered divs of the size the ads would have if they were displayed. This is useful during development where you might not want to display real ads.\n\n### emptyClass\n\n- **Type**: `String`\n- **Default**: `'is-empty'`\n\nClass to apply to empty ads slots.\n\n## Usage\n\nWhen the module is enabled, it registers a global Vue component that you can use to display ads in your app. By default, the component's name is **GptAd** but this can be changed via the `componentName` option.\n\nThe component accepts a few props to customize the ads you display.\n\n### Props\n\n#### adUnit\n\n- Type: `string`: required\n\nThe ad unit for a given ad as defined in Google Ad Manager > Inventory > Ad units.\n\n#### size\n\n- Type: `Array|string`: required\n\nDefault size for this ad, can be an array (`[<width>, <height>]`) or a string (`'<width>x<height>'`).\n\nTo support multiple sizes, either pass an array of arrays (`[[<width>, <height>], [<width>, <height>]]`), or a string where dimensions are separated by a comma (`'<width>x<height>,<width>x<height>'`).\n\n#### sizeMapping\n\n- Type: `Array`\n- Default: `[]`\n\nSize mapping for this ad. Each item in the list is an array of its own, where the first item is the browser size, and the second is the expected ad's size(s) for the breakpoint.\nSizes should either be arrays in the form `[<width>, <height>]` or strings in the form `'<width>x<height>'`.\n\n#### isResponsive\n\n- Type: `Boolean`\n- Default: `<%= options.responsive %>`\n\nTurn responsive mode on or off for specific ads, defaults to module's `responsive` option.\n\n#### windowResizeDebounce\n\n- Type: `Number`\n- Default: `300`\n\nDebounce duration between each window resize handling.\n\n#### collapseEmptyDiv\n\n- Type: `Boolean`\n- Default: `null`\n\nOverride `collapseEmptyDivs` option at the slot's level.\n\n#### refreshOnRouteChange\n\n- Type: `Boolean`\n- Default: `false`\n\n### Examples\n\n\n```vue\n<template>\n  <GptAd\n    ad-unit=\"SOME-AD-UNIT\"\n    :size=\"[120, 60]\"\n    :size-mapping=\"[\n      [[1024, 768], [970, 250]],\n      [[980, 690], [728, 90]],\n      [[640, 480], [120, 60]],\n      [[0, 0], [88, 31]],\n    ]\" />\n</template>\n```\n\nEquivalent:\n\n\n```vue\n<template>\n  <GptAd\n    ad-unit=\"SOME-AD-UNIT\"\n    size=\"120x60\"\n    :size-mapping=\"[\n      ['1024x768', '970x250'],\n      ['980x690', '728x90'],\n      ['640x480', '120x60'],\n      ['0x0', '88x31'],\n    ]\" />\n</template>\n```\n\n\n## Development\n\n- Clone this repository\n- Install dependencies using `yarn install` or `npm install`\n- Start development server using `npm run dev`\n\n## License\n\n[MIT License](../../LICENSE)\n\nCopyright (c) Ax2 Inc.\n","readmeFilename":"README.md"}