How can I add a GIF background to my homepage only?

[AuthorAngel]

Hi

I'd like to add a GIF as the background to my homepage only. All the information I have seen will update the background everywhere, and I only want it to change on the homepage if possible? Could anyone offer advice on how I can do this please? It needs to be twinkling or falling golden stars GIF which I have added to the content files. But I don't know the code or where for just the homepage change. 

 Website is - https://lesley-jones-writes.myshopify.com/

Password - help

Thank you for any advice anyone can offer. 

[theycallmemakka]

The password is not working

[AuthorAngel]

apologies it should work now

[theycallmemakka · Accepted solution]

Hi @AuthorAngel 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

{% if template contains 'index' %}
<style>
body {
    background-image: url("https://media1.giphy.com/media/2zV56u0WuJZsc/giphy.gif?cid=ecf05e47x0eho3axr48uxi87dv4oqlfjt7lywdcq9jlhba91&ep=v1_gifs_search&rid=giphy.gif&ct=g")!important;
}

div {
    background-color: transparent;
}

sticky-header.gradient,
div.gradient,
footer.gradient{
    background: transparent!important;
}

#shopify-section-template--20389147902243__5ceccf03-feff-4b73-b23f-f02c21243453 {
    background: transparent!important;
}

#shopify-section-template--20389147902243__5ceccf03-feff-4b73-b23f-f02c21243453 div {
    background-color: transparent!important;
}

.field__input {
    background: rgba(0,0,0,0.5);
}

</style>
   {% endif %}

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
Makka

[AuthorAngel]

That is absolutely perfect. Thank you very very much. 

[saisixwell]

how would i do this same thing but only the password page?

sixwellclothing.com