Mobile slots added within htmlSafe wrappers

assets/javascripts/discourse/components/google-dfp-ad.js.es6

@@ -81,6 +81,10 @@ export default Ember.Component.extend({
     return `width: ${this.get('const_width')}px; height: ${this.get('const_height')}px;`.htmlSafe();
   }.property('const_width', 'const_height'),
 
+  adWrapperStyleMobile: function() {
+    return `width: 320px; height: 50px;`.htmlSafe();
+  },
+
   _initGoogleDFP: function() {
     var self = this;
     loadGoogle(this.siteSettings).then(function() {

assets/javascripts/discourse/templates/components/google-dfp-ad.hbs

@@ -1,8 +1,21 @@
 <div class="google-dfp-ad-label"><h2>Google Ad Plugin Display</h2></div>
+
+{{#if site.mobileView}} 
+
+  <div id={{divId}} style={{adWrapperStyleMobile}} class="dfp-ad-unit" align=center> 
+  	{{#if loadedGoogletag}}
+    <script type='text/javascript'>
+    googletag.cmd.push(function() { googletag.display('{{divId}}'); });
+    </script>
+
+{{else}}
+
   <div id={{divId}} style={{adWrapperStyle}} class="dfp-ad-unit" align=center> 
   	{{#if loadedGoogletag}}
     <script type='text/javascript'>
     googletag.cmd.push(function() { googletag.display('{{divId}}'); });
     </script>
-  {{/if}}
-</div>
+
+{{/if}}
+
+</div>