{"id":24050,"date":"2024-09-19T10:59:55","date_gmt":"2024-09-19T08:59:55","guid":{"rendered":"https:\/\/www.wjst.de\/blog\/?p=24050"},"modified":"2024-09-20T06:58:19","modified_gmt":"2024-09-20T04:58:19","slug":"when-the-printing-from-wordpress-child-theme-is-not-working","status":"publish","type":"post","link":"https:\/\/www.wjst.de\/blog\/sciencesurf\/2024\/09\/when-the-printing-from-wordpress-child-theme-is-not-working\/","title":{"rendered":"When the printing from wordpress child theme is not working"},"content":{"rendered":"

I wanted to allow a PDF download on my blog. Unfortunately this turned out to be complicated for multiple problems including WP and browser caching, CSS failure and mPDF misdirection. Here are the solutions.<\/p>\n

Issue 1: If you are editing the print.css but the browser shows the old version: Comment out or delete the reference to parent in child css<\/p>\n

\r\n\/*\r\nTheme Name: Twenty Twenty Child 1\r\nTheme URI: http:\/\/wordpress.org\/themes\/twentytwenty\r\n@import url('..\/twentytwenty\/style.css');\r\n*\/\r\n<\/pre>\n
and include versioning in header.php<\/p>\n
\r\nfunction my_theme_enqueue_styles() { \r\n  wp_enqueue_style( 'twentyfourteen', get_template_directory_uri() . '\/style.css' );\r\n  wp_enqueue_style( 'twentyfourteen-child1', get_stylesheet_directory_uri() . '\/style.css',  array(), filemtime(get_template_directory() . '\/style.css'), false );\r\n}\r\nadd_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );\r\n<\/pre>\n
 <\/p>\n
Issue 2: css editing is applied but printing is still not correctly formatted, possible due to higher specificity of formatting instructions in the parent theme<\/a>.<\/p>\n
Solution: This is a bit tricky as it needs try and error to find the offending element. Chrome can show the print version in the browser as shown on this SO thread<\/a><\/p>\n
\"\"<\/a>
https:\/\/stackoverflow.com\/questions\/9540990\/using-chromes-element-inspector-in-print-preview-mode<\/figcaption><\/figure>\n
Then add the important flag<\/a> to the specific css rule..<\/p>\n
\r\n@media print {\r\n   .myelement1 { display: none !important; }\r\n}\r\n<\/pre>\n
 <\/p>\n
Issue 3: mPDF pulls the screen<\/a> not the print version. Solution: Create an own mpdf media tag.<\/p>\n
\r\n@media mpdf {\r\n  #sidebar, #header {\r\n    display:none !important;\r\n  }\r\n  blockquote, table, pre {\r\n    page-break-inside:avoid !important;\r\n    font-size: 0.7em  !important;\r\n  }\r\n}\r\n<\/pre>\n\n
 <\/p>\n
\n  CC-BY-NC Science Surf , accessed 09.06.2026<\/span>\n <\/div>","protected":false},"excerpt":{"rendered":"
I wanted to allow a PDF download on my blog. Unfortunately this turned out to be complicated for multiple problems including WP and browser caching, CSS failure and mPDF misdirection. Here are the solutions. Issue 1: If you are editing the print.css but the browser shows the old version: Comment out or delete the reference … Continue reading When the printing from wordpress child theme is not working<\/span> →<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[4910,2822,735],"class_list":["post-24050","post","type-post","status-publish","format-standard","hentry","category-computer-software","tag-print","tag-css","tag-wordpress"],"_links":{"self":[{"href":"https:\/\/www.wjst.de\/blog\/wp-json\/wp\/v2\/posts\/24050","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wjst.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wjst.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wjst.de\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wjst.de\/blog\/wp-json\/wp\/v2\/comments?post=24050"}],"version-history":[{"count":8,"href":"https:\/\/www.wjst.de\/blog\/wp-json\/wp\/v2\/posts\/24050\/revisions"}],"predecessor-version":[{"id":24067,"href":"https:\/\/www.wjst.de\/blog\/wp-json\/wp\/v2\/posts\/24050\/revisions\/24067"}],"wp:attachment":[{"href":"https:\/\/www.wjst.de\/blog\/wp-json\/wp\/v2\/media?parent=24050"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wjst.de\/blog\/wp-json\/wp\/v2\/categories?post=24050"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wjst.de\/blog\/wp-json\/wp\/v2\/tags?post=24050"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}