Help Page

Steps on how to add bottle and case price

  1. Edit a product
  2. Go to variants section.
  3. Click Add variant
  4. Option name will be "Option" or anything but much better to have a unique in case future reference.
  5. Option values will be "By the bottle", "By the case (6)" and "By the case (12)".
  6. Once added you see like this:
  7. Input the Price of each rows.
  8. Once done save.

    Take note:
    1. If bottle only no need to add a variants, It will pull as default for bottle just input the price on the price section only.
       
    2. For case need to add "By the case (6)" or "By the case (12)" in the variant section. just do above steps but don't include bottle.

Steps on how filter collection banner image

  1. Get a css layout from https://www.cssfilters.co/#
  2. Just upload image there or get a preset image and Edit the generator to produce a css.

  3. copy the text inside the box.
  4. Open Online Store > Themes > Edit Code > under Assets open custom.css.liquid
  5. Paste the content onto its designated class.
    (from cssFilters)
    .filter {
    position: relative;
    -webkit-filter: contrast(97%) brightness(98%) blur(1px);
    filter: contrast(97%) brightness(98%) blur(1px);
    }

    (custom.css.liquid)
    .collection-hero__image.ratio-container.js.lazyloaded {
    position: relative;
    -webkit-filter: contrast(97%) brightness(98%) blur(1px);
    filter: contrast(97%) brightness(98%) blur(1px);
    }

    AND
    (from cssFilters)
    .filter::before {
    content: "";
    display: block;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    position: absolute;
    pointer-events: none;
    opacity: 0.45;
    background: rgba(0, 0, 0, 0.5);
    }

    (custom.css.liquid)
    .collection-hero__image.ratio-container.js.lazyloaded::before {
    content: "";
    display: block;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    position: absolute;
    pointer-events: none;
    opacity: 0.45;
    background: rgba(0, 0, 0, 0.5);
    }

  6. Take note it is possible that the generator will give only (1) class. so copy only 1.
  7. If the class was already exist please edit only.