oglasi: izklopljen full-width-responsive - vzrok odrezanih in kvadratnih oglasov

Izmerjeno s Chromium na zivem clanku (mobilni viewport 390 px):

  ins 390x390, iframe 390x390, .ad-container samo 356 px

Z data-full-width-responsive=true AdSense enoto raztegne na celo sirino
zaslona (390) mimo vsebnika (356 = stran ima px-4), zato je oglas gledal cez
rob in ga je .ad-container z overflow:hidden odrezal - od tod odrezan MEXC.
Hkrati je izbiral kvadrat 390x390 tudi za vodoravno sidro in za enoto v
besedilu; kreativa je bila manjsa od kvadrata, ostanek pa prazen crn prostor.

Zdaj data-full-width-responsive=false na vseh enotah in brez width:100% v
inline stilu - enota se drzi sirine svojega vsebnika, Google pa visino izbere
po tej sirini. Poravnava visine na kreativo iz prejsnjega commita ostane.

client/src/components/adsense.tsx

@@ -137,7 +137,7 @@ export default function AdSense({
         data-ad-client="ca-pub-4465464714854276"
         data-ad-slot={slot}
         data-ad-format={format}
-        data-full-width-responsive={responsive ? "true" : undefined}
+        data-full-width-responsive={responsive ? "true" : "false"}
         {...(layout ? { "data-ad-layout": layout } : {})}
         {...(layoutKey ? { "data-ad-layout-key": layoutKey } : {})}
       />
@@ -157,6 +157,7 @@ export function ArticleCardAd() {
         slot="3854634730"
         format="fluid"
         layoutKey="-6r+cy-10+8a-3"
+        responsive={false}
         style={{ display: "block" }}
         onAdStatus={setFilled}
       />
@@ -185,8 +186,8 @@ export function TopBannerAd() {
         slot="4154017639"
         format="auto"
         className="w-full"
-        style={{ display: "block", width: "100%" }}
+        style={{ display: "block" }}
-        responsive
+        responsive={false}
         eager
         onAdStatus={setFilled}
       />
@@ -212,8 +213,8 @@ export function InContentDisplayAd() {
       <AdSense
         slot="4154017639"
         format="auto"
-        responsive
+        responsive={false}
-        style={{ display: "block", textAlign: "center" }}
+        style={{ display: "block" }}
         onAdStatus={setFilled}
       />
     </div>
@@ -237,6 +238,7 @@ export function InArticleAd() {
         slot="7672178246"
         format="fluid"
         layout="in-article"
+        responsive={false}
         style={{ display: "block", textAlign: "center" }}
         onAdStatus={setFilled}
       />
@@ -253,6 +255,7 @@ export function MultiplexAd() {
       <AdSense
         slot="4593001335"
         format="autorelaxed"
+        responsive={false}
         style={{ display: "block" }}
         className="w-full"
         onAdStatus={setFilled}
@@ -309,6 +312,7 @@ export function SidebarAd() {
         <AdSense
           slot="2398082838"
           format="auto"
+          responsive={false}
           onAdStatus={(filled) => setVisible(filled)}
         />
       </div>

client/src/components/mobile-sticky-ad.tsx

@@ -43,18 +43,16 @@ export default function MobileStickyAd() {
         {shown && (
           <div className="text-[9px] text-muted-foreground/40 text-center pt-1 uppercase tracking-widest">Anzeige</div>
         )}
-        {/* Odzivna vodoravna enota namesto trdih 320x50: Google lahko postrezhe
+        {/* Vodoravni format brez full-width-responsive: enota se drzi sirine
-            tudi 320x100, torej vecjo kreativo tam, kjer je prostor. Visino
+            svojega vsebnika in da 320x50 ali 320x100. Z vklopljenim
-            omejimo, da sidro ne poje zaslona. */}
+            full-width-responsive je Google vracal 390x390 kvadrat. */}
-        {/* Vodoravni format da na telefonu 320x50 ali 320x100 - vec kot to
-            sidro ne sme biti. Nic ne odrezemo, ker mora biti oglas cel viden. */}
         <div className="w-full pb-1">
           <AdSense
             slot="4154017639"
             format="horizontal"
             className="w-full"
-            style={{ display: "block", width: "100%" }}
+            style={{ display: "block" }}
-            responsive
+            responsive={false}
             eager
             onAdStatus={setFilled}
           />