Script for Affiliate Ad Does Not Display

The script is broken. You can see the <br /> tags in the scrip after each line, when looking at the screenshot.

That breaks the JavaScript.

This happens when you (usually) add the Javascript to the WordPress post Body editor, specially since Gutenberg/Blocks since no more “Text Mode” is available in the new builder.
In that case each line gets a “break” (br tag) and that will break the JavaScript.

You can try to add your script (without “br” tags) inside a “Custom HTML Block”, like described here https://plethorathemes.com/wordpress-tips-tutorials/how-to-add-javascript-or-jquery-to-wordpress/ > Add JS using the Gutenberg Editor

I hope this helps!

@bedas Thank you for the reply. Odd that the script would suddenly be broken by <br /> tags. This is the script Amazon provides and it’s worked until recently: the ads were there using that code, but no longer there without changing the code.

Also, the page is built using Elementor, not Gutenberg, and the script is added using their widget specific for adding custom code. The ad doesn’t display using Elementor or not using Elementor, so it’s not an Elementor issue.

Why would line break tags not break the code then, suddenly, without changing the script code, all of the sudden break the code?

I am relatively confident that this code as shown in the screenshot can not and never could have worked

The break tags will throw JavaScript console errors for each unexpected “<“ sign at least (start of break tags)

Unless I miss something, the issue will be resolved once those unexpected break tags are removed and only plain JavaScript is used.

I’d not know how this could have been working prior to the issue occurring as by my knowledge this would break JavaScript since always.

But, since “never say never”, and “be prepared to learn something new” are some of my favorite approaches, ?? – I’m just suggesting to try and remove those break tags, as I am quite sure that’s the issue.

Please let me know if that helps.

@bedas

I’ve been able to show that it’s not the <br /> breaking the script. When I view the code as displayed on my live site, there are no line breaks in the code.

Screen Shot of Code Used: https://www.dropbox.com/s/wpfqzbhnktnit9k/20210521-Ad%20Missing%20Code.png?dl=0

Yet, the ad does not display.

Screen Shot of Missing Ad: https://www.dropbox.com/s/jtafo7jggaxxpra/20210521-Ad%20Missing%20Display.png?dl=0

As I said in the original post, I tried to eliminate any theme/plugin issues, taking the site all the way down to bare bones: WordPress and Twenty Twenty-One theme with no plugins active.

Nothing changed — the ad never displays.

• This reply was modified 3 years, 6 months ago by jrothra.
• This reply was modified 3 years, 6 months ago by jrothra.

Follow up —

Out of curiosity, I looked at the code used on the live site and noticed it has no <br /> in it. So, I don’t think it’s a broken code, but something in WordPress that’s blocking it.

Screen Shot of Live Code: https://www.dropbox.com/s/8aydf05lc1x1he0/20210521-Ad%20Missing%20Code%20Live.png?dl=0

The still think the break tags will most definitely break Javascript.
But it might not be the only issue and eventually not the main issue we deal here with…

I could see now there are also 2 actual JS errors in the site:
Uncaught ReferenceError: wp is not defined

Those seem due to this section(s) of code ( am not entirely sure why these code snips are present on the HTML but they seem loaded – at least partially – by some Password Strength Meter):

<script type='text/javascript' id='wp-i18n-js-after'>
    wp.i18n.setLocaleData({
        'text direction\u0004ltr': ['ltr']
    });
    </script>

and

<script type='text/javascript' id='password-strength-meter-js-translations'>
( function( domain, translations ) {
	var localeData = translations.locale_data[ domain ] || translations.locale_data.messages;
	localeData[""].domain = domain;
	wp.i18n.setLocaleData( localeData, domain );
} )( "default", { "locale_data": { "messages": { "": {} } } } );
</script>

It could be worth removing that code (by disabling the plugin) to avoid the JS errors in order to see if that eventually resolves the issue. JS errors can stop consecutive JS from functioning.

It’s interesting that I seem to see the Amazon pulled content in the HTML however I cant see it visually. It means the script seems actually working but perhaps the ads re hidden with some CSS. I did not have time to check on that as it is getting late here (asian time)
If removing above code/resolving the mentioned JS error also does not resolve the problem, I would not know where to proceed, for the moment being.

Some problems:

The still think the break tags will most definitely break Javascript

Except I’ve shown that on the live site, there are no break tags. So, that’s a non-issue.

It could be worth removing that code (by disabling the plugin)

I’m not sure what plugin it is, but I’ve also shown that the problem exists even when no plugins are used. Also, I tried deactivating/reactivating one plugin at a time and it made no difference.

