I think you want to redesign (alter) the presentation when you are printing that page/content and in this case (if really this is the case) you may add a different css styles
for print media
, for example:
<link rel="stylesheet" type="text/css" media="screen" href="style.css">
<link rel="stylesheet" type="text/css" media="print" href="print.css">
if you add another CSS file and style those elements differently in that CSS file then those styles would be applied only when the pages is being printed, so you may add in that CSS:
#search_bar_at_top {
display:none; /*Hide the search bar*/
}
Or using in the same CSS file using media print
:
@media print{
#search_bar_at_top {
display:none; /*Hide the search bar*/
}
}
Check more on MDN and other helpful articles:
How To Set Up A Print Style Sheet
Print Different
CSS Media Types Create Print-Friendly Pages