FAQs

Great question! We'd love to collaborate but we're fully focused on our internal/product roadmap these days.

But we'd be happy to connect you with a vetted dev/designer/team who can help customize our themes and/or build something more custom as needed. Check out the providers below, or get in touch with more specifics — we'd be happy to point you in the right direction!

HeyCarson

Get a stacked team of Shopify designers and developers. Speedy turnarounds. 1/2 typical agency costs. HeyCarson handles short-term projects, recurring needs, and full-time Shopify work.

• Premium theme setups
• Small and complex theme customizations
• Theme version updates
• Custom design
• Conversion optimization for Shopify merchants across all categories

Pay by the task or per hour. Project quotes start at USD $85/hour. Get in touch with HeyCarson →

Storetasker

A closed network of the most talented Shopify developers around. Get paired directly with a freelancer in hours and execute on projects big & small including Shopify theme customization. They've reviewed over 15,000 developers, designers, and marketers and hand selected the top 3%.

Per-project pricing, starting at USD $75/hour. Get in touch with Storetasker →

Align theme

As mentioned elsewhere, we do not officially support/provide any non-native customizations. But the basic idea of how you could customize the font, color, or something else used in product badges is to use some simple CSS customization:

1. Go to theme settings
2. Open the setting for Custom CSS
3. Add some custom css like the code below — update it for your specifics!
4. Save your edit.

p.c-card-product__badge {
  font-family: YourFamilyName;
}

Great question! This is a little more "advanced" but is straightforward enough. You'll basically just need to find and link to the section ID of each accordion.

How to find a section ID using devtools

Note: this is easier to do on a "live" page instead of in the theme editor/template, but both are possible.

1. While on the FAQs page/template open your browser's dev tools
• Devtools info for Chrome available here
• Devtools info for Firefox available here
2. With devtools open, hover and click into the section for which you are trying to find the ID in your browser window.
• The section will be highlighted in the code and the frontend as you click through various chunks of text in devtools.
• This may require a bit of clicking around and you may need to "expand" or "un-nest" parent containers in the theme editor
3. Once you find the section you're looking for, you will see that it starts with something like "<section id="shopify-section-template--15276797132844__accordion-01"
• Click into the id snippet of that code and copy this ID…
4. Find the button for the block you are trying to link and paste this in as your link URL.
• Note you must type a single hash ("#") into the "button link" setting before the section ID.
• The hash tells the frontend that this URL is actually on the same current page, so the browser won't try to navigate to another/external URL.
• So in the example above, I would have #shopify-section-template--15276797132844__accordion-01 as the URL in my button link.
5. Repeat for the other sections as needed.

We've recorded a little example of this process which is available below:

Want to make this?

Then add the callout class to your

Want to make this?

You can also put everything inside a div, ie

📚 Resources

Shopify has a great set of resources available to learn about updating themes. We encourage you to start here:

help.shopify.com/en/manual/online-store/themes/managing-themes/updating-themes

Align theme

To get a product's slideshow gallery to automatically switch to the correct variant image, you'll need to add/select an image for each variant within the Shopify admin. Here's how to do that:

1. In the Shopify admin, navigate to the product you want to edit.
2. Scroll down to the list of variants.
3. Click the small image thumbnail to the left of the variant title.
4. This will open a box to select from the available images that are associated with the product (i.e. any image that you've uploaded to the product's "main" media).
5. Select the image for that variant (or upload a new one). (Note that you can use the same image for multiple variants! i.e. If you have a t-shirt product with red, blue, and black variants, which are also available in small, medium, and large — you would add the red t-shirt image to all red variants (i.e. the red/small variant, the red/medium variant, and the red/large variant... Unless you actually have different images for these!)
6. Save your work.

Here's a quick screencapture of the process:

Align theme

The ReCharge app needs a quick manual update to work properly.

You should only do this after you've fully installed the ReCharge app and it has added all of their snippets to your theme files. To confirm this, you should see these files in your theme's "Snippets" directory:

• subscription-account-login.liquid
• subscription-cart-footer.liquid
• subscription-product.liquid
• subscription-theme-footer.liquid

In your Shopify admin, navigate to the Edit code, then find and click into the component-form-product.liquid file within the Snippets directory.

Find the line which includes the code below — this should normally be found around line 19:

{%- form 'product', product, data-productid: product.id, id: product_form_id, class: product_form_id, novalidate: 'novalidate', data-type: 'add-to-cart-form' -%}

Paste the code below under that line — save your update and check to ensure ReCharge is working as expected!

{% if product.available and request.page_type == 'product' %}{% render 'subscription-product' with product as product %}{% endif %}

Align theme

Open Theme settings>Cards

Uncheck "Show quick add button”

Note: A ‘View product’ button will replace the “Add to cart” button if unchecked.

Updating your theme

We will consistently strive to provide the best possible experience for our customers, and will regularly release theme updates to offer new features, design enhancements, and bug fixes. We'll keep everything up to date with the newest Shopify features and requirements, and will continue to develop new features while keeping your underlying codebase modern, lean, flexible, and well-documented.

Manual theme updates in your Shopify store admin

To ensure your Align theme is up to date, you can easily check its status in your Shopify Admin. Simply click on the version number under the Align theme, and if you see a green check mark icon with the message "This theme is up to date," you're all set!

If an update is available for Align, a notification will replace the version number in your Shopify Admin.

Click on the notification to open the details pop-up, where you can choose to add the updated version to your theme library or view the release notes to learn about the new enhancements.

Any customizations you've made to your theme using the Theme Editor will be preserved. This includes changes to theme settings, page layouts, sections and blocks, app integrations, translations, and more.

Larger themes may take a few minutes to complete the update process. Once the update is finished, you'll find the updated Align theme in your library. It will be indicated by a "Just added" badge and the title will be prefixed with "Updated copy of".

Take your time to review the changes and ensure that your online store looks and functions as expected before publishing the updated version of Align.

Adding an update to your theme library

To add an updated version of the Align theme to your online store library, follow these steps:

1. From your Shopify admin, navigate to Settings > Apps and sales channels.
2. Click on Online store.
3. Open the sales channel.
4. Select Themes.
5. Locate the Align theme you want to update and click on the version notification.
6. Click on Add to theme library. This will create a copy of your original Align theme (named [theme name]), download the updated version, and automatically apply your customizations made through the theme editor.
7. Once the updated Align theme is added to your library, click on Review theme to ensure everything looks and functions as expected. If you have added custom CSS, please double-check that the selectors you targeted still exist in the latest version and that your CSS is applied correctly.
8. When you are ready to make the new version of Align live, simply click on Publish!

Automated updates

As part of our commitment to delivering a seamless experience, Company XYZ provides automated updates for the Align theme. These updates are designed to fix bugs and address security issues without altering the appearance, content, or settings of your theme. You can always check the release notes to stay informed about the improvements included in these updates.

Updates not supported

Please note that only themes installed through the Shopify Theme Store are eligible for updates. If you have purchased a paid theme from a third-party designer, we recommend reaching out to them directly for updates and support.

Additionally, it's important to know that only Online Store 2.0 themes support updates. If you are using an older version of a Shopify theme, it has been sunsetted and is not supported by Company XYZ. We encourage you to consider upgrading to an Online Store 2.0 theme or seek the assistance of a theme expert to take full advantage of the latest Shopify features.

Other recommendations

Practice good renaming habits

It's important to be mindful about naming or renaming your themes — these can quickly get confusing if you let them!

We recommend using a standard naming convention and sticking to it. We like to rename the new updated theme first to something like "Align v1.2 (updated)"; then we'll rename the current (old) version to something like "Align v1.1 (pre-update)". This way it's crystal clear which version you were using before the update and which version you need to test.

Align theme