How can I include a GIF on my password page?

Store Design
1

I made and saved a GIF to my assets and was wondering what the code “format” is so I can successfully add the GIF to show on my password page. Obviously I am not a “coder”, but I could not find the answer to this anywhere. Thank you for reading and hopefully I can get an answer!

1 Like
2

Hello, @nlight

Welcome to the Shopify community!
and Thanks for your Good question.

  1. Go to Online Store->Theme->Edit code
  2. Asset->/upload your GIF File-> after below code your password page whenever do you have liked.

can you please just change file name your gif to uploaded gif fine name

1 Like
3

@KetanKumar

That worked perfectly! I do have one more question, what would the code be to center the gif on the page? Thank you again for your help!

1 Like
4

Hello, @nlight

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

5

@KetanKumar

https://shopforeverybody.com

1 Like
6

@nlight

Thanks

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.password-main__inner {text-align: center;}

also, please remove gif blank spacing

KetanKumar_0-1602562698568.png
KetanKumar_0-1602562698568.png1920×1080 273 KB

2 Likes
7

@KetanKumar

I am following this method but I cannot seem to center my GIF logo on the password page. Any help would be greatly appreciated.

https://nostalgia.ltd/password

Also, is there a way to make the GIF larger? Or would I just have to upload a bigger GIF image in the asset folder.

Thanks so much in advance!

1 Like
8

@nostalgiaLTD

Thanks for post

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.css->paste below code at the bottom of the file.
.password-page img {
    margin: 0px auto;
    display: inherit;
}
1 Like
9

@KetanKumar

Thanks so much!

1 Like
10

@nostalgiaLTD

Thanks for update and support.

11

@KetanKumar

Hi Ketan, Its me again LOL…

I am trying to add the centered GIF to my Contact page. The GIF is already on the page, just not sure how to center. Any help is much appreciated.

https://nostalgia.ltd/pages/contact

Best, Evan.

12

@nostalgiaLTD

Thanks

sorry your store is password producted.

13

@KetanKumar Just turned off the password! Best, Evan :slightly_smiling_face:

1 Like
14

Hi Evan,

To center the element use “text-align” attribute.

Tony_Bui_0-1605322537753.png
Tony_Bui_0-1605322537753.png2878×1464 332 KB

As the alternative solution and if you want to add more content with sophisticated page layout, so consider to use Shopify page builders https://apps.shopify.com/browse/store-design-page-builders

Might be useful, video from Shopify about Contact us page customization.

Cheers,

Tony

1 Like
15

@nostalgiaLTD

Thanks for it

can you please add me to the staff account so I will fix this issue bcz if I have provide any code so the effect on another page i hope do you understand

16

@nostalgiaLTD seems I forgot to mention, please let me know if my solution above work for you or not.

Thanks,

17

Hello Ketan Kumar,

This worked for me but i would like all the text and everything to be in front of the GIF. i.e. the gif should be the background of the page. Is that possible?

www.infuseatea.com

Thank you!

18

Hello Ketan Kumar,

This worked for me but i would like all the text and everything to be in front of the GIF. i.e. the gif should be the background of the page. Is that possible?

www.infuseatea.com

Thank you!

19

@salmajed

Thanks

yes but your gif too much bigger

20

@KetanKumar

Yes I want it to be the background.

Sara.