Quick start

Tangent uploads as an unpublished theme. Your live store does not change until you click Publish in step 8.

Steps#

tangent / home

tangent / home

1. Upload the theme
2. — In Shopify admin, go to Online Store > Themes.
3. — In the theme library, click Add theme > Upload zip file.
4. — Select the Tangent ZIP file (for version 1.7.0, tangent-1.7.0.zip) and upload it.
5. — When the upload finishes, click Customize on Tangent to open the theme editor.

1. Choose a preset
2. — In the theme editor, open Theme settings and then Theme styles.
3. — Pick one of the five presets:
4. — Tangent (Editorial style): Archivo Narrow type, white background, gold badges, 4:5 product images.
5. — Selvedge (Gallery style): Playfair Display and Raleway, warm linen background, square corners, 2:3 product images.
6. — Muslin (Minimal style): Montserrat throughout, off-white background, outline buttons with rounded corners.
7. — Asphalt (Studio style): Oswald and Work Sans, dark background, full page width, square corners.
8. — Lumen (Maison style): Playfair Display and Assistant, blush background, rounded buttons, centered card text.
9. — Click Save.

1. Add your logo and favicon
2. — Go to Theme settings > Logo and favicon.
3. — Upload your Logo.
4. — If your home page starts with a full-width banner, upload a light version as Logo over images.
5. — Set Logo width (50 to 300px, default 120px).
6. — Upload a Favicon. It is displayed at 32 × 32px.

1. Set up navigation
2. — Click the Header section.
3. — Under Navigation, choose your Menu.
4. — Choose a Menu style: Mega menu, Mega menu with images, Dropdown or Showcase.
5. — To add an image or video to a mega menu, add a Menu promo block. In Menu item, type the top-level menu item title exactly, for example Women. Add an image or video, a heading, a caption and a link.
6. — To show products in a menu, add a Product cards block and set its Menu item the same way.

1. Build the home page
2. — Image or video banner: upload an Image (3000 × 1600px recommended) and an optional Mobile image (1100 × 1500px recommended). Set the focal point on each image in Shopify. You can place up to three product hotspots on the banner.
3. — Featured collection: choose a Collection, the Maximum products and the Layout. Card image ratio, swatches and quick add are global settings under Theme settings > Product cards.
4. — Image with text: an image beside your text, for brand or material stories.
5. — FAQ: add Question blocks for shipping, returns and sizing. Questions without an answer are hidden on your store.

1. Check your color schemes
2. — Go to Theme settings > Colors. Each preset has five color schemes.
3. — In each scheme, check that Text reads clearly on Background.
4. — Badge background and Badge text set the colors of sale, "New" and tag badges.
5. — Every section has a Color scheme setting. Use it to give a section a different scheme.

1. Set up the cart
2. — Go to Theme settings > Cart.
3. — Set Cart type to Drawer (slide-out cart) or Page (the /cart page).
4. — Under Free shipping progress, turn on Show free shipping progress and enter the Free shipping threshold in your store's default currency, for example 150. Use the same amount as in your shipping settings.
5. — Under Recommendations, choose a Collection shown in an empty cart and decide whether to Show product recommendations in the cart drawer. Recommendations come from Shopify, based on the first product in the cart.
6. — Optional: create a gift wrap product with a price and select it as Gift wrap product.

1. Preview and publish
2. — Preview desktop and mobile with the device switcher in the theme editor.
3. — Add a product to the cart and change variants to check that price and cart update.
4. — When you are ready, go to Online Store > Themes and click Publish on Tangent.