[Resolved] Use Simple CSS to edit print styles?

[dkrgen]

Hello, I want to customize the way the page looks when the user prints it.

Is it possible to use Simple CSS for this? I hesitate to create child themes and/or edit php files because I’m not a developer and also concerned about forgetting to update a file if there is an upgrade. (I have the SOGO Add Script Header Footer plug-in.)

PRINT STYLE GOALS
1. Print Site Title instead of Logo (because my logo has an inky black background)
2. Hide sidebar
3. Hide menus
4. Black font
5. White background
6. Avoid page breaks in weird places

Thanks!

[Tom]

Hi there,

You can use this media query:

@media print {
    .sidebar,
    .main-navigation,
    .site-logo {
        display: none;
    }

    body {
        background: #fff;
        color: #000;
    }
}

The above CSS is just a guess as I can’t see your site.

Let me know if this helps or not 🙂

[dkrgen]

Wow, that totally works!! Thanks, Tom!

[Tom]

You’re welcome 🙂

[Author]

Posts