googleAdsense

This commit is contained in:
tangly1024.com
2023-06-19 16:00:31 +08:00
parent 58278fac49
commit 133fdd7c77
12 changed files with 70 additions and 71 deletions

View File

@@ -26,7 +26,7 @@ const CommonScript = () => {
/>
</>)}
{/* GoogleAdsense */}
{/* GoogleAdsense 本地开发请加入 data-adbreak-test="on" */}
{BLOG.ADSENSE_GOOGLE_ID && <script async src={`https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=${BLOG.ADSENSE_GOOGLE_ID}`}
crossOrigin="anonymous" />}

View File

@@ -1,7 +1,8 @@
import BLOG from '@/blog.config'
import { useRouter } from 'next/router'
import { useEffect } from 'react'
export default function GoogleAdsense () {
export default function GoogleAdsense() {
const initGoogleAdsense = () => {
const ads = document.getElementsByClassName('adsbygoogle').length
const newAdsCount = ads
@@ -27,3 +28,52 @@ export default function GoogleAdsense () {
}, [router.events])
return null
}
/**
* 文章内嵌广告单元
* 请在GoogleAdsense后台配置创建对应广告并且获取相应代码
* 修改下面广告单元中的 data-ad-slot data-ad-format data-ad-layout-key(如果有)
*/
const AdSlot = ({ type = 'show' }) => {
if (!BLOG.ADSENSE_GOOGLE_ID) {
return null
}
// 文章内嵌广告
if (type === 'in-article') {
return <ins className="adsbygoogle"
style={{ display: 'block', textAlign: 'center' }}
data-ad-layout="in-article"
data-ad-format="fluid"
data-ad-client={BLOG.ADSENSE_GOOGLE_ID}
data-ad-slot="3806269138"></ins>
}
// 信息流广告
if (type === 'flow') {
return <ins className="adsbygoogle"
data-ad-format="fluid"
data-ad-layout-key="-5j+cz+30-f7+bf"
style={{ display: 'block' }}
data-ad-client={BLOG.ADSENSE_GOOGLE_ID}
data-ad-slot="1510444138"></ins>
}
// 原生广告
if (type === 'native') {
return <ins className="adsbygoogle"
style={{ display: 'block' }}
data-ad-format="autorelaxed"
data-ad-client={BLOG.ADSENSE_GOOGLE_ID}
data-ad-slot="4980048999"></ins>
}
// 展示广告
return <ins className="adsbygoogle"
style={{ display: 'block' }}
data-ad-client={BLOG.ADSENSE_GOOGLE_ID}
data-ad-slot="8807314373"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
}
export { AdSlot }

View File

@@ -7,6 +7,7 @@ import TweetEmbed from 'react-tweet-embed'
import 'katex/dist/katex.min.css'
import { mapImgUrl } from '@/lib/notion/mapImage'
import { AdSlot } from './GoogleAdsense'
const Code = dynamic(() =>
import('react-notion-x/build/third-party/code').then(async (m) => {
@@ -79,6 +80,8 @@ const NotionPage = ({ post, className }) => {
<PrismMac />
<AdSlot type={'in-article'}/>
</div>
}

View File

@@ -95,17 +95,6 @@ export default function ArticleDetail(props) {
<ShareBar post={post} />
</section>
<section className="px-1 py-2 my-1 text-sm font-light overflow-auto text-gray-600 dark:text-gray-400">
{/* 文章内嵌广告 */}
<ins className="adsbygoogle"
style={{ display: 'block', textAlign: 'center' }}
data-adtest="on"
data-ad-layout="in-article"
data-ad-format="fluid"
data-ad-client="ca-pub-2708419466378217"
data-ad-slot="3806269138" />
</section>
</article>
{post.type === 'Post' && <ArticleAround prev={prev} next={next} /> }

View File

@@ -58,17 +58,6 @@ export const LayoutSlug = props => {
{post && <NotionPage post={post} />}
</section>
<section className="px-1 py-2 my-1 text-sm font-light overflow-auto text-gray-600 dark:text-gray-400">
{/* 文章内嵌广告 */}
<ins className="adsbygoogle"
style={{ display: 'block', textAlign: 'center' }}
data-adtest="on"
data-ad-layout="in-article"
data-ad-format="fluid"
data-ad-client="ca-pub-2708419466378217"
data-ad-slot="3806269138" />
</section>
{/* 分享 */}
<ShareBar post={post} />
{post.type === 'Post' && <ArticleCopyright {...props} /> }

View File

@@ -74,16 +74,6 @@ export const LayoutSlug = props => {
{post && <NotionPage post={post} />}
</section>
<section className="px-1 py-2 my-1 text-sm font-light overflow-auto text-gray-600 dark:text-gray-400">
{/* 文章内嵌广告 */}
<ins className="adsbygoogle"
style={{ display: 'block', textAlign: 'center' }}
data-adtest="on"
data-ad-layout="in-article"
data-ad-format="fluid"
data-ad-client="ca-pub-2708419466378217"
data-ad-slot="3806269138" />
</section>
{/* 分享 */}
<ShareBar post={post} />
{/* 文章版权说明 */}

View File

@@ -72,19 +72,6 @@ export const LayoutSlug = props => {
{post && (<NotionPage post={post} />)}
</section>
<section className="px-1 py-2 my-1 text-sm font-light overflow-auto text-gray-600 dark:text-gray-400">
{/* 文章内嵌广告 */}
<ins
className="adsbygoogle"
style={{ display: 'block', textAlign: 'center' }}
data-adtest="on"
data-ad-layout="in-article"
data-ad-format="fluid"
data-ad-client="ca-pub-2708419466378217"
data-ad-slot="3806269138"
/>
</section>
<section>
{/* 分享 */}

View File

@@ -83,17 +83,6 @@ export default function ArticleDetail(props) {
{post && (<NotionPage post={post} />)}
</article>
<section className="px-1 py-2 my-1 text-sm font-light overflow-auto text-gray-600 dark:text-gray-400">
{/* 文章内嵌广告 */}
<ins className="adsbygoogle"
style={{ display: 'block', textAlign: 'center' }}
data-adtest="on"
data-ad-layout="in-article"
data-ad-format="fluid"
data-ad-client="ca-pub-2708419466378217"
data-ad-slot="3806269138" />
</section>
{showArticleInfo && <>
{/* 分享 */}

View File

@@ -70,18 +70,7 @@ const SideBar = (props) => {
</div>
<section className='bg-white dark:bg-gray-900'>
{/* 信息流广告 */}
<ins className="adsbygoogle"
style={{ display: 'block' }}
data-adtest="on"
data-ad-format="fluid"
data-ad-layout-key="-5j+cz+30-f7+bf"
data-ad-client="ca-pub-2708419466378217"
data-ad-slot="1510444138"/>
</section>
</aside>
);
)
}
export default SideBar

View File

@@ -11,6 +11,7 @@ import { TopBar } from './components/TopBar'
import CONFIG_SIMPLE from './config_simple'
import { isBrowser, loadExternalResource } from '@/lib/utils'
import { useGlobal } from '@/lib/global'
import { AdSlot } from '@/components/GoogleAdsense'
/**
* 基础布局 采用左右两侧布局,移动端使用顶部导航栏
@@ -62,6 +63,8 @@ const LayoutBase = props => {
<JumpToTopButton />
</div>
<AdSlot type='native'/>
<Footer {...props} />
</div>

View File

@@ -3,6 +3,7 @@ import BLOG from '@/blog.config'
import { useRouter } from 'next/router'
import Link from 'next/link'
import { BlogItem } from './BlogItem'
import { AdSlot } from '@/components/GoogleAdsense'
export const BlogListPage = props => {
const { page = 1, posts, postCount } = props
@@ -18,6 +19,7 @@ export const BlogListPage = props => {
<div className="w-full md:pr-8 mb-12">
<div id="container">
<AdSlot type='flow'/>
{posts?.map(p => (
<BlogItem key={p.id} post={p}/>
))}

View File

@@ -1,3 +1,4 @@
import { AdSlot } from '@/components/GoogleAdsense'
import Live2D from '@/components/Live2D'
import Announcement from './Announcement'
import Catalog from './Catalog'
@@ -5,15 +6,22 @@ import Catalog from './Catalog'
export const SideBar = (props) => {
const { notice } = props
return (<>
<aside>
<Catalog {...props} />
</aside>
<aside className="overflow-hidden mb-6">
<aside>
<Live2D />
</aside>
<aside>
<Announcement post={notice} />
</aside>
<aside>
<AdSlot/>
</aside>
</>)
}