32 search results for “Tiffany Tse”

Building Icon Systems With SVG

Building Icon Systems With SVG

SVG Icons: Email

Building a great system and workflow is one of the hardest things to do. For a long time, building icon systems for themes and websites meant using iconic fonts. But as browser support has improved, inline SVGs are the new hot thing.

In this tutorial, you'll learn:

  • How to prepare SVGs
  • How to build your icon set
  • Where to find SVG resources

Continue reading

Building Nested Navigations with Shopify Link List

Building Nested Navigations with Shopify Link List

shopify link list

Nested navigations are a popular solution for effectively organizing collections, products, and pages. A link list is a simple collection of links, and these items can be created to point to collection, page, or product within Shopify, or to a URL outside of the store’s domain. In this tutorial, we will cover how to use link lists in a Shopify theme to create a nested navigation using an unordered list.

In this article you will learn:

  • How to create a menu and nested menu in the Shopify Admin.
  • How to output a menu using Liquid and linklist.
  • How to output a nested navigation with up to three levels deep.
  • Using link.active and link.active_child to help style and identify active menu links.

Continue reading

Canonical URLs: What Are They and Why Are They Important?

Canonical URLs: What Are They and Why Are They Important?

canonical urls

SEO is important for every website, and an online store is no exception. Using canonical URLs can help to better inform search engines which URLs have identical or highly similar content.

In this article you will learn:

  • What a canonical URL is.
  • Why canonical URLs matter.
  • How the `canonical_url` object works.
  • Best practices, and things to keep in mind when using canonical URLs.

Continue reading

Creating Dynamic Color Schemes with Theme Options and Presets

Creating Dynamic Color Schemes with Theme Options and Presets

Color schemes with theme options and presets

Building for the unknown can be tricky, and clients or merchants always want some level of control when it comes to their websites. So how do we make our themes dynamic for clients?

In this article you will learn:

  • How to define theme options for colors in `settings_schema.json`.
  • How to use the `settings` object properties inside your CSS or SCSS files.
  • How you can create custom presets for a theme with `settings_data.json`.

Continue reading

Introduction to Shopify Theming for WordPress Theme Developers

Introduction to Shopify Theming for WordPress Theme Developers

Shopify for Wordpress theme developers

WordPress currently holds close to 60 percent market-share of the global CMS market, so it’s not surprising that most developers have worked on at least one WordPress project in the past. There are a lot of similarities in theming between WordPress and Shopify — let us help you speed up your development workflow by showing you what those parallels and differences are.

In this article you will learn:

  • The main differences between Shopify and WordPress, and their basic content elements.
  • How to extend the functionality of the Shopify platform.
  • The similarities and differences in theme structure, templates, and asset management between Shopify and WordPress.

Continue reading

jQuery Image Zoom for Shopify in 5 Easy Steps

jQuery Image Zoom for Shopify in 5 Easy Steps

jQuery image zoom

When selling online, one of the most requested product features is image zooming. Zooming is often used on a product image to enlarge it for better viewing by potential customers. In this tutorial, we’ll go over the steps to implementing the jQuery Zoom plugin within a Shopify theme.

In this tutorial you'll learn:

  • When and how to check if jQuery already exists in a theme.
  • How to edit the featured image markup in product.liquid to link the jQuery Zoom plugin.
  • How to link and initialize the plugin and start zoomin’.
  • Alternative product image zoom plugins and apps.

Continue reading

Teaching Code: A Getting Started Guide

Teaching Code: A Getting Started Guide

teaching coding

Teaching code is more popular than ever, with hundreds of tutorials and resources on Coursera, Codecademy, Treehouse, edX, Udemy, Lynda, and even this blog! Education is important, and for large organizations, agencies, and freelancers, understanding how to teach is an invaluable skill. To keep up with technology we have to always be learning, and understanding some teaching techniques will help you level up your own team internally.

In this article, you will learn:

  • Why learning to teach effectively is important for your agency, business, and as an individual.
  • Techniques and tips on effective teaching.
  • How community and autodidactism aid in learning, beyond the classroom.

Continue reading

Grow your business with the Shopify Partner Program

Learn more