Print My Blog’s CSS Classes

Print My Blog (PMB) Pro’s CSS classes are used to give content a special design in your projects.

In WordPress’ Block Editor (Gutenberg), to add a CSS class onto any block,

  1. Click on a block
  2. On the righthand “Settings” page, click “Advanced”
  3. Under “Additional CSS class(es)” add any CSS classes

If you want to add more than one, just separate them with a space.

Controlling Pagebreaks

pmb-break-before

Always have a page break before this element. Eg. you want a title to always appear at the top of the page.

pmb-break-after

Always have a page break after this element. Eg. you want an image to always be the last item on the page.

pmb-no-break

Avoid a page break inside this element. Eg, you might want to use this to keep a paragraph of text all on one page, rather than having it split across two.

pmb-no-break-after

Avoid a page break after this element. Similar to pmb-no-break-before

pmb-no-break-before

Avoid a page break before this element. Eg, you might want to have a paragraph or image always be on the same page as the paragraph preceding it.

Controlling Whether Content Appears on the Website, Print, etc.

pmb-print-only

Only shows the element in a PMB quick print or PMB project, not when viewing on the frontend of your website. Eg, you might use this for text or an image that’s unnecessary on the frontend of your website, but helpful in a PDF or other format of project.

pmb-screen-only

Only shows the element on the frontend of your website, not when in a PMB quick print or PMB project. Eg, interactive content like a video or a form probably only makes sense to view on the website, but not in a PDF.

Controlling Block Floating/Snapping

Control whether and how blocks should be removed from the normal content flow.

pmb-dont-snap

Prevents this element from snapping, even if your design is set to snap images to the nearest page edge. Eg. if you have an image which must appear directly after a paragraph of text, add “pmb-dont-snap” as a CSS class onto the image. Other images will snap according to your design and its settings.

pmb-float-top

Makes the element float to the top of the page. Useful if you want an image or a line of text to always appear at the top of the page (but not quite in the top margin).

pmb-float-bottom

Makes the element float to the bottom of the page. Useful if you want an image or text to always appear at the bottom of a page (but not quite in the bottom margin).