Forum Discussion

Daniel Westerdale's avatar
Daniel Westerdale
Iron Contributor
May 16, 2018

Customising the search box Ui in SharePoint 2016

Hi

 

I have been asked to improve the appearance of  a search box that is centrally ( don't ask!)  situated on a SharePoint 2016 publishing site landing page.

 

I can toggle with Search box web part settings to switch between search center and a custom search results page:

 

Here the issue is how do I change the height as it looks a bit odd on the page :-(

 

With the custom results page option issue is conversely,  the width - the entire web part zone is filled!

 

Ideally I want the users to have a consistent search experience on the intranet so I am thinking I should go for the first option.  Therefore, If the problem is a CSS style that is being overridden then any pointers will be useful Note, there is an  underlying (archaic) custom responsive master page + CSS +JS which I do want to replace once the business is happy with the searching capability.

I am thinking of the Enable-PnPResponsiveUI --> Classic Team Site (STS#0) but still need to deal  responsive UI Page Layouts.

PnP
Publishing
Searching
SharePoint 2016
  • Deleted's avatar
    Deleted
    May 18, 2018

    I'm not sure if I got your question correct, but if you want to style a search box webpart you can copy and modify the oob display template for the search box.

     

    In the webpart settings of the search box you can then select the display template that shall be used by the search box. I'm currently on the wrong device so I cannot double check it, but im pretty sure I did this some time ago.

Resources