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

Search icon opens into full screen


MaggieBovary

Question

Site URL: https://keyboard-jaguar-k52z.squarespace.com/

Hi there,

I'm trying to achieve this effect: when clicking on the search icon in the header, it opens a full screen window where to type the search and where the search results are shown.

Something like this: https://pauliandsisters.com/search

This is the website I'm working on: https://keyboard-jaguar-k52z.squarespace.com/

Password: tpt-2021

Thanks in advance for your help!

Edited by MaggieBovary
Link to comment
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

4 answers to this question

Recommended Posts

  • 0
Posted (edited)

Hi. This is complex. 

Follow these steps

1. Add a section under footer >> Add Search Block

2. Next, let me know. We will test some code

 

Edited by tuanphan

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
On 5/3/2021 at 3:01 AM, tuanphan said:

Hi. This is complex. 

Follow these steps

1. Add a section under footer >> Add Search Block

2. Next, let me know. We will test some code

 

Hi @tuanphan , I added the search icon to the header and I would only need that when clicking on it the search page opens on the same page instead of opening a new one (hope it makes sense? 😅).

Is there a way to achieve this somehow?

Thanks!

Link to comment
  • 0
On 5/11/2021 at 6:57 PM, MaggieBovary said:

Hi @tuanphan , I added the search icon to the header and I would only need that when clicking on it the search page opens on the same page instead of opening a new one (hope it makes sense? 😅).

Is there a way to achieve this somehow?

Thanks!

Try adding this to LAST LINE in Settings > Advanced > Code Injection > Footer

<script>
$(document).ready(function() {
	$('.header-actions-action [href*="search"]').attr('target','_self');
});
</script>

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
Posted (edited)

Hi @tuanphan, it works but I think there's a small bug. If I click on other areas of a page - e.g. a bit below the header - it brings me to the search page. It seems that the search link is a bit all over the page?

Edited by MaggieBovary
Link to comment

Create an account or sign in to comment

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


×
×
  • Create New...