From 646f4f38437903adbdd15b82d4518338474fcbe5 Mon Sep 17 00:00:00 2001
From: sebastjanartic <45803536-sebastjanartic@users.noreply.replit.com>
Date: Wed, 17 Sep 2025 09:39:55 +0000
Subject: [PATCH] Improve AdSense ad rendering and initialization for better
 visibility

Update AdSenseAd component to ensure proper initialization and rendering with defined styles, improving ad slot visibility and user experience.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 45a1dcfc-f8a2-475a-a6b9-96fbb841dc27
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/60d372ff-2c10-46c7-b01b-10c3435136b0/45a1dcfc-f8a2-475a-a6b9-96fbb841dc27/dy0t7tj
---
 .replit                              |  4 ++++
 client/src/components/adsense-ad.tsx | 13 ++++++++++---
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/.replit b/.replit
index 6ce283d..4295f2a 100644
--- a/.replit
+++ b/.replit
@@ -15,6 +15,10 @@ run = ["npm", "run", "start"]
 localPort = 5000
 externalPort = 80
 
+[[ports]]
+localPort = 35163
+externalPort = 3000
+
 [env]
 PORT = "5000"
 
diff --git a/client/src/components/adsense-ad.tsx b/client/src/components/adsense-ad.tsx
index 961ba7e..50549f1 100644
--- a/client/src/components/adsense-ad.tsx
+++ b/client/src/components/adsense-ad.tsx
@@ -21,16 +21,20 @@ export default function AdSenseAd({
     try {
       // Ensure adsbygoogle is loaded
       if (typeof window !== 'undefined') {
+        console.log(`🎯 AdSense: Initializing ad slot ${adSlot}`);
         // @ts-ignore
         (window.adsbygoogle = window.adsbygoogle || []).push({});
+        console.log(`✅ AdSense: Ad slot ${adSlot} pushed to queue`);
       }
     } catch (error) {
       console.error('AdSense initialization error:', error);
     }
-  }, []);
+  }, [adSlot]);
 
   const adStyle: React.CSSProperties = {
-    display: 'block'
+    display: 'block',
+    minWidth: '300px',
+    minHeight: '250px'
   };
 
   if (adFormat !== 'auto' && width && height) {
@@ -41,8 +45,11 @@ export default function AdSenseAd({
     adStyle.height = 'auto';
   }
 
+  console.log(`📐 AdSense: Rendering ad slot ${adSlot} with style:`, adStyle);
+
   return (
-    <div className={`adsense-wrapper ${className}`} ref={adRef}>
+    <div className={`adsense-wrapper ${className}`} ref={adRef} style={{ minHeight: '250px', background: 'rgba(255,255,255,0.05)', border: '1px solid rgba(255,255,255,0.1)', borderRadius: '8px', padding: '10px' }}>
+      <div className="text-white text-xs opacity-50 mb-2">AdSense Slot: {adSlot}</div>
       <ins
         className="adsbygoogle"
         style={adStyle}