WordPress: Full Width Banner Images

All of our themes come with the option of displaying full width banner images within post/page content. This image will span the full width of the screen from left to right. Click here for an example of this feature (scroll down until you see the image which is full width across the screen).

Please note, this feature will not work when the sidebar is enabled. You can read more about disabling the sidebar on this page.

You can add a banner image to any post/page by using the shortcode below:

You should replace the IMAGE-SOURCE-HERE text with the full path to the image. For example:

The shortcode above is what has been used to create the banner on this example.

You should use an image which is 2048 pixels wide for best results. If you use an image which is too small, it will look blurry on larger screens.

By default, the image will be displayed in a banner section which is 600px high. If you would prefer to show the full sized image in its original size, you can add the “size” parameter like the example below:

Was this article helpful?

14 Comments

  1. Lucy

    Hi,
    Just came across this short code, however I’m a little confused about the IMAGE-SOURCE-HERE part, would you be able to tell me where to find this/ what to put there please.

    Many thanks,
    Lucy x

    1. Phil (pipdig)

      Hi Lucy, after uploading an image to your Media Library you can copy the source to the image file. For example, I’ve created a shortocde you could use which will display one of your images at https://pastebin.com/raw/5FCGBqGL

  2. Sandra

    Hi Phil,

    Could you please tell me the font family used on the navigation bar for aquae.pipdig.co
    I have the theme but it looks like its a different font family

    1. Phil (pipdig)

      Hi Sandra, the font is called “Montserrat”. The author of this font has made some changes recently, so you may have a slightly different version. I can’t see your site at the moment since it is hidden behind a “coming soon” page, but if you wanted me to take a look you’re welcome to send me a link to view it.

        1. Phil (pipdig)

          Thanks! Yeah it looks like you’re using the newer version of the font. Out of interest, do you prefer the other version which was in the preview? I’ll provide this as feedback to the author of the font.

            1. Phil (pipdig)

              Would you be able to send me a screenshot of what the fonts look like on your site currently? This will help me to provide feedback to the author. You could upload that to either https://imgur.com or https://snag.gy.

                1. Phil (pipdig)

                  Thanks Sandra, I’ll forward this on to the author. We’ve also highlighted some other issues too, so hopefully they will release a fix soon. Do you prefer the tallness of the original font?

                  1. Sandra

                    yes, i do. Original font was way more better looking.

        2. Carleton | Carleton Caws

          Sandra how did you put your site title in your menu-bar. Aquae theme has a header beneath the menu bar, I was wondering how you put it in the menu bar.

          1. Sandra

            Hi!

            Yes exactly like Phil said, with a plugin called “Menu Image” 🙂

Leave a comment


The link to your website will be visible to support staff only. It will not be shown publicly.