Code Library

CUSTOM IMAGE BACKGROUND

<!-- Paste in theme.liquid before </body> -->

<style>

body {

  background-image: url("https://cdn.shopify.com/s/files/1/0505/2085/0585/files/BG-DESKTOP.jpg?v=1779740964") !important;

  background-repeat: no-repeat !important;

  background-position: center center !important;

  background-size: 100% auto !important;

  background-attachment: fixed !important;

}

/* Mobile fixed background */

@media only screen and (max-width: 767px) {

  body {

    background: none !important;

    position: relative;

  }

  body::before {

    content: "";

    position: fixed;

    inset: 0;

    z-index: -1;

    background-image: url("https://cdn.shopify.com/s/files/1/0505/2085/0585/files/BG-MOBILE.jpg?v=1779740966") !important;

    background-repeat: repeat !important;

    background-position: top center !important;

    background-size: 100% auto !important;

    pointer-events: none;

  }

}

</style>

CUSTOM VIDEO BACKGROUND

<!-- Paste in theme.liquid before </body> -->

<div class="custom-video-bg">

  <!-- Desktop Video -->
  <video
    class="desktop-video"
    autoplay
    muted
    loop
    playsinline
    preload="auto">
    <source src="https://cdn.shopify.com/videos/c/o/v/13144a41e5c645a4802b2ce1ef715efc.mp4" type="video/mp4">
  </video>

  <!-- Mobile Video -->
  <video
    class="mobile-video"
    autoplay
    muted
    loop
    playsinline
    preload="auto">
    <source src="https://cdn.shopify.com/videos/c/o/v/13144a41e5c645a4802b2ce1ef715efc.mp4" type="video/mp4">
  </video>

</div>

  </body>
</html>

BANDSINTOWN EMBED

<script charset="utf-8" src="https://widgetv3.bandsintown.com/main.min.js"></script>
  <a class="bit-widget-initializer"
    
data-artist-name="OXYMORRONS"
data-background-color="transparent"
data-separator-color="#ffffff"
data-text-color="#ffffff"
data-font="Helvetica"
data-auto-style="false"
data-button-label-capitalization="capitalize"
data-header-capitalization="undefined"
data-location-capitalization="capitalize"
data-venue-capitalization="capitalize"
data-display-local-dates="false"
data-local-dates-position="hidden"
data-display-past-dates="false"
data-display-details=""
data-display-lineup="false"
data-display-start-time="false"
data-social-share-icon="true"
data-display-limit="30"
data-date-format="MMM. D, YYYY"
data-date-orientation="horizontal"
data-date-border-color="#ffffff"
data-date-border-width="1px"
data-date-capitalization="undefined"
data-date-border-radius="10px"
data-event-ticket-cta-size="small"
data-event-custom-ticket-text="undefined"
data-event-ticket-text="TICKETS"
data-event-ticket-icon=""
data-event-ticket-cta-text-color="#FFFFFF"
data-event-ticket-cta-bg-color="#F09A99"
data-event-ticket-cta-border-color="#F09A99"
data-event-ticket-cta-border-width="0px"
data-event-ticket-cta-border-radius="0px"
data-sold-out-button-text-color="#FFFFFF"
data-sold-out-button-background-color="#4A4A4A"
data-sold-out-button-border-color="#4A4A4A"
data-sold-out-button-clickable="true"
data-event-rsvp-position="hidden"
data-event-rsvp-cta-size="small"
data-event-rsvp-only-show-icon="undefined"
data-event-rsvp-text="REMIND ME"
data-event-rsvp-icon=""
data-event-rsvp-cta-text-color="#4A4A4A"
data-event-rsvp-cta-bg-color="#FFFFFF"
data-event-rsvp-cta-border-color="#4A4A4A"
data-event-rsvp-cta-border-width="1px"
data-event-rsvp-cta-border-radius="4px"
data-follow-section-position="hidden"
data-follow-section-alignment="center"
data-follow-section-header-text="Get updates on new shows, new music, and more."
data-follow-section-cta-size="medium"
data-follow-section-cta-text="FOLLOW"
data-follow-section-cta-icon="true"
data-follow-section-cta-text-color="#FFFFFF"
data-follow-section-cta-bg-color="#F09A99"
data-follow-section-cta-border-color="#4A4A4A"
data-follow-section-cta-border-width="0px"
data-follow-section-cta-border-radius="4px"
data-play-my-city-position=“hidden”
data-play-my-city-alignment="Center"
data-play-my-city-header-text="Don’t see a show near you?"
data-play-my-city-cta-size="medium"
data-play-my-city-cta-text="REQUEST A SHOW"
data-play-my-city-cta-icon="true"
data-play-my-city-cta-text-color="#FFFFFF"
data-play-my-city-cta-bg-color="#4A4A4A"
data-play-my-city-cta-border-color="#4A4A4A"
data-play-my-city-cta-border-width="0px"
data-play-my-city-cta-border-radius="4px"
data-optin-font=""
data-optin-text-color=""
data-optin-bg-color=""
data-optin-cta-text-color=""
data-optin-cta-bg-color=""
data-optin-cta-border-width=""
data-optin-cta-border-radius=""
data-optin-cta-border-color=""
data-language="en"
data-layout-breakpoint="900"
data-app-id=""
data-affil-code=""
data-bit-logo-position=“hidden"
data-bit-logo-color="#CCCCCC"
    ></a>

FONT SIZE IN A SECTION

* {
  font-size: 10px !important; /* Adjust the size as needed */
}

CUSTOM BACKGROUND FOR A SECTION

{
  background: url("https://cdn.shopify.com/s/files/1/0709/6641/1506/files/DESKTOP-BG_7aa4426d-91b5-4876-ac24-a31437632691.jpg?v=1751991367")
    no-repeat center;
  background-size: cover;
  background-attachment: fixed !important;
}
@media screen and (max-width: 479px) {
   {
    background: url("https://cdn.shopify.com/s/files/1/0709/6641/1506/files/MOBILE-BG.jpg?v=1751991367")
      no-repeat center;
    background-size: contain;
    background-repeat: repeat;
    background-attachment: fixed !important;
  }
}

YOUTUBE VIDEO EMBED

<style>
  .video-container {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    height: 0;
    overflow: hidden;
    max-width: 100%;
  }

  .video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
</style>

<div class="video-container">
  <iframe 
    src="https://www.youtube.com/embed/LO0vKgl3CBA?si=Z5ZUhEWmcXv-ucEj" 
    title="YouTube video player" 
    frameborder="0" 
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" 
    referrerpolicy="strict-origin-when-cross-origin" 
    allowfullscreen>
  </iframe>
</div>

TRANSPARENT PRODUCT IMAGE BACKGROUND

.product-media-container {
background-color: transparent !important;
}

CUSTOM CURSOR

<---Place in base.css--->

html, body {
    cursor: url("https://cdn.shopify.com/s/files/1/0698/8215/1090/files/cursor.cur?v=1742840220"), auto;
}

MENU OPACITY

.header__menu-item {

  color: rgba(var(--color-foreground), 1) !important;

}

CODE LIBRARY

CUSTOM IMAGE BACKGROUND

CUSTOM VIDEO BACKGROUND

BANDSINTOWN EMBED

FONT SIZE IN A SECTION

CUSTOM BACKGROUND FOR A SECTION

YOUTUBE VIDEO EMBED

TRANSPARENT PRODUCT IMAGE BACKGROUND

CUSTOM CURSOR

MENU OPACITY

CUSTOM FONTS

make a new section called ezfy-custom-fonts.liquid