How To Create a Cover With nopea.media plugin

Learn how to make a cover for your magazine with nopea.media with only using WordPress text editor. You will get a stylish final result without separate publication softwares.

In How to Add a PDF File Into a Nopea.media Publication we explained how you can add a PDF file made with different softwares, such as Affinity Photo or InDesign, to your nopea.media publication.

Now we have developed nopea.media plugin so that you can make your publication’s cover and back pages only using nopea.media. You don’t need separate softwares to make a cover anymore. However, if you want a cover with very specific styles, it’s still possible to add a separate PDF as instructed above.

We created new text editor blocks: “PDF Heading” and “Fixed block” which makes creating cover pages easy. You can utilize the blocks in a following way:

  • PDF Heading – how it differs from the standard heading block is that you can determine the:
    1. size of the heading (pixel size)
    2. font color of the heading (white, black or the primary / secondary color determined in your nopea.media settings)
    3. background color of the heading (you can choose the color value from the chart / hexadecimal value)
  • Fixed block
    1. With fixed block you can limit an area either from the top or bottom of the page and add content there (PDF Heading, Heading or Paragraph)
    2. You can determine a padding to the top / bottom of the page for fixed blocks. You can also change the background color of the block (white, black or the primary / secondary color determined in your nopea.media settings)

So with PDF Heading and Fixed block you can determine the cover’s fixed areas at the top or bottom of the page, colors and the size of the heading and text. Often there is an image on the cover which you can add as follows:

  • Cover photo
    1. You can determine a background image to all of the PDF pages generated with nopea.media so the image will cover the whole page.
      • Fixed blocks go on to the top of the image so crop the image and the size of fixed blocks if needed, in a way that the final result looks good.
    2. Instead of background image, you can also add an image by adding it as a featured image and set the image size to 3/4 in PDF settings.
  • Heading of a post
    1. WordPress text editor requires a heading for a post. If you use a PDF Heading block, you don’t want the heading of the WordPress post to be visible. Hide the heading from PDF settings: Heading position -> Under Main Image + Heading style -> Hide Heading.

Tip! You can determine the PDF’s primary and secondary color in the plugin settings. The settings are located in the left sidebar “Publications” -> “Settings” -> “PDF Color Scheme”. The color(s) must be in CMYK format. Primary color determines the color of headings and emphasized text such as bold text. You can choose either the primary or the secondary color to be used for PDF Headings and Fixed blocks.

Cover pages created with nopea.media

Below you can see screenshots of examples of cover pages that are made with nopea.media. There are two versions of cover pages that were made for “Erilaisten oppijoiden liitto”. Their LukSitko magazine is produced with nopea.media as an online WordPress site and as a printed publication including the same content.

Example 1: Fixed top and bottom blocks with background color, PDF Headings and background image

In this version, the background color of Fixed blocks was the primary color determined in nopea.media settings. The color of PDF Headings and paragraphs inside the Fixed blocks were determined as white.

The padding of Fixed blocks was 20 px and the texts of the lower block were set loosely which meant that the image had less space.

The client wanted the image to be bigger and the font color of the texts as red in white background. Those were easy to fix in Fixed block and PDF Heading settings and by adjusting the image size.

Example 2: Fixed top and bottom blocks without background color, PDF Headings and a bigger background image

To the latter, final version of the cover page the background color of Fixed blocks were set as white. The color of PDF Headings were set as a secondary color which was determined in nopea.media settings and the color was taken from the image’s red ball (cheek) with pipet.

The padding of Fixed blocks was downsized and the bottom block’s texts adjusted so the image had more space.

Size of the page in publications made with nopea.media is 1306 x 1800 px. Cover image’s background and size were adjusted with free program called Gimp in a way that the canvas page was the required 1306 x 1800 px and so the image settled right sized with other content.

Back cover with nopea.media

LukSitko magazine’s back cover was also made with nopea.media. First, a full-sized image was added to the page and after that a “PDF Columns” block which contains the texts. The heading of the post is hidden in text-editor’s settings so it is not visible in the back cover.

You can find the whole print-ready PDF file of LukSitko-magazine publication number 2020 clicking here. (Finnish)