Search Page Theme Selection

Site URL: https://camilokoch.com

Hello. I would like to customize the theme of the search page (www.camilokoch.com/search) to 'dark minimalist,' currently set on 'white minimalist' by default. There is no visual editor neither theme selection option for the search page; is there a way to force this page to utilize the dark minimalist theme? Thanks.

i would appreciate the help, thank you

Can you describe in detail? Header color, text color, background...?

12 hours ago, tuanphan said:

Can you describe in detail? Header color, text color, background...?

thank you, @tuanphan

as the attachments show, the whole website utilizes the "dark minimal" theme, and the search page utilizes the "white minimal" theme. the issue is that the search page does not allow me to directly change the theme when clicking the "edit" button on top (as shown in the third attachment). my question is then: is there a way to force the search page by code to utilize the "dark minimal" theme? thanks again.

hello @tuanphan, did I clarified it well? thanks again for your kind help

On 1/30/2021 at 7:37 AM, caig said:

hello @tuanphan, did I clarified it well? thanks again for your kind help

Hi. Sorry for the delay. I was off some day.

Do you still need help on this?

On 2/1/2021 at 10:14 AM, tuanphan said:

Hi. Sorry for the delay. I was off some day.

Do you still need help on this?

hi @tuanphan, i hope you enjoyed the time off

thank you; this is still unsolved and i will appreciate your help, if possible

Hey all!
I'm having a similar issue here. I need to change the background color of the header on the /search page but can't figure out how to do it.

• Articles Blog page: https://www.90daybusinesslaunch.com/articles 
• Search results page: https://www.90daybusinesslaunch.com/search?q=social&f_collectionId=5f753f63cd2d631e09f9c037

I added a Search function to the Articles blog, and the Search results page (/search) is showing White on white text in the header - and therefore, you cannot see the Navigation. Any ideas how to get the header to Light Minimal or Light bold? The only target ID i can find is #yui_3_17_2_1_1612820908662_89 and i can't get it to do anything.

I've attached screenshots of 1) all white header, as well as 2) me mousing over the nav so you can see  invisible nav.

This is somewhat urgent as it's live on the client's site. THANK YOU! 
 

may we invoke the precious help of @tuanphan

thanks!

On 2/9/2021 at 5:07 AM, raeroshow said:

Hey all!
I'm having a similar issue here. I need to change the background color of the header on the /search page but can't figure out how to do it.

• Articles Blog page: https://www.90daybusinesslaunch.com/articles 
• Search results page: https://www.90daybusinesslaunch.com/search?q=social&f_collectionId=5f753f63cd2d631e09f9c037

I added a Search function to the Articles blog, and the Search results page (/search) is showing White on white text in the header - and therefore, you cannot see the Navigation. Any ideas how to get the header to Light Minimal or Light bold? The only target ID i can find is #yui_3_17_2_1_1612820908662_89 and i can't get it to do anything.

I've attached screenshots of 1) all white header, as well as 2) me mousing over the nav so you can see  invisible nav.

This is somewhat urgent as it's live on the client's site. THANK YOU! 
 

 

Have you solved it yet?

21 hours ago, caig said:

may we invoke the precious help of @tuanphan

thanks!

I think you need to use custom code to change cart page style. If you describe in detail what you want, we can give code easier

On 2/19/2021 at 9:19 PM, tuanphan said:

Have you solved it yet?

I think you need to use custom code to change cart page style. If you describe in detail what you want, we can give code easier

thanks, @tuanphan, that's correct, this issue requires custom code for the cart page style. the detailed description is here: https://forum.squarespace.com/topic/179205-search-page-theme-selection/?do=findComment&comment=430497. please let me know if more details are required. i appreciate your help, thanks.

Hi al! This is still unresolved. I'd love some help as I've tried a bunch of stuff to no avail. 🙂

Here is a little more info:

