I have some problems when trying to integrate Google Adsense to my Weather Website.
The google banner is running but not well. Sometimes, it doesn't show anything except for a blank banner. Like in this pic: Picture
The first problem leads me to think about hiding the banner when there's no ads loaded. I found a solution which is adding data-ad-format="auto" to the banner tag. But I need to customize the banner dimension for the mobile. If I use data-ad-format="auto", I will not be able to customize the dimensions of the banner.
Does anyone has a solution for this? Hiding the banner when there's no ads?
Thank you very much!
I have had this problem for quite a while, the first ad unit above the fold does not collapse (with collapse set within Adsense), yet the ads below the fold will collapse. I have read that it will work if you integrate it with Google Ad Manager though I haven't had time to test it yet
You can hide the element if no ads using this:
ins.adsbygoogle[data-ad-status="unfilled"] {
display: none !important;
}
or only show element if there is and ad using this:
ins.adsbygoogle a {
display: none !important;
}
ins.adsbygoogle[data-ad-status="unfilled"] a {
display: block;
}
source: https://support.google.com/adsense/answer/10762946?hl=en
Related
I am developing an app, and it works 100% in android. In IOS I have 2 issues:
refresher does not work
<ion-refresher slot="fixed" #ionRefresh="doRefresh($event)">
there is a flicker when I touch the screen (may be related to background? I read some old posts about that)
ion-content.background{
--background: url(/bg.png) 0 0/100% 100% no-repeat;
}
I don't believe its relevant to this issue, but I am using vuejs.
I tested in various desktop browsers and it works as well.
So, we had 2 things here, and I thank #johnborges for following up
it was necessary to add the pullingIcon
link for Ionic docs
and the relevant paragraph
Using the iOS native ion-refresher requires setting the pullingIcon
property on ion-refresher-content to the value of one of the available
spinners. See the Spinner Documentation for accepted values. The
pullingIcon defaults to the lines spinner on iOS. The spinner tick
marks will be progressively shown as the user pulls down on the page.
the flicker, based on this link from stackoverflow I added a CSS DIV element instead of styling ion-content. It worked. I had to do a secodn CSS trick because one of my pages had fullpage slides and padding, but after that it worked
Once the AdMob banner is displayed, it blinks the screen knowing that there is no error reporting in the console!
The screen viewing the ad includes a spinner that runs until some data are fetched from an API, so I kept the spinner loading until the Ad is present to avoid blinking, but the screen still blinks when Ad is shown.
This is a sample from my code:
this.admobFree.banner.config(ConfigData.bannerAds.config);
// autoShow = true in config.
this.admobFree.banner.prepare().then(()=>{
// Boolean variable that is assigned to the *ngIf directive to keep the spinner until the
// banner is loaded.
// <ion-spinner name="crescent" *ngIf="!isDataLoaded&&!(isBannerLoaded)"></ion-spinner>
isBannerLoaded=true;
});
What is causing the screen blink when a banner is viewed? And how to solve this?!
(ionic 4)
It seems that it is a fault in the ionic AdMob plugin where this issue is reported on the ionic forum without proposed solutions!
https://forum.ionicframework.com/t/admob-screen-flash-on-load/25526
I had solved this by waiting for the AdMob banner to be shown and then display my actual view where this is controlled by using the *ngIf directive and a Boolean variable like this:
isContentVisible: boolean=false;
....
this.admobFree.banner.show().then(()=>{
this.isContentVisible=true;
});
This will decrease the blink by 95%, but it may take some seconds to display if the internet connection is weak!
By the way the blink is slight, and will not be a clearly noticed issue, but to be professional it must be solved!
Hope the the ionic AdMob developers will solve that!
I have created a Non-Google ad banner using Google Web Designer and have used a video component to show the video. Everything works fine.
The accessibility feature, a blue border appears when the video component is clicked to play or pause the video.
I have added the following code to hide the blue border but it doesn't help.
.gwd-video-1ggs:focus, .gwd-video-1ggs:active {
outline: none !important;
box-shadow: none !important;
}
It happens only in the Chrome browser and not in Safari. Is there a potential solution to this?
Solved
I followed this post - [https://nelo.is/writing/styling-better-focus-states/][1]
Add the following code to remove the blue border.
*:focus:not(.focus-visible) {
outline: none;
}
.focus-visible {
outline-color: lightgreen;
}
The blog post explains it in details.
My CodenameOne app works perfectly when using the android.googleAdUnitId or ios.googleAdUnitId build hints in order to show the Admob Ads banner at the bottom. However, I would like to give some coins/diamonds as rewards when users click on the bottom Ads banner. How can I do this? Is it possible for the main class to handle this by implementing the AdsListener interface like the https://github.com/chen-fishbein/admobfullscreen-codenameone supports (or at least the main class should implement a special interface which has the onAdLeftApplication() function only?)
Shai, Chen, anyone, do you have any advice?
There is no way to adjust the banner behavior, if you want to reward the user use full screen ads, there are quite a few full screen ads providers with a CodenameOne integration see these:
https://github.com/chen-fishbein/flurry-codenameone , https://github.com/chen-fishbein/startapp-codenameone , https://github.com/amiga/aerserv-codenameone
This has surely been covered countless times, but I cannot find a working solution.
how do you get rid of the scrollbars in a Facebook iframe app in Chrome. Both IE & Firefox are fine.
Using the suggested CSS overflow:hidden, simply cuts off the content if its over 800px in height.
Even the Facebook Coca Cola iframe app has the content cut off!! see here
http://www.facebook.com/cocacola?sk=app_161193133389
this is what is also happening to my app in Chrome (v. 16.0.912.77 m)
add this to your canvas app's fb js:
FB.Canvas.setSize({ width: 520, height: X });
where X is the height you want.
If your app is fluid use:
FB.Canvas.setAutoGrow();
i had a similar issue: after adding FB JS SDK and
FB.Canvas.setAutoGrow();
i had to set
body{}
in css to keep the scroll bars from showing in chrome. In my case is was padding.
body{
overflow: hidden;
margin: 0px;
padding: 0px;
}
I would also try to set the size with a delay and experiment with it a little:
window.setTimeout("FB.Canvas.setSize({ width: 520, height: 1111 })", 2000);
Also don't forget to initialize Facebook with your app id ( FB.init ) before calling FB.Canvas.setSize or FB.Canvas.setAutoGrow.
You have to make a few tweaks to you app. First, add the following code to your page:
FB.Canvas.setAutoGrow(); to tell the Facebook SDK to resize the iframe if the contents is longer.
Add overflow: hidden to the <html> or <body> CSS
Check your app settings and make sure you have set the Canvas Width to 'fluid' and Canvas Height to 'fixed' (Go to Settings > Advanced > Scroll to Canvas Settings.)
All of these things should fix the scroll bars. If it doesn't, using something like "Inspect Element" in Chrome to see if something is causing the bars to appear.
There are various solutions you could try below. Please comment as to which one, or if none of them work and I will update this answer accordingly.
If you haven't already, try adding: body{overflow:hidden;}
You may also have javascript disabled.
Alternatively, you could set the fixed height for the app very high in the app settings, where it says: fixed[ ]. Also make sure that fixed is selected on your app settings.
If this happens on other apps, including that CocaCola page you mentioned, then it could possibly be the browser. Try updating. I use the Chrome 19.0.1084.56 and I have no problems, (except for me the height is always pushed to a 1200px maximum height).
Also look here: 'Choosing between Facebook iframe scrollbar or page cut off halfway' where there is a solution that you can try.
Edit: Also look here: 'Timeline page app height stuck at 800px'.
Edit: After some looking through the Facebook bug area, Facebook say this is not a bug on Facebook's end, therefore must be a problem in your code. (Source: 'https://developers.facebook.com/bugs/360687100649759')
If that doesn't work, then comment and say so and I will do some further research.