'Search' from footer to header? Editing the /search?

Site URL: https://julehjaelpen.dk/

Hello 
Is there a code for moving the search to the header? And how can I replace the box with just an icon?
My page for search results need to be customized because the menu is not readable.
How can I get access to the search page?

Look forward to hear from you.

Regards,
Marianne

You need to add Search Block on Footer, then use jQuery to move it to header.

With search icon. You can use CSS to handle.

Which plan do you use?

I have added the Search Block on Footer. Which jQuery shall I use?

I am using 7.1 - not sure about plan?

The plan is Business. 
Look forward to hear from you. Thanks.

You can use a text link to search. The word search will work, pulls up a page from inside or outside your site. You can put it anywhere on your site, including your nav bar, no code needed just your url with /search on the end. Like this:

Search

Thank you derricksrandomviews!
I would like to place the icon here in the header just beside the social icons. The text Search should be white instead of grey. I would also like to place the Danish Word 'Søg' instead of 'Search'
https://static1.squarespace.com/universal/images-v6/icons/icon-searchqueries-20-light.png

I have added the following CSS to remove everything else but the icon and the text. It seems to work but I need the code to change the grey color to white.
.sqs-search-ui-button-wrapper.color-light .search-input {
background-image: url(/universal/images-v6/icons/icon-searchqueries-20-light.png);
color: #ffffff!important;
border: 0px!important;
transition: none!important;
opacity: 100!important;
}

The section in the header only has few configurations like one button option and the social links. There is no way to put anything else here. Do you know which query code I can use to place search beside the social links in the header?

The problem is also that I can't edit the https://julehjaelpen.dk/search - I would like to place and image in the top like all other pages. Otherwise my menu is not visible. How can I edit the search page?

I would appreciate your help. Look forward to hear from you.

All the best,
 

I have not edited a new https://julehjaelpen.dk/search - the problem about not visible links at search page is solve.

Now I just need this jQuery code to move the icon to the header. And changing the grey text 'Search' into white and 'Søg'

Hope you can help. Thank you so much in advance.

I have a question, did you choose language and region from settings or type it in yourself? I think I know the answer already, but some people miss that option. Also you can upload language fonts which changes the whole site including the search option to reflect that font change. 

https://support.squarespace.com/hc/en-us/articles/360000308127-Writing-in-your-language

I have no problem writing in own languages. It is only this little string "Search" which I can not translate because it is pre filled text field from backend.
And I can't move the Search icon from footer to the header.

Hope someone can help me with the jQuery code? @Tuanphan, do you have a suggestion please? Hope to hear from you.

 

Please can someone help me?

- Moving the Search icon from footer to the top?
- Change the color of the text 'Search' to white?
- Translate the 'Search' text 

All the best,

sorry, I charged this for 2 clients so I can't share detail code.

- Moving the Search icon from footer to the top?

With these, if you need, I can give code for free

•  Change the color of the text 'Search' to white?
• Translate the 'Search' text 

Thanks. I understand now. I thought you were from the Squarespace support.

I would be happy if you will share the code for 

• Change the color of the text 'Search' to white?
• Translate the 'Search' text 

 Best regards,

8 hours ago, Brahe said:

Thanks. I understand now. I thought you were from the Squarespace support.

I would be happy if you will share the code for 

• Change the color of the text 'Search' to white?
• Translate the 'Search' text 

 Best regards,

I am not a Squarespace employee. Search color/text on Search Page or Footer Search Block?

Hi Tuanphan

The Search color/text in footer and the translation for both. 

Thank you so much in advance.

On 6/4/2020 at 2:17 PM, Brahe said:

Hi Tuanphan

The Search color/text in footer and the translation for both. 

Thank you so much in advance.

Hi. Add to Home > Design > Custom CSS

footer.sections .search-input::placeholder {
    color: white;
}

and add to Home > Settings > Advanced > code Injection > Footer

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
jQuery(function($){
    $("footer.sections .search-input::placeholder").html(function() { 
          return $(this).html().replace("Search", "New Text");  
    });
});
</script>

Thank you so much. But the translation is not working. The placeholder can be changed with the code.