• When you add a blank new page in 7.1, the top section of the page defaults to  "White Minimal" color section. It seems that this /search page defaults to "White minimal" as well.
• On this particular website - "white minimal" is set to have white navigation text and a white background color. This is because all of my other pages have header images so the white on white isn't a problem.
• Unfortunately, you cannot do either of these things: 
  • a) add a header image to the /search page
  • b) change the color of the top section to the /search page (for example to "White Bold") 

Any ideas? Here is the link: 

https://www.90daybusinesslaunch.com/search?q=social media&f_collectionId=5f753f63cd2d631e09f9c037

On 2/24/2021 at 4:13 AM, raeroshow said:

Hi al! This is still unresolved. I'd love some help as I've tried a bunch of stuff to no avail. 🙂

Here is a little more info:

• When you add a blank new page in 7.1, the top section of the page defaults to  "White Minimal" color section. It seems that this /search page defaults to "White minimal" as well.
• On this particular website - "white minimal" is set to have white navigation text and a white background color. This is because all of my other pages have header images so the white on white isn't a problem.
• Unfortunately, you cannot do either of these things: 
  • a) add a header image to the /search page
  • b) change the color of the top section to the /search page (for example to "White Bold") 

Any ideas? Here is the link: 

https://www.90daybusinesslaunch.com/search?q=social media&f_collectionId=5f753f63cd2d631e09f9c037

Do you use Personal or Business or Commerce plan?

21 hours ago, tuanphan said:

Do you use Personal or Business or Commerce plan?

This site is on the Business Plan - thanks!

On 2/24/2021 at 5:13 AM, raeroshow said:

Hi al! This is still unresolved. I'd love some help as I've tried a bunch of stuff to no avail. 🙂

Here is a little more info:

• When you add a blank new page in 7.1, the top section of the page defaults to  "White Minimal" color section. It seems that this /search page defaults to "White minimal" as well.
• On this particular website - "white minimal" is set to have white navigation text and a white background color. This is because all of my other pages have header images so the white on white isn't a problem.
• Unfortunately, you cannot do either of these things: 
  • a) add a header image to the /search page
  • b) change the color of the top section to the /search page (for example to "White Bold") 

Any ideas? Here is the link: 

https://www.90daybusinesslaunch.com/search?q=social media&f_collectionId=5f753f63cd2d631e09f9c037

correct; I need to change the /search page and the /cart page from "white minimal" to "dark minimal" and I don't know how to do that.

the /search page is not editable; same situation for the /cart page. both pages remain with "white minimal" color selection due to its "default" state. the new visual "site styles" editor recently added to squarespace is not available on these two pages either. the website is on a business plan and this situation is unresolved too. thanks @tuanphan

@caig Can you describe in dark minimal style? Or you want to change cart page header color only? Add this to Design > Custom CSS

body#cart header#header {
    background: gray !important;
}

Hi friends, 

I'm still trying to change the background color of the header on the /search page, if anyone has advice!  Thank you! 🙂

https://www.90daybusinesslaunch.com/search 

You can get to the search page by going here https://www.90daybusinesslaunch.com/articles  and searching for any term. 

Thanks!
Rachel 

On 4/7/2021 at 12:12 AM, raeroshow said:

Hi friends, 

I'm still trying to change the background color of the header on the /search page, if anyone has advice!  Thank you! 🙂

https://www.90daybusinesslaunch.com/search 

You can get to the search page by going here https://www.90daybusinesslaunch.com/articles  and searching for any term. 

Thanks!
Rachel 

Hi. Add this to Settings > Advanced > Code Injection > Header

<script>
  if (window.location.pathname == '/search'){
    document.querySelector('body').classList.add('t-search')
  }
</script>
<style>
  .t-search header#header {
    background: black !important;
}
</style>

On 4/7/2021 at 12:12 AM, raeroshow said:

Hi friends, 

I'm still trying to change the background color of the header on the /search page, if anyone has advice!  Thank you! 🙂

