PDF blocks - nopea.media WordPress plugin

Create a Printed Article with the nopea.media WordPress Plugin

If you know how to create content with the WordPress Gutenberg editor, then creating a printed article with nopea.media is no news to you. In this article we’ll go through the process step-by-step.

If you know how to create content with the WordPress Gutenberg editor, then creating a printed article with nopea.media is no news to you. In this article we’ll go through the process step-by-step.

Once you’ve installed the nopea.media plugin to your WordPress site, you can use it any time in the text editor. The plugin comes with a “PDF Options” control panel as well as specially designed PDF blocks that help you place your content into columns, add space, use infoboxes or make column or page breaks. What’s worth noticing, is that making adjustments to your print article won’t affect the layout of the online article. You can preview both versions as you go by clicking “View PDF” (for print) and “Preview” (for web).

Find all nopea.media blocks from the “PDF Blocks” Category

As usual in the WordPress Gutenberg editor, start by writing your article heading where it says “Add title”. Continue by writing text where the cursor is, or add content using blocks. Look for blocks by clicking the plus marks.

Nopea.media PDF Blocks

The nopea.media WordPress plugin comes with the following PDF Blocks that all have specific features helping you achieve the desired look for your PDF and printed publication. Next, we’ll go through the functionalities of each block.

PDF Columns: Content field you can divide into 1 to 3 columns

PDF Columns image: Content field you can divide into 2 to 3 columns and add an image to the right upper corner

  • With three columns, the image will be two columns wide. With two columns, the image will be one column wide
  • Image size adjustable

PDF Image & content: Block allowing you to place image and text side-by-side or one below another

  • Place image: right, left or on top
  • Image size adjustable

PDF Infobox: Content field with adjustable background color and border

  • Style and size adjustable

PDF Spacer: Adds empty space in between blocks with adjustable height

PDF 2 Columns: Two separate content fields that go side-by-side and both have one column

  • Column width adjustable

PDF Column Break: pushes column content to next column

  • Available in multiple column blocks (“PDF Columns” and “PDF Columns Image”)

PDF Page break: Pushes content to next page

Table of content & Table of content text area: Create your table of contents with these blocks

Listing container and Listing item: use these in your table of contents page

Fixed block: Allows you to make a fixed footer to a page

Handling the Content in Blocks

Each content, such as heading, text chapter or image are inside their own block. You can drag-and-drop blocks or relocate them by clicking the arrows on the side of each block. This makes layout designing intuitive and straightforward.

PDF Blocks / nopea.media

Looking at Block Navigation you can see all blocks you’ve added, their structure and order. You can also go to your desired block by clicking it in the navigation.

It’s possible to place blocks inside one another. In the screen shot below, for example, there are headings, lists and paragraphs inside the columns of the PDF 2 Columns block.

block navigation / nopea.media

By clicking a certain block you can adjust its settings. The Block settings will appear on the right hand settings panel.

The example image presents settings for the block “PDF Columns”. You can adjust e.g. the number of columns, their margin and text alignment or fit content to a new page.

In PDF image & content blocks, you can adjust image position and content width to determine which proportion of the page width will be for text and which for the image. In what you’re reading right now, we’ve used the block PDF image & content, with image positioned left and the text content being of value 4 (width).

Adjusting the PDF File Settings

By clicking the plug icon in the right upper corner you get access to the PDF settings. These settings won’t affect the article’s online version but only the PDF and the publication you are about to press.

This is where you can select the important layout features for the article, such as margins and size of the featured image in print. You can also choose a background picture or color for the page.

At the top of PDF Options is the “Generate PDF” tick-box where you can choose to automatically generate a PDF from your content. A PDF is generated every time you click “Save draft” or “Update”.

Show Footer means the footer you’ve created in the publications settings will show on the page the article you’re working on is. You can add and modify the content of the footer in the “Publications” view, which is where you’ll also select e.g. the order of your articles in the publication.

By selecting the PDF Type, you determine whether the PDF will be shared only online (Web) or if it will go to press (Print). Selecting “Print” means the article will be press ready: images in PDF will be full-size and the document will include bleeds and crop marks. Selecting “web” means the images will be smaller and the file won’t include bleeds. Web quality is much smaller in file size and thus suitable e.g. for sharing the PDF online or by email, or when printing it yourself. If you print the PDF with home printer, you won’t need bleeds to mess with your print settings.

From “Add PDF Page” you can add a separate PDF page as part of your publication (e.g. cover page or a full-page ad).

The article’s main heading can be placed either on top of main image or under main image. By selecting “on top of main image”, the main image will be on the background of the heading and the heading will also have a background color. If you don’t have a featured image or choose not to show it in print, the heading will get a background color with the selection “on top of main image”. By selecting “under main image”, you can also choose to hide the header entirely or to underline the heading.

Adjust page margins if need be from the PDF Layout Options.

You can also choose the image size in relation to the page size. Options are for the image to fill a quarter, a third, half, two thirds or three quarters of the page.

Selecting the theme is important for your articles to look cohesive in the publication. The themes are preset entities that determine e.g. the colors, fonts and font sizes of headings and paragraphs. It’s advisable to use the same theme throughout the publication.

You can select a background image or color for your article from “Background Image” or “Background Color”.

When you’ve chosen to generate a PDF from your content, select the publication you wish to include the article in by ticking your selection in “Publications”.

Adding a Featured Image

Add your featured image for the article in the WordPress document settings panel. This will be your article’s main image online and by default in the PDF too. If you wish not to show the image on the printed publication, adjust settings in the PDF Options panel by selecting “Show featured image –> No”. For the PDF you can also determine where to show the image: under heading or on top of heading.