react-helmet
을 사용한다.$npm install --save gatsby-plugin-react-helmet
plugins: [
`gatsby-plugin-react-helmet`
]
플러그인 추가
적당한 컴포넌트에 helmet코드를 넣어준다.
<Helmet>
<script async custom-element="amp-auto-ads"
src="https://cdn.ampproject.org/v0/amp-auto-ads-0.1.js">
</script>
</Helmet>
모든 세팅이 끝났다! 광고를 넣을 자리에 광고만 심으면 끝
adsense.js
import React from 'react';
import AdSense from 'react-adsense';
const Adsense = ({ client, slot }) => {
return (
<AdSense.Google
client={client}
slot={slot}
style={{ display: 'block' }}
format='auto'
responsive='true'
/>
)
};
export default Adsense;
위와같은 컴포넌트를 만들고, 광고를 넣을자리에서
<Adsense client="ca-pub-xxx" slot="xxx" />
위 코드만 넣어주면 된다.