Native ad does not show

[deifar]

Hi! I Implement the sample code, and while showing others, not native .

thanks!!!

[weslylaboy]

Can you post your code. I had a similar problem but I managed to solve it.

[technotip]

@weslylaboy, Can you please post your code?

I tried the code present in the documentation, but that doesn't seem to work.

I get some green patch mark at the top left corner of my app when I try to display native ads, but there are no ads being displayed except that patch like mark.

I also want to know how we can programatically know the link positions x, y, w, h etc to link using setNativeAdClickArea(adId,x,y,w,h);

[weslylaboy]

The Green Mark is the clickable area of the ad. I calculated the clickable area using the following code

var y = document.getElementById('nativead').offsetTop - $ionicScrollDelegate.$getByHandle('handler').getScrollPosition().top; var x = document.getElementById('nativead').offsetLeft - $ionicScrollDelegate.$getByHandle('handler').getScrollPosition().left; var w = document.getElementById('nativead').offsetWidth; var h =document.getElementById('nativead').offsetHeight;

Also, you need to set delegate-handle='handler' to your ion-content.

[technotip]

Can not find $ionicScrollDelegate etc errors are being thrown :-( Cannot read property 'offsetTop' of null etc

[weslylaboy]

You need to inject $ionicScrollDelegate to your controller. The null error is because the element does not exist in you html. Set id="nativead" to the div where the ad is going to be placed.

[technotip]

I'm using Ionic 2.

I was able to get Banner ad and Interstitial Ad, but not able to get Native Ads :-(

Do you know how to do this in TypeScript?

[technotip]

Can you let me know some values for x, y, w, h so that I can enter them manually to check the ad atleast. I've tried so many values, and each time the clickable area is shown only at top left hand corner of the screen!!

[weslylaboy]

I was using Ionic 1. I have no idea how to do it in TypeScript. Regarding the values, I don't think that is how it works. I would recommend you to create a div and set an id, similar to the documentation example. Then, make sure that the method registerAdEvents() is getting called. Then, you can do a console.log(data) inside the EventListener onAdLoadded. At least you should get the ad info in your console.

[technotip]

Am almost close to implementing it in ionic 2.

I get the ad details like title, body, coverImage, width, height, icon and its width and height.

Should I place the ad manually using these information?

[VivekCodeMaya]

I am still seeing top left green corner. Everything looks good at my end.

FacebookAds.setNativeAdClickArea('209755156184604_209757376184382', 10, 100, 251, 90);

but it is still not working. Any ideas, what am i missing?

[technotip]

@VivekCodeMaya, you can look at these video tutorials to implement it programmatically Facebook Native Ads: Ionic 2 and Facebook Native Ads Clickable Area: Ionic 2.

[mohamdio]

@technotip i followed all your steps and everything working fine with me which green clickable area moved to exact adnative div element, but now i have 2 issues : 1- the clickable area dimensions still got default numbers unit.x = unit.y = 0; & unit.w = unit.h = 80 [ i mean the area which i can click not get correct size however the green area already resized and moved correctly ! ] 2- now i have 2 green patch mark, one at the top left corner of the full screen device and two at the top left corner of the moved resized correct green area around the adnative element ! ]

so everything working with me, but can't resized clickable action area itself

after see the plugin file [ .java ] i found the author added 2 view layout one for tracking touch MotionEvent and another for the view itself, really at now i can't solve this :(

this issue happened on android, i don't test on IOS yet.

system information:

Cordova CLI: 6.5.0 
Ionic Framework Version: 3.0.1
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.3.4
ios-deploy version: 1.9.1 
ios-sim version: 5.0.13 
OS: macOS Sierra
Node Version: v7.4.0
Xcode version: Xcode 8.2.1 Build version 8C1002