Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author cubecolour

    (@numeeja)

    That should be possible if you apply css rules targeting the tab elements in a print stylesheet or in an @media print media query.

    I might add something to make this configurable in the next version of Tabby Responsive Tabs or the Tabby Responsive Tabs Customiser add-on plugin

    Can you be more specific? I tried doing the following in a print stylesheet:

    .responsive-tabs__panel {
    display: block;
    }

    Which I thought should show them but it doesn’t.

    It looks like when the page prints it’s actually already accessing some different style than the screen display.

    If you could be a little more specific on how to target the tab content to show them when printing, that would be very helpful. Not sure how much of the styles are being written by jquery after the print style has loaded.

    Plugin Author cubecolour

    (@numeeja)

    Try adding the following using a custom css plugin or the custom CSS module in JetPack:

    @media print {
    	.responsive-tabs .responsive-tabs__list {
    		display: none;
    	}
    
    	.responsive-tabs .responsive-tabs__heading {
    		background: none;
    		border: none;
    		border-bottom: 1px solid #000;
    		color: #000;
    		display: block;
    		font-size: 22px;
    		font-weight: bold;
    		text-transform: inherit;
    		margin: 0;
    		padding: 10px 0;
    	}
    
    	.responsive-tabs .responsive-tabs__panel {
    		color: #000;
    		display: block!important;
    		background: none;
    		border: none;
    		margin: 0;
    		padding: 20px 0 0;
    	}
    }

    This has been tested on one of my test sites.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Printing Tabs’ is closed to new replies.