Creating Ad Pages for Pugpig

Like a printed magazine, you can create ad pages for your Pugpig editions. An advert can be as simple as a static image, or something far more bespoke with interactive elements and video. 

For guidelines on creating the HTML please read Creating HTML for Pugpig. 

It's important to highlight:

• HTML must not exceed the size of the content window. For example, on an iPad this is (1024px by 748px in landscape, and 768px by 1004px in portrait when the status bar is visible). The framework is designed to pane pages to these dimensions; if your ad is any bigger it will split across panes and cause invalid snapshotting and a poor user experience. If your publication scrolls vertically or panes horizontally, then the size can increase in the relevant dimension. Please refer to the information on scaling for iPhone.
• All HTML files must be Unicode. If a file is not encoded correctly, it will appear as a blank page in Pugpig.
• Use media selectors to decide on an orientation. Injecting a style for the orientation with javascript (by detecting width and height) are unreliable. Remember your ad can rotate at any time - design animations accordingly. If you want your ad to lock orientation, you’ll need to do it yourself.
• Ad size - ads have a tendancy to be quite large in filesize with images and video content. Please be aware this will contribute to the overall edition download size and speed for your users. Optimise content where possible.

You can use the HTML5 video tag - see below. 

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

Once you've built the ad you need to get the content into your edition on a device. This can be handled as part of a static endpoint or through a CMS if you have one in place.

If the ad is being added to a static html endpoint, you will need to include (and unzip) all the files (html, images, css). It will require a manifest file and need to be added to the atom feed like any other article/page. Assets should be stored and referenced locally.

If you are using Drupal Pugpig connector we have a module to support ads, see How to Installing the Advertising Content Types

 Using the Advertising module. This allows for a CMS user to upload a zip file and include it as part of the flatplan. In this instance a manifest file isn't required because the module generates one for you but you will need to create a packaged zip file of the ad through the terminal. In terminal navigate to the folder location of your ad e.g. Desktop and use the following command: 'zip -r addname.zip foldernameonyourdesktop' e.g zip -r amexparachutes.zip amex.

• Package Document Type: Packaging your content