add google adsense on post detail page

[AnnatarHe]

please add the google adsense on the post detail page, at the end of the content. Make sure it looks good.

@claude

[claude]

Claude finished @AnnatarHe's task —— View job • claude/issue-46-20251025-0916 • Create PR ➔

---

Adding Google AdSense to Post Detail Page

Tasks

• Explore codebase to find post detail page structure
• Create AdSense component
• Add AdSense script to post page head
• Add ad unit at the end of post content
• Ensure styling looks good
• Run type checking
• Commit and push changes

---

Summary

I've successfully added Google AdSense integration to the post detail pages. Here's what was implemented:

Changes Made:

1. Created /src/components/AdSense.astro - A reusable AdSense component with:

   • Responsive ad unit that adapts to different screen sizes
   • Auto-format for optimal display
   • Proper styling with centered alignment and spacing
   • Inline script to initialize the ad

2. Updated /src/pages/posts/[...slug].astro - Modified the post detail page to:

   • Include the AdSense script in the page head (with is:inline directive)
   • Display the ad unit at the end of article content, after the horizontal separator
   • Maintain clean separation between content and advertising

Styling & Placement:

• The ad appears after the podcast content and separator line
• Responsive design ensures it looks good on all screen sizes
• Consistent spacing with existing page elements (my-8 margin)

Important: Configuration Required
Before the ads will display, you need to update two TODO items in the code:

1. In /src/pages/posts/[...slug].astro:81 - Replace ca-pub-XXXXXXXXXXXXXXXX with your actual Google AdSense client ID
2. In /src/components/AdSense.astro:3-4 - Replace the placeholder values with your AdSense client ID and ad slot ID

Type Checking: ✅ Passed with 0 errors

--- | Branch