Skip to content

Commit 28caeb4

Browse files
muhammad-fiazmuhammad-fiaz
committed
improved ads
1 parent cdb4ce8 commit 28caeb4

File tree

3 files changed

+89
-21
lines changed

3 files changed

+89
-21
lines changed

‎src/layouts/content.astro‎

Lines changed: 41 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -10,18 +10,49 @@ const { showAds = false } = Astro.props;
1010
const googleAdsenseClientId = import.meta.env.PUBLIC_GOOGLE_ADSENSE_CLIENT_ID;
1111
---
1212

13-
<article
14-
class="prose md:prose-lg py-8 container prose-img:border prose-img:mx-auto prose-img:border-base-200 prose-img:rounded-lg prose-p:break-words prose-a:break-all prose-pre:break-words prose-pre:cursor-text prose-code:break-words prose-code:whitespace-pre-wrap"
15-
data-pagefind-body
13+
<div
14+
class="grid grid-cols-1 gap-6 lg:grid-cols-[16rem_minmax(0,1248px)_16rem] xl:grid-cols-[18rem_minmax(0,1248px)_18rem]"
1615
>
17-
<div id="article-content">
18-
{showAds ? (
19-
<slot name="content-with-ads" />
20-
) : (
21-
<slot />
22-
)}
16+
<!-- Left Sidebar Ad -->
17+
<aside class="hidden lg:block w-48 flex-shrink-0">
18+
<div class="sticky top-6">
19+
<AdUnit
20+
adType="display"
21+
adSlot="1038118330"
22+
adFormat="auto"
23+
className="w-full"
24+
/>
25+
</div>
26+
</aside>
27+
28+
<!-- Main content column (center track) -->
29+
<div class="min-w-0 lg:col-start-2">
30+
<article
31+
class="prose md:prose-lg py-8 container prose-img:border prose-img:mx-auto prose-img:border-base-200 prose-img:rounded-lg prose-p:break-words prose-a:break-all prose-pre:break-words prose-pre:cursor-text prose-code:break-words prose-code:whitespace-pre-wrap"
32+
data-pagefind-body
33+
>
34+
<div id="article-content">
35+
{showAds ? (
36+
<slot name="content-with-ads" />
37+
) : (
38+
<slot />
39+
)}
40+
</div>
41+
</article>
2342
</div>
24-
</article>
43+
44+
<!-- Right Sidebar Ad -->
45+
<aside class="hidden lg:block w-48 flex-shrink-0">
46+
<div class="sticky top-6">
47+
<AdUnit
48+
adType="display"
49+
adSlot="1038118330"
50+
adFormat="auto"
51+
className="w-full"
52+
/>
53+
</div>
54+
</aside>
55+
</div>
2556

2657
{showAds && (
2758
<script define:vars={{ googleAdsenseClientId }}>

‎src/layouts/list.astro‎

Lines changed: 36 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import type { CollectionEntry } from "astro:content";
33
import BaseLayout from "./base.astro";
44
import ViewListHeader from "@/components/shared/view-list-header.astro";
5+
import AdUnit from "@/components/elements/AdUnit.astro";
56
67
type Props = {
78
header: string;
@@ -13,10 +14,41 @@ const { entry, header } = Astro.props;
1314

1415
<BaseLayout entry={entry}>
1516
<div
16-
class="container flex flex-col h-full pb-8 pt-4"
17-
data-pagefind-ignore="all"
17+
class="grid grid-cols-1 gap-6 lg:grid-cols-[16rem_minmax(0,1248px)_16rem] xl:grid-cols-[18rem_minmax(0,1248px)_18rem]"
1818
>
19-
<ViewListHeader title={header} />
20-
<slot />
19+
<!-- Left Sidebar Ad -->
20+
<aside class="hidden lg:block w-48 flex-shrink-0">
21+
<div class="sticky top-6">
22+
<AdUnit
23+
adType="display"
24+
adSlot="1038118330"
25+
adFormat="auto"
26+
className="w-full"
27+
/>
28+
</div>
29+
</aside>
30+
31+
<!-- Main content column (center track) -->
32+
<div class="min-w-0 lg:col-start-2">
33+
<div
34+
class="container flex flex-col h-full pb-8 pt-4"
35+
data-pagefind-ignore="all"
36+
>
37+
<ViewListHeader title={header} />
38+
<slot />
39+
</div>
40+
</div>
41+
42+
<!-- Right Sidebar Ad -->
43+
<aside class="hidden lg:block w-48 flex-shrink-0">
44+
<div class="sticky top-6">
45+
<AdUnit
46+
adType="display"
47+
adSlot="1038118330"
48+
adFormat="auto"
49+
className="w-full"
50+
/>
51+
</div>
52+
</aside>
2153
</div>
2254
</BaseLayout>

‎src/pages/categories/index.astro‎

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@ if (!entry) {
1616
const articles = categoriesHandler.allCategoriesWithLatestArticles();
1717
---
1818

19-
{/* Use your BaseLayout and pass the entry for metadata */}
2019
<ListLayout header={"All Categories"} entry={entry}>
2120
<ul class="w-full space-y-8 my-6">
2221
{
@@ -44,9 +43,6 @@ const articles = categoriesHandler.allCategoriesWithLatestArticles();
4443
</a>
4544
</div>
4645
<div class="snap-x">
47-
{/* {latestArticles.slice(0, 6).map((article, index) => (
48-
<NewsCard article={article} index={index} />
49-
))} */}
5046
<div class="flex overflow-x-auto pb-4 space-x-4 snap-x snap-proximity">
5147
{latestArticles.slice(0, 6).map((article, index) => (
5248
<div class="snap-start flex-none lg:flex-initial">
@@ -62,9 +58,9 @@ const articles = categoriesHandler.allCategoriesWithLatestArticles();
6258
categoryIndex !== articles.length - 1 && (
6359
<li class="my-8 flex justify-center">
6460
<AdUnit
65-
adType="fluid-layout"
66-
adSlot="5304666400"
67-
adLayoutKey="-fb+5w+4e-db+86"
61+
adType="display"
62+
adSlot="1673926045"
63+
adFormat="auto"
6864
className="w-full max-w-4xl"
6965
/>
7066
</li>
@@ -74,4 +70,13 @@ const articles = categoriesHandler.allCategoriesWithLatestArticles();
7470
})
7571
}
7672
</ul>
73+
74+
<!-- Autorelaxed Ad below categories list -->
75+
<div class="my-8 flex justify-center">
76+
<AdUnit
77+
adType="autorelaxed"
78+
adSlot="9560154927"
79+
className="w-full max-w-4xl"
80+
/>
81+
</div>
7782
</ListLayout>

0 commit comments

Comments
 (0)