FEATURE: use a different Ad Manager publisher ID for mobile

FEATURE: use a different Ad Manager publisher ID for mobile

If you want to use one Ad Manager publisher on desktop and a different one on mobile, use the new dfp_publisher_id_mobile setting. By default, dfp_publisher_id will be used for both desktop and mobile.

diff --git a/assets/javascripts/discourse/components/google-dfp-ad.js.es6 b/assets/javascripts/discourse/components/google-dfp-ad.js.es6
index 55b9631..0fadf4c 100755
--- a/assets/javascripts/discourse/components/google-dfp-ad.js.es6
+++ b/assets/javascripts/discourse/components/google-dfp-ad.js.es6
@@ -123,21 +123,23 @@ function defineSlot(divId, placement, settings, isMobile, categoryTarget) {
     return;
   }
 
-  let ad, config;
-  let size = getWidthAndHeight(placement, settings, isMobile);
-
   if (ads[divId]) {
     return ads[divId];
   }
 
+  let ad, config, publisherId;
+  let size = getWidthAndHeight(placement, settings, isMobile);
+
   if (isMobile) {
+    publisherId = settings.dfp_publisher_id_mobile || settings.dfp_publisher_id;
     config = MOBILE_SETTINGS[placement];
   } else {
+    publisherId = settings.dfp_publisher_id;
     config = DESKTOP_SETTINGS[placement];
   }
 
   ad = window.googletag.defineSlot(
-    "/" + settings.dfp_publisher_id + "/" + settings[config.code],
+    "/" + publisherId + "/" + settings[config.code],
     [size.width, size.height],
     divId
   );
@@ -212,6 +214,19 @@ export default AdComponent.extend({
   loadedGoogletag: false,
   refreshOnChange: null,
 
+  @computed(
+    "siteSettings.dfp_publisher_id",
+    "siteSettings.dfp_publisher_id_mobile",
+    "site.mobileView"
+  )
+  publisherId(globalId, mobileId, isMobile) {
+    if (isMobile) {
+      return mobileId || globalId;
+    } else {
+      return globalId;
+    }
+  },
+
   @computed("placement", "postNumber")
   divId(placement, postNumber) {
     let slotNum = getNextSlotNum();
@@ -238,14 +253,21 @@ export default AdComponent.extend({
   },
 
   @computed(
+    "publisherId",
     "showToTrustLevel",
     "showToGroups",
     "showAfterPost",
     "showOnCurrentPage"
   )
-  showAd(showToTrustLevel, showToGroups, showAfterPost, showOnCurrentPage) {
+  showAd(
+    publisherId,
+    showToTrustLevel,
+    showToGroups,
+    showAfterPost,
+    showOnCurrentPage
+  ) {
     return (
-      this.siteSettings.dfp_publisher_id &&
+      publisherId &&
       showToTrustLevel &&
       showToGroups &&
       showAfterPost &&
diff --git a/config/locales/server.en.yml b/config/locales/server.en.yml
index 9e0fe3f..107a890 100755
--- a/config/locales/server.en.yml
+++ b/config/locales/server.en.yml
@@ -8,6 +8,7 @@ en:
     ads_txt: "Contents of your ads.txt file. More details available at <a href='https://support.google.com/adsense/answer/7532444?hl=en' target='_blank'>this Google AdSense help page</a>."
 
     dfp_publisher_id: "Input your Google Ad Manager (formerly called DFP) network code, which is found in your network settings."
+    dfp_publisher_id_mobile: "(Optional) If you want to use a different Ad Manager publisher id for the mobile version of the site, enter it here. Leave blank to use dfp_publisher_id on mobile."
     dfp_through_trust_level: "Show your ads to users based on trust levels. Users with trust level higher than this value will not see ads."
 
     dfp_topic_list_top_code: "Enter the unique Code of the ad unit to display above topic lists. This is the short code (max 100 chars) given to the ad unit when it was created, not the JavaScript code."
diff --git a/config/settings.yml b/config/settings.yml
index 3a2a52c..a94fb90 100755
--- a/config/settings.yml
+++ b/config/settings.yml
@@ -141,6 +141,9 @@ dfp_plugin:
   dfp_publisher_id:
     client: true
     default: ""
+  dfp_publisher_id_mobile:
+    client: true
+    default: ""
   dfp_through_trust_level:
     client: true
     default: 2

GitHub sha: 3054f253

1 Like