Search Results Page - Customise "Search" title + "Type to search" text

Hello,

I managed to customise my search results page nicely, however I cannot find any answer how to customise: 

1. "Search" title text - I want to make it smaller and preferable in the middle of the page

2. "Type to search" - it is so pale, I can hardly see it, I want to change colour to darker grey.

Thank you so much for your help. I really appreciate it.

Jevgenia 

Hi,

#1. Can you share site url?

#2. Add this to Website > Website Tools > Custom CSS. If it doesn't work, please share site url, we can help easier

.sqs-search-container input::placeholder, .sqs-search-container input {
    color: darkgrey !important;
}

8 hours ago, tuanphan said:

Hi,

#1. Can you share site url?

#2. Add this to Website > Website Tools > Custom CSS. If it doesn't work, please share site url, we can help easier

.sqs-search-container input::placeholder, .sqs-search-container input {
    color: darkgrey !important;
}

 

Hello,

Thank you so much for the questions number 2, it worked!!!

Still can't figure out how to change the "Search title text" to make it smaller and centerer. The site url is:

www.mursclairs.com

Thanks a lot in advance, I found so many answers from your posts.

Jevgenia 

On 9/14/2023 at 4:09 PM, Jevgenia said:

Hello,

Thank you so much for the questions number 2, it worked!!!

Still can't figure out how to change the "Search title text" to make it smaller and centerer. The site url is:

www.mursclairs.com

 

Thanks a lot in advance, I found so many answers from your posts.

Jevgenia 

Add this to Custom CSS

/* Search text */
.sqs-search-page.sqs-search-page-content::before {
    font-size: 16px;
    display: block;
    text-align: center;
}

On 9/14/2023 at 8:54 PM, tuanphan said:

Hi,

#1. Can you share site url?

#2. Add this to Website > Website Tools > Custom CSS. If it doesn't work, please share site url, we can help easier

.sqs-search-container input::placeholder, .sqs-search-container input {
    color: darkgrey !important;
}

 

thanks @tuanphan worked a charm

is there any way I can move the search icon to be the "1st element" from the "last element" in my link bar?

https://turkey-decagon-5rfj.squarespace.com/search


thank you

On 11/3/2023 at 12:19 PM, ShortAngryViking said:

thanks @tuanphan worked a charm

is there any way I can move the search icon to be the "1st element" from the "last element" in my link bar?

https://turkey-decagon-5rfj.squarespace.com/search


thank you

Move this?

yes, exactly 

Add to Last Line in Code Injection > Footer

<script>
  $(document).ready(function(){
    $('.header-display-desktop div.search-icon').insertBefore('nav>div:first-child');
});
</script>

Thank You @tuanphan