Worth noting: I’m not a coder, and I don’t read/understand JavaScript code very well. I just add the script Amazon gives me into the page via Elementor, something I’ve done for a long time. It worked until recently.

I am not sure where you made the test with disabling plugins, however if it was on the site where the break tags where present then those break tags still would have broken the JS, despite the other error gone.

The other error I reference is as said due to a Plugin or code or else functionality that seems to add some “Password Strength Check”
Do you have a plugin that perhaps enforces strong passwords such as WordFence or else?

For certain are two things:
JS is a “single threaded” script which means if something breaks at one point other parts of the script coming afterwards can fail.
So if there is an error such as mentioned, even if unrelated to the actual script you are looking at, it can influence it if it has errors.

Only when the console is error free, you could be sure that at least no errors of other scripts would interfere.

As for the core problem if Amazon scripts, WordPress has no mechanisms to stop such scripts from functioning, so if this fails on a install that has no plugin, and a default theme, and no other code, then the “fault” would have to be seeked at the script from AMAZON, since WordPress itself has no “blockers” that would stop such scripts

—

That said…

As mentioned the script itself actually seems to work, but for some reason it is visually hiding its results.

Reanalysing this today I saw that there are some display:none CSS rules on the amzn-native-ad-0 DIV ID which I am not sure if they are related, however, as soon I remove them I can see an ad and a search input of Amazon. I am not sure if this is what would be expected to be shown

In any case that style rule is added inline to the HTML of amazon and I think it would be disabled/removed by some script rule, however, it requires more debug than I can do here in the scope of volunteer support to discover what precisely is happening here.

So, just tentatively I copied the script from your site and added it to my local, and I got the exact same results (no JS errors, since I do not use that plugin or code to check password strengths, but the same “nothing shown” problem)
I can see the precise same HTML generated as on your site, too, meaning, everything seems to work, but I cannot see any form, ad or else displayed.
Precise same cause, too: the inline CSS hides the section with display none.

I researched the script itself further in different blogs and forums and I could find many “Does not show” threads, but all of them due to scripts minify process, cache, critical css optimisation or else, none of which is the case on my local or your online site as far I see.

Just testing, I have then checked with the script shown here https://gorails.com/forum/how-can-i-integrate-amazon-native-ads#forum_post_4105, and that works even on my local.

I found that the script there is basically identical to yours, of course apart of the Keys etc.

I then debugged this further and found that it is barely due to the ASINs passed in the amzn_assoc_asins
Those ASINs used on your site do not return anything when used in the script.
Using these random ASINS it works:
B07J4YS4LH, B07C7PW3PC

The script that works perfectly fine, copied directly from your site, but changed the ASINs:

<script type="text/javascript">
amzn_assoc_placement = "adunit0";
amzn_assoc_search_bar = "true";
amzn_assoc_tracking_id = "TRACKING_ID_GOES_HERE";
amzn_assoc_ad_mode = "manual";
amzn_assoc_ad_type = "smart";
amzn_assoc_marketplace = "amazon";
amzn_assoc_region = "US";
amzn_assoc_title = "";
amzn_assoc_linkid = "KEY_GOES_HERE";
amzn_assoc_asins = "B07C7PW3PC,B07J4YS4LH";
</script>
<script src="//z-na.amazon-adsystem.com/widgets/onejs?MarketPlace=US"></script>

Note, while anyone can actually copy the code from your site I have still altered the amzn_assoc_linkid and amzn_assoc_tracking_id so it is not the one you use on your site!

Concluding, the ASINs you use are somehow invalid. I am not sure why, since the single ASINs you use seem to belong to valid Amazon Products, however, as my tests on local show, I can use the same script as from your site successfully, when using other ASINs… while it breaks with any of the ASINs you have in the script.

I am not expert in Amazon, so from there on I am not sure what to do next myself.
Perhaps this is somehow related to your affiliate account in the Amazon platform?

Screenshots of working instance on my end:
https://drive.google.com/file/d/1hRW8N78yOFJU0f-m7HRXlwucbH6rI5h4/view?usp=sharing
https://drive.google.com/file/d/19lBZxUIunrgYKX8bJZrUm-sW8Fqzq7nO/view?usp=sharing

• This reply was modified 3 years, 6 months ago by Anonymous User 14808221.
• This reply was modified 3 years, 6 months ago by Anonymous User 14808221.

I am not sure where you made the test with disabling plugins, however if it was on the site where the break tags where present then those break tags still would have broken the JS

I tested it on the live site (linked to on this thread) and on a staging site — the results were the same either way. There are no break tags in the live site.

Do you have a plugin that perhaps enforces strong passwords such as WordFence or else?

Not that I’m aware of. But again, with all plugins disabled, the ad still does not show.

