Is it possible to reduce the background image size on my Landing Page?

Site URL: https://www.scholarsayze.com/

Hello, I have set a password access only landing page to my site here: https://www.scholarsayze.com/

I want to give exclusive access to my webstore only to a number of customer to offer an exclusive early discount before main website launch.

I want to know:

1. is it possible to reduce the size of the background spinning logo so it is smaller?
2. is it possible to add an image block above my logo 'SCHOLAR & SAYZE'?

Pword access: scholar1

Please help!

Many thanks,

Best,

Faiz

Hi,

Add to Lock Screen

<style>
  .sqs-slice-gallery-item img {
    object-fit: contain !important;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
  $(document).ready(function() { 
		$('<img src="https://cdn.pixabay.com/photo/2021/06/29/06/14/water-drops-6373296__340.jpg" with="150px"/>').insertBefore('.sqs-slice-group .sqs-slice-image');
	});
</script>

Hi Tuanphan thanks so much for the code,

Sorry, I'm not sure exactly where on the lock screen to add the code? All I see is the attached options?

Please advise.

Thanks

Settings > Advanced > Code Injection > Scroll down to Lock Screen or Lock Page box

Thanks Tuanphan!

I added the code, I see the image which I guess I can replace:

1. how can I generate my new image source url? I'm not sure where to upload my actual image
2. I notice my background spinning logo is pretty big, https://www.scholarsayze.com/ can this not be made smaller?

Thank you for your help here,

Best,

Faiz

On 7/14/2021 at 3:22 PM, scholarsayze said:

Thanks Tuanphan!

I added the code, I see the image which I guess I can replace:

1. how can I generate my new image source url? I'm not sure where to upload my actual image
2. I notice my background spinning logo is pretty big, https://www.scholarsayze.com/ can this not be made smaller?

Thank you for your help here,

Best,

Faiz

 

1. See how to upload image. https://support.squarespace.com/hc/en-us/articles/205813928-Uploading-and-managing-files

2. It looks like you solved with this?

<style>
  .sqs-slice-gallery-item img {
    object-fit: contain !important;
}
</style>

1 - thanks for the guide instructions

2 - this is the code you gave me but if you check the landing page here: https://www.scholarsayze.com/, the background spinning logo is still very big. I'd like this scaled down smaller if possible not so it is full screen. This same size here would be great: https://bluebird-porcupine-yzdg.squarespace.com/welcome-1

Thank you! 

19 hours ago, scholarsayze said:

1 - thanks for the guide instructions

2 - this is the code you gave me but if you check the landing page here: https://www.scholarsayze.com/, the background spinning logo is still very big. I'd like this scaled down smaller if possible not so it is full screen. This same size here would be great: https://bluebird-porcupine-yzdg.squarespace.com/welcome-1

 

Thank you! 

try replace contain with 100px

Thanks Tuanphan, I tried this but it didn't change it.

No problem I will replace this gif with the actual video file via Vimeo.

Thank you!