To do this, knowledge of LIQUID code, Shopify CLI and Shopify CMS is required.
First step is to update one of the themes that are recent which has the message "District version X.X.X available"
click in the chevron icon and click the button "Add theme to library"
This will clone the theme with updates. It won't copy customizations.
Download the theme using Shopify CLI to your computer, and upload it again to one of the "Staging/Development" themes, because these are connected to GIT.
With this we will set our development environment ready to work.
Try to keep the Theme names (BACKUP MM/DD/YYYY V-X.X.X) when you click the update button.
When you copy/paste the code to the Development/Staging, don't change the name to that theme.
DO NOT DELETE the themes that has the message saying "District version X.X.X available" they're necessary for future updates. Not all the themes can be updated, uploaded themes cannot be updated, like the Development or Staging
After we set out environment, copy these files from the live theme:
========================
custom.js
custom.css
loyalty-steps.css
loyalty-form.css
accordion.css
image-banner-logo.css
jquery1.9.1.js
flickity.min.css
flickity.pkgd.min.js
lp-variations-order.js (for reordering the T-Shirt Sizes)
========================
slideshow-featured-blog.liquid
instagram-gallery.liquid
featured-collections-slider.liquid
featured-collection-home.liquid
blog-search-template.liquid
image-banner-logo.liquid
loyalty-form.liquid
loyalty-steps.liquid
accordion.liquid
========================
image-grid-item.liquid
top-left-nav.liquid
theme-gtm.liquid
theme-gtm-no-script.liquid
theme-hotjar.liquid
icon-ui-account.liquid
header-logo.liquid
icon-ui-account.liquid
icon-ui-hamburguer.liquid
icon-ui-x.liquid
free-shipping-label.liquid
Then compare these files Live vs Development, you can use VS Code option to compare.
========================
index.json
product.json
collection.json
search.json
product.json
article.json
blog.json
page-loyalty.json
========================
header-group.json
footer.liquid
breadcrumbs.liquid
logo-list.liquid
main-blog.liquid
main-article.liquid
main-login.liquid
main-account.liquid
main-cart-items.liquid
main-cart-footer.liquid
========================
search-bar.liquid
email-subscription.liquid
navigation-menu.liquid
(List might be not complete or vary after every update, some files that didn't change before can change, you have to look for the remaining broken elements, or adjust the theme)
In a general view, these are the pages that are updated:
- Home
- Cart
- Page Loyalty
- Collections
- Products
- Blog (Currently hidden)
- Article
- Search Results
- All pages under the footer
- Contact Page
After all these steps are completed, the theme should be fully updated, next steps would be testing.
Note: Checkout pages doesn't belong to Shopify themes. They are updating in a different way (different task)