So if there is an error such as mentioned

When I visit the live site and look at the post I reference, I don’t get any script errors, only a jquery issue, but jquery and javascript are different.

Here’s what I get:

JQMIGRATE: Migrate is installed, version 3.3.2
?v=2.0:16 WebSocket connection to 'wss://public-api.wordpress.com/pinghub/wpcom/me/newest-note-data' failed: 
w @ ?v=2.0:16
C @ ?v=2.0:16
D @ ?v=2.0:16

Reanalysing this today I saw that there are some display:none CSS rules on the amzn-native-ad-0 DIV ID which I am not sure if they are related,

Turns out they are related. Whenever I tried to remove it while in Chrome Dev Tools, something forced display: none; to that area. I had to add the following to make the ad appear (though no products show up):

div#amzn-native-ad-0 {
    display: revert !important;
}

the ASINs you use are somehow invalid. I am not sure why, since the single ASINs you use seem to belong to valid Amazon Products,

I tried changing out the ASINs as well, but nothing showed. Finally, I created a whole new ad using Amazon’s ad creation device and added products their system found (prominent Christian authors, too). Yet, the ad framework (the border around products, search bar) showed up because I’m forcing it to, but the products themselves were not there. Here are screen shots of the process:

New Ad Creation: https://www.dropbox.com/s/p7z1lnss2alamo6/20210522-New%20Amazon%20Script%201.png?dl=0
New Ad Code Added to Live Site: https://www.dropbox.com/s/yzfoeneid7z7la2/20210522-New%20Amazon%20Script%202.png?dl=0
New Ad Results: https://www.dropbox.com/s/zlw4lijm0xbghix/20210522-New%20Amazon%20Script%203.png?dl=0

CONCLUSION

With your help (which I do greatly appreciate — thank you!), I think this is what’s happening:

The ASINs are not working properly for some reason even though they are valid ASINs. This, I believe has been shown in your local test and on my site. It seems that when Amazon’s system detects no products being displayed, it forces the ad to be hidden so as not to have the appearance of a “broken” ad. Thus, I’ll need to try reaching out to Amazon (wish me luck) to ask about it, or maybe post somewhere on this support system in case someone else has had a similar issue.

• This reply was modified 3 years, 6 months ago by jrothra.
• This reply was modified 3 years, 6 months ago by jrothra.

UPDATE

I reached out to Amazon and received a quick response:

The Native Shopping Ads (NSA) UK beta has been paused on March 15, hence your ad code for NSA will no longer render ads from Amazon on your website for visitors located in the UK (or other EU countries). This includes NSA ads created under the US Associates Program, and under the limited UK NSA beta launch.

However, I’m in the USA (no VPN being used) on a my own WiFi provided by a US provider, looking at a US site hosted by a US company and hosted on a server in the US. Thus, the “located in the UK (or other EU countries)” is irrelevant. I’m not in Europe (unless world geopolitical boundaries changed recently).

Have you tried with the Product ASINs I provided?
Because it clearly works on my end and your code with them.

So it is due to the product ASINs, not the code.
Am am 100% positive that the ASINs – using the very code from your end, but the ASINs I randomly picked – do work fine, since I tested this extensively on my local install and confirmed repeatedly.

The only I could think of is that those ASINs that work here (Hanoi) maybe do not work in the US, and that the ASINs you use for testing do not work in any case.
Not sure what this would be, but it is very surely not related to WordPress.

Also the message you received from Amazon states that This includes NSA ads created under the US Associates Program

So I am not sure why US should be excluded from this?
It seems UK, EU, AND USA are terminated.

However, I have to honestly admit I do not even know what The Native Shopping Ads (NSA) is in this case, since the code works just fine, using those ASINs I suggested, on this end here.

In this case I am over-asked since I simply do not have much experience at all with Amazons products.

But from the phrasing it seems very much US is as well affected by these changes and hence that would explain why it does not work at all on your end?

I’m having the same problem. These javascript codes were working fine before. Recently I faket that the javascript codes are not working. When I ask for wordpress help, they say that the problem is caused by Amazon, but there was no change in Amazon javascript codes. Is there a solution to the problem?

Same problem here,

Is there a solution? Or do we have to add the JavaScript code in another way?

Appreciate any kind of feedback,
Thanks

Hello @vduvencioglu and @rauljauregi as you can see when reading thru the extensive thread, none of these issues are in any way related to WordPress.

Please do not piggyback issues with “me too” and even if, please prior to that read the thread, which has been very thoroughly investigated – it will outline how this is impossibly an issue with WordPress and no solution will be provided or can be provided in this forum, rather, you have to debug your respective cases and take it up with Amazon probably.