https://www.90daybusinesslaunch.com/search 

You can get to the search page by going here https://www.90daybusinesslaunch.com/articles  and searching for any term. 

Thanks!
Rachel 

also, the site has small problems

Site URL – https://www.90daybusinesslaunch.com/

1. (Tablet-Search) Want to increase form width?

2. (All screen) Remove white padding on popup?

18 hours ago, tuanphan said:

<script> if (window.location.pathname == '/search'){ document.querySelector('body').classList.add('t-search') } </script> <style> .t-search header#header { background: black !important; } </style>

1. First off - thanks for the response. Really appreciate it! I've had this one on my mind for a long time.

Sadly, I couldn't get that code to work. It should be in there now if you want to check it out. 

https://www.90daybusinesslaunch.com/search 

2. Regarding my pop ups, yeah those have been a little icky for a while. Embarrassed you noticed! 🙂 If you have any advice, I'm all ears! 🙂

23 hours ago, tuanphan said:

Hi. Add this to Settings > Advanced > Code Injection > Header

<script>
  if (window.location.pathname == '/search'){
    document.querySelector('body').classList.add('t-search')
  }
</script>
<style>
  .t-search header#header {
    background: black !important;
}
</style>

hi @tuanphan, inserted it but not working. please help me check it out, thank you!

https://camilokoch.com/search?q=hello

On 4/13/2021 at 8:25 AM, caig said:

hi @tuanphan, inserted it but not working. please help me check it out, thank you!

https://camilokoch.com/search?q=hello

 

On 4/13/2021 at 3:53 AM, raeroshow said:

1. First off - thanks for the response. Really appreciate it! I've had this one on my mind for a long time.

Sadly, I couldn't get that code to work. It should be in there now if you want to check it out. 

https://www.90daybusinesslaunch.com/search 

 

2. Regarding my pop ups, yeah those have been a little icky for a while. Embarrassed you noticed! 🙂 If you have any advice, I'm all ears! 🙂

 Hi,

Remove above

add this to Code Injection Footer

<script>
if (document.location.pathname.indexOf("/search") == 0) {
    document.querySelector('body').classList.add('sqs-search-page')
}
  </script>

add this to Code Injection Header

<style>
  .t-search header#header {
    background: black !important;
}
</style>

7 hours ago, tuanphan said:

 

 Hi,

Remove above

add this to Code Injection Footer

<script>
if (document.location.pathname.indexOf("/search") == 0) {
    document.querySelector('body').classList.add('sqs-search-page')
}
  </script>

 

add this to Code Injection Header

<style>
  .t-search header#header {
    background: black !important;
}
</style>

 

@tuanphan thanks again for your kind help.

the code was added but no changes so far; please check it out whenever you can

all the best

21 hours ago, caig said:

@tuanphan thanks again for your kind help.

the code was added but no changes so far; please check it out whenever you can

all the best

ah sorry, missing classs, edit code in Code Injection Header to this

<script>
if (document.location.pathname.indexOf("/search") == 0) {
    document.querySelector('body').classList.add('t-search')
}
  </script>

@raeroshow hello! thanks to the help of @tuanphan, i am summarizing what to add and where in order to change the color of the header in the search page:

1. in code injection header add the following and replace #1c1c1c for the color required:

<style>
  .t-search header#header {
    background: #1c1c1c !important;
}
</style>

2. in code injection footer add the following:

<script>
if (document.location.pathname.indexOf("/search") == 0) {
    document.querySelector('body').classList.add('t-search')
}
  </script>

3. additionally, you may need to change the navigation text color; add the following in custom css to change it globally:

.header-nav-item a, .header-menu-nav-item a {color: white !important;}

thanks for your infinite patience, @tuanphan. to anyone landing here, consider this as a fix because until today, there is no other way to customize the search page from the squarespace site styles menu. we may face the same situation when customizing the cart page. keep it up!