Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
Brahe

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

Recommended Posts

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


 

Share this post


Link to post

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

I am using 7.1 - not sure about plan?

Share this post


Link to post
Posted (edited)

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

Edited by derricksrandomviews

Share this post


Link to post

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,
 

Share this post


Link to post

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.

Share this post


Link to post

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

Share this post


Link to post

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.

 

Share this post


Link to post

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,

Share this post


Link to post

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 

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post

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,

Share this post


Link to post
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?


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post

Hi Tuanphan

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

Thank you so much in advance.

Share this post


Link to post
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>

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post

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

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...