How to make custom background on specific pages

Store Design
, ,
1

I recently tried to apply some custom code to my ‘Dawn’ theme which adds a custom image as the background to my base.css . However, on my landing page, the image I choose shows up in the background of buttons and containers which ruins the design of my website. A good example of what I am trying to do is on this website → ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■. I do not want the same image/video in this webpage, I have one of my own.

My website URL is → https://aurora-apparel-1.myshopify.com/

Any help would be great thanks.

2

Hi @MITTON1

This is Victor from PageFly - Shopify Page Builder App

To make changes on specific pages you will need to have a condition for your styling code.

Please add this code to your theme.liquid above the and paste your style code between it

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: Find and click on theme.liquid and paste the code above the 

{%comment%} 
use this in case you want the style only apply for homepage only
and paste your style code between the style tag / all the style will only apply for home page 
{% endcomment %}
{% if template.name =='index' %}

{% endif %}

{%comment%} 
use this in case you want the style only apply for the shop-now page only
and paste your style code between the style tag / all the style will only apply for the shop-now page 
{% endcomment %}

{% if handle contains 'shop-now'%}

{% endif %}

Please read my comment, it will help you to select the right code for condition
Hope this can help you solve the issue

Best regards,

Victor | PageFly

3

Hey sorry nothing changed on my page, what is the actual code I have to put in the CSS and theme.liquid files in between what you gave me. THANKS

4

Hi @MITTON1 Can you take screenshot for me what did you put there for me to take a look
Or you can copy and paste it here