html - Can't add image to site via php

I'm modifying a WordPress child template which is working live with an ad-bar at the very top of the page just below the </head>. I have included the code being used on the working site below.

<div class="topbar">
   <div class="adspace">
        <div class="ad-placeholder">
            <script async type="text/javascript">
                    var images = [],
                    index = 0;
                    images[0] = "<a href='https://localhost/wordpress_site/contact-us/'><img src='https://localhost/wordpress_site/wp-content/uploads/2018/12/image1.gif' /></a>";

                    images[1] = "<a href='/' target='_blank'><img src='https://localhost/wordpress_site/wp-content/uploads/2018/12/image2.gif' /></a>";


                    index = Math.floor(Math.random() * images.length);
                    document.write(images[index]);
                    //done
            </script>
        </div>
    </div>
</div>

However, when I try to use that child theme on another site, the image does not appear. The image is added to the HTML, and the browser can see the image URL when entered directly into the URL bar.

I also tried adding the image simply via an tag in various places into the site. It would not add and when I checked the console I noticed the following:

I checked the "Inspect Element" of Firefox and included a screenshot of that. It says "Could not load image." Also, in the element console, in the middle column is says:

img[src$="/wordpress_kincardine/wp-content/uploads/2018/12/ad_banner.png"] {

    display: none !important;
    visibility: hidden !important;
    height: 0px !important;
    min-height: 0px !important; 

Could that be what is causing the image to not appear, or how can I find out what is causing the image to not appear?

I'm modifying a WordPress child template which is working live with an ad-bar at the very top of the page just below the </head>. I have included the code being used on the working site below.

<div class="topbar">
   <div class="adspace">
        <div class="ad-placeholder">
            <script async type="text/javascript">
                    var images = [],
                    index = 0;
                    images[0] = "<a href='https://localhost/wordpress_site/contact-us/'><img src='https://localhost/wordpress_site/wp-content/uploads/2018/12/image1.gif' /></a>";

                    images[1] = "<a href='http://www.linksite/' target='_blank'><img src='https://localhost/wordpress_site/wp-content/uploads/2018/12/image2.gif' /></a>";


                    index = Math.floor(Math.random() * images.length);
                    document.write(images[index]);
                    //done
            </script>
        </div>
    </div>
</div>

However, when I try to use that child theme on another site, the image does not appear. The image is added to the HTML, and the browser can see the image URL when entered directly into the URL bar.

I also tried adding the image simply via an tag in various places into the site. It would not add and when I checked the console I noticed the following:

I checked the "Inspect Element" of Firefox and included a screenshot of that. It says "Could not load image." Also, in the element console, in the middle column is says:

img[src$="/wordpress_kincardine/wp-content/uploads/2018/12/ad_banner.png"] {

    display: none !important;
    visibility: hidden !important;
    height: 0px !important;
    min-height: 0px !important; 

Could that be what is causing the image to not appear, or how can I find out what is causing the image to not appear?

• images
• html

Share Improve this question edited Dec 18, 2018 at 15:55 Jacob Peattie 44.3k1010 gold badges5050 silver badges6464 bronze badges asked Dec 18, 2018 at 15:48 I'm Root JamesI'm Root James 12388 bronze badges 2

• 1 Are you using an ad blocker on your browser? – rudtek Commented Dec 18, 2018 at 16:11
• awesome. Posted as an answer. Would you mind checking it as accepted to close the question? – rudtek Commented Dec 18, 2018 at 16:55

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 1

While not really a WordPress issue, it is something we're all probably going to have to deal with in developing. Check to make sure your ad blocker isn't the problem. If it is, add your sites to the allowed list of domains so that you can still see what your site is supposed to look like.