SS&T | Всё о Shopify: Новости, Секции, Фишки
80 subscribers
39 photos
1 video
2 files
92 links
В этом канале вы найдете:

1. Новости и обновления в эко-системе Shopify;
2. Полезные рекомендации по ведению магазина;
3. Магазин готовых Shopify секций и сниппетов.

SS&T – команда Shopify экспертов.

Сайт - www.usessnt.com
Download Telegram
Какую Тему Выбрать Для Дропшиппинг Магазина?

Если вы задумались об открытие Дропшиппинг магазина на Shopify, выбор правильной темы играет важнейшую роль.

Shopify тема - это дизайн и группа настроек, которые определяют внешний вид и функциональность вашего магазина.

Если вы неуверены в своём продукте, например, только запускаете свой магазин, то лучше выбрать бесплатную тему. Бесплатные темы позволят вам создать магазин, который будет продавать ваши товары, а это главное. Также на создание магазина вы потратите меньше денег, что важно при запуске нового бизнеса.

Когда магазин начнёт расти, можно задуматься об обновление дизайна и внедрение нового функционала в магазин. Это позволит улучшить пользовательский опыт и увеличить конверсию.

❗️Не забывайте о постоянном обновление магазина.

@usessnt | Наш сайт
🔥3
Как динамически отобразить текущий год при помощи Liquid?

🤓 Зачастую нужно отобразить текущую дату, например, год. Для этого можно воспользоваться возможностями Ликвида, языка шаблонов который использует Shopify.

Это может быть полезно, например, в подвале сайта. Там, где мы пишем о копирайте.

В обычной HTML вёрстке мы используем статическое значение по типу: “© 2024 Company Name”.

В таком случае, 1 января следующего года значение “2024” не обновится. Чтобы этого избежать и не запутать пользователей сайта мы будем использовать следующую конструкцию, вместо статического отображения текущего года:


{{ "now" | date: '%Y' }}


🥳 Теперь нам не придётся каждый год заходить в код сайта и вручную обновлять год.

——

❗️Если ваш сайт не использует Liquid, вы можете воспользоваться следующим методом по отображению текущей даты.


<span id="currentYear"></span>



function displayCurrentYear() {
const currentYear = new Date().getFullYear();
document.getElementById("currentYear").textContent = currentYear;
}

document.addEventListener("DOMContentLoaded", displayCurrentYear);


👆 В данном методе мы используем язык программирования JavaScript для отображения текущего года. Выглядит немного массивнее, чем способ на Liquid, но JS есть JS.

@usessnt | Наш сайт
👨‍💻2
🥳 Бандлы теперь доступны в черновых заказах

Продавцы теперь могут добавлять бандлы товаров в черновые заказы. Независимо от того, используют ли они приложение Shopify Bundles или создают свои собственные предложения бандлов с помощью Shopify API, продавцы могут использовать эту функцию для увеличения продаж и улучшения качества обслуживания клиентов.

❗️Кроме того, функция CartTransform автоматически запускается для всех черновых заказов.

Перейдите к черновикам заказов в администраторе Shopify и выберите бандл продуктов в окне выбора продуктов.

Чтобы узнать больше о пакетах в черновых заказах, обратитесь в Справочный центр Shopify.

@usessnt | Наш сайт
🔥3
ssnt.gif
36 MB
🆕 Прощай старый сайт, привет разработка нового

Наш старый сайт нас не устраивал и мы решили разрабатывать новый.

🙂 Так получилось, что наш старый сайт сейчас недоступен, поэтому мы какое-то время будем без сайта :)

Пока идёт разработка сайта, мы будем писать новые секции и готовить статьи для вас!

👨‍💻 На новый сайт много планов, нужно как минимум сделать мультиязычность, а то как-то не очень, что тут мы пишем на русском, а сайт на английском.

@usessnt | Наш сайт
🔥3
Shopify Edition Summer '24

Огромное обновление Shopify платформы добавило больше 150 нововведений. Все из них мы упомянуть не сможем, но некоторые из них особо интересные для нас.

1️⃣ Единый Shopify CLI
Одна установка Shopify CLI позволяет легко создавать приложения, темы и витрины магазинов Hydrogen.

npm install -g @shopify/cli@latest

2️⃣ Управление стоимостью приложений теперь легче
Теперь вы можете легко настраивать, обновлять и управлять ценами и выставлением счетов на приложения с панели управления партнера без необходимости писать код.

3️⃣ Проверка приложений стала быстрее
Новые приложения теперь проходят проверку на 30% быстрее благодаря более четким предварительным условиям для утверждения, персонализированным рекомендациям и прозрачным обновлениям хода выполнения.

4️⃣ Checkout Blocks теперь имеет бесплатный тариф
Checkout Blocks — это бесплатный и простой способ персонализировать оформление заказа с помощью расширений страницы чекаут. Изменять код не нужно. Эксклюзивно для Плюс.

5️⃣ Тема Trade уже доступна в магазине
Настройте B2B-магазин с готовой темой Trade, предназначенной для повторных и оптовых закупок. Тема бесплатная.

6️⃣ Новая аналитика
Shopify перестроили набор аналитических технологий, чтобы сделать его быстрее, гибче и интуитивно понятнее. Вы получите более глубокое представление о работе вашего магазина в режиме реального времени. И вскоре используйте ShopifyQL для запроса ваших данных прямо в отчете.

7️⃣ Визуальный конструктор Hydrogen сайтов
Визуальный редактор Hydrogen на базе Utopia позволяет всей вашей команде проектировать, продавать и создавать товары с помощью общего представления магазина. Код остаётся базой витрины, но изменения в конструкторе синхронизируются с GitHub.

8️⃣ Массовый импорт и экспорт метаполей
Импорт и экспорт продуктов теперь поддерживают метаполя продуктов, что упрощает массовое управление метаполями продуктов.

Это были основные обновления по нашему мнению, полный список обновлений вы можете почитать по ссылке.

@usessnt | Наш сайт
🔥3
Shopify исполнилось 20 лет

По информацие на официальной странице, Shopify был основан в 2006 году, а это значит, что ему 18 лет. Ну ладно, будем праздновать 20 летие!

Последние годы Shopify сильно вырос и стал лидером электронной коммерции. Им удобно пользоваться, если вы хотите открыть магазин, а также комфортно разрабатывать продукты, если вы фронтенд или бэкенд разработчик.

Фото: Корали Дельфа

@usessnt | Наш сайт
🔥3
Новые настройки стиля для тем

Ох-ох, ну мы и пропали. Вы, наверное, уже заждались новостей в Shopify. Исправляемся.

Shopify вводит новую категорию настроек под названием «Настройки стиля». Настройки стиля напрямую связаны со свойствами CSS и позволяют продавцам изменять значения для разной ширины устройств.

Это означает, что теперь продавцы могут легко настроить внешний вид своего сайта для мобильных устройств, не прибегая к отдельным настройкам для каждой ключевой точки.

Shopify предложит широкий набор настроек стиля с помощью панелей Style, начиная с Layout, Size и Spacing, а в скором времени появятся и другие. Используя панели стилей, предоставляемые Shopify, разработчики тем получают полный набор настроек, которые могут быть использованы продавцами.

Разработчикам не придется самостоятельно вручную настраивать каждый отдельный параметр, что позволит продавцам более гибко подходить к стилю и лучше выражать свой бренд.

@usessnt | Наш сайт
🔥1
Shopify ребята, выходим из тени!
Летние Обновления Shopify 2024

На этой неделе мы вместе с коллегами по цеху (Владмиром - владельцем агентства Ecommerce-Works и Майком - крутым Shopify разработчиком) будем обсуждать обновления плафтормы Shopify для мерчантов, разработчиков и других агентств.

В этот раз Shopify снова порадовал большим количеством новых обновлений и фичей. Мы не можем их не разобрать и пройти мимо! Поэтому если вы работаете с Shopify или интересуетсь рынком eCom платформ, добро пожаловать на наш стрим где мы разберем самые интересные новые фичи.


🔔 Стрим будет доступен в этом канале в Четверг 25 Июля 17:00 GMT+3 🔔 Ссылка
🔥2
❗️Уже совсем скоро пройдёт прямая трансляция по обновлению Shopify Editions 2024: Summer Edition, где @oxdaniil, @vpesh, и @themoek расскажут, что изменилось в Shopify.

Это отличная возможность узнать, что нового было добавлено, задать интересующие вас вопросы, и просто полезно провести время. Возможно, вы не можете решить какую-то задачу, поэтому заходите, вам постараются помочь.

🔗 Ссылка на прямую трансляцию
🤓1
Всем привет!
Спасибо всем кто вчера пришел на трансляцию про Shopify Editions.
Было интересно, была отличная адуитория и вопросы. Давно не видел столько Shopify разработчиков в одном месте)
Не обошлось без факапов и часть трансляции не записалась 🤦‍♂️, поэтому выложу укороченную версию в YouTube канале (урезана в основном моя часть про фичи, связанные с маркетингом и b2b. Если есть какой то вопрос, то приходите в личку, расскажу)

Контакты спикеров:
Владимир @vpesh агентство Ecommerce Works
Майк @themoek Shopify разработчик и блогер

Ссылка на Shopify Editions 2024

Хороших выходных🍻
👨‍💻3
"There was an error updating your shopping cart. Please try again."

👨‍💻При разработке кастомной Shopify темы могут возникать разные ошибки, в этом посте мы расскажем об одной из возможных ошибок, с которой вы можете столкнуться. Давайте разберёмся как её обнаружить и решить.

1️⃣ Расширения браузера.
Расширения могут иначе загружать страницу и влиять на скрипты в браузере, что может повлечь за собой некорректную работу сайта. Внимательно проверяйте какими расширениями вы пользуетесь.

2️⃣ Кэш браузера.
Страница или сайт в целом постоянно меняются в ходе разработки, что может привести к заполнению кэша браузера. Кэш полезен, но периодически очищайте его, особенно при разработке.

🔗 Подробнее про кэш.

3️⃣ Консоль.
В консоли может выводится разная информация, которая может помочь в решение проблемы. Если консоль пустая (там нет ошибок), то идём дальше.

4️⃣ Вкладка "Network".
В данной вкладки можно отследить загрузку файлов сайта и отследить как получаются или отправляются запросы на сервер. Возможно, какой-то из запросов не работает.

5️⃣ Проверьте код темы.
Если вы знакомы с веб-разработкой и архитектурой Shopify тем, проверьте скрипты или основной файл theme.liquid, возможно, там есть ошибка. Если вы не занимаетесь веб-разработкой, то лучше ничего не менять в коде темы, это может привести к дополнительным ошибкам. Найдите профессионала, который вам поможет, например, нас.

6️⃣ Кастомный код.
Зачастую такие ошибки возникают из-за "кастомного кода". Но как он попал в тему? Либо приложениями, либо тема просто кастомная :)

В таком случае убедитесь, что все скрипты правильно подключаются, потому-что зачастую, ошибка этого сообщения именно скриптовая. Если вы проводили отладку, то на третьем шаге должна быть ошибка.

Что может привести к ошибке "There was an error updating your shopping cart. Please try again."?
Если на вашем сайте используется стартовый шаблон, например, Dawn, и у вас кастомный (уникальный) дизайн шапки сайта. Иными словами, если не натягивать вёрстку на существующую шапку в шаблоне, можно получить такую ошибку.

❗️Внимательно следите за консолью браузера когда работаете с кастомными темами, это лишь одна ошибка, а их может быть огромная куча.


@usessnt | Наш сайт
🤓2
🆕 Отправленные формы хранятся в метаобъектах - Shopify Forms

Теперь вы можете просматривать все отправленные данные из приложения Shopify Forms в админ-панели своего магазина. При создании формы для нее создается соответствующий метаобъект. Затем, каждый раз, когда поступает новая отправка, в этот метаобъект будет записываться запись. Это позволяет вам просматривать все ваши отправленные данные в одном месте, вместо того чтобы искать в записях клиентов определенную отправку.

Подробнее про Shopify Forms

@usessnt | Наш сайт
👍2
🚀 Интересные новости для разработчиков Shopify!

Версия Hydrogen v2024.7.3 вышла в начале августа. В нем появилось несколько интересных обновлений, которые сделают работу с Shopify еще более плавной. Этот выпуск содержит улучшения опыта разработчика, оптимизацию и исправления ошибок, которые вы обязательно оцените.

Вот что нового:
- Поддержка пользовательских файлов .env: Легко настраивайте параметры окружения.
- Повышенная производительность форматирования валют: Ускорьте эти вычисления!
- Упрощенное создание контекста: Новая функция createHydrogenContext изменит ситуацию.
- Улучшение компонента сценария: Теперь с параметром waitForHydration.
- Кроме того, исправления веб-кэша Google, поддержка пользовательских логгеров в vite.config.js и многое другое!

@usessnt | Наш сайт
👍3
Нюансы разработки Shopify тем

1️⃣ Shopify будет агрессивно кэшировать HTML-вывод ваших шаблонов Liquid, что означает, что вы не можете полагаться на чувствительную ко времени логику внутри ваших шаблонов Liquid (например, просматривать текущее время, чтобы определить, показывать или скрывать товар). Для таких чувствительных ко времени действий мы рекомендуем использовать JavaScript.

2️⃣ Хоть Shopify и поддерживал компиляцию файлов Sass в CSS, в целях безопасности он не поддерживал синтаксис @import, то есть все ваши стили должны быть записаны в одном файле.

Версия Sass, используемая Shopify, также немного устарела, поэтому некоторые новые функции Sass не поддерживаются. По этим причинам мы обычно избегаем использования функций Sass в Shopify и использую более продвинутый рабочий процесс разработки (о котором мы поговорим в каком-нибудь следующем посте) для предварительной компиляции стилей.

Shopify прекратил поддержку Sass в 2020 году.

3️⃣ Как разработчик тем для Shopify, вы должны понимать, что не всегда только ваш код будет работать в магазине продавца. Помимо некоторых не тяжёлых библиотек, добавленных Shopify для администрирования и отслеживания, любые приложения Shopify, добавленные продавцом, могут манипулировать файлами шаблонов и файлами стилей вашей темы, загружать дополнительные скрипты или динамически корректировать HTML разметку.

Вы можете решить многие проблемы, программируя свои темы с оптимизированием кода, упрощая их редактирование и поддержку, а также следуя надежным методам разработки.

@usessnt | Наш сайт
🔥2
👨‍💻 Что такое Section Rendering API?

ℹ️ Section Rendering API в Shopify — это API, которое позволяет динамически обновлять содержимое секций на страницах магазина без полной перезагрузки страницы. Это особенно полезно для создания интерактивных элементов, таких как фильтры, корзина товаров, переключение вариантов продуктов и т.д.

Основные особенности Section Rendering API:

1️⃣ Асинхронное обновление: Вы можете отправить запрос на сервер, чтобы получить обновленное содержимое конкретной секции. Сервер вернет HTML-код, который затем можно внедрить в текущую страницу без полной перезагрузки.

2️⃣ Улучшение производительности: Поскольку обновляется только определенная часть страницы, это может значительно улучшить производительность и пользовательский опыт.

3️⃣ Гибкость и контроль: Вы можете использовать этот API для обновления отдельных секций страницы, что даёт больше контроля над тем, как и когда обновляются данные на странице.

4️⃣ Простота использования: Запросы к API делаются через AJAX, а результат (HTML-код) легко интегрируется в DOM с помощью JavaScript.

Пример использования Section Rendering API может включать обновление содержимого корзины после добавления товара, фильтрацию продуктов на странице коллекции или изменение варианта продукта на странице товара, где только определенные секции страницы обновляются для отображения новой информации.

@usessnt | Наш сайт
👨‍💻2
У Shopify Новый CTO - Михаил Парахин

Михаил сделал невероятную карьеру в области машинного обучения, поиска и искусственного интеллекта, и его работа оказала значительное влияние на всю технологическую отрасль. Он идеально подходит для того, чтобы возглавить наши команды инженеров и специалистов по работе с данными в будущем.
- Харли Финкельштейн (Директор Shopify)


Мы думали, а стоит ли рассказывать про эту новость, возможно, вам будет неинтересно. Но потом мы поняли, что она касается будущего Shopify, а именно развитие ИИ. А про такое мы рассказать не можем.
Вы, скорее всего, помните презентованный Sidekick, чат-бот от Shopify, который встраивается в админ-панель и помогает вам управлять магазином. Но его до сих пор не выпустили, а прошло уже больше года с момента релиза.

Новый СTO поможет Shopify достичь новых высот в развитие ИИ!

А мы продолжаем следить за новостями и делиться с вами :)

@usessnt | Наш сайт
🔥4
ssnt.gif
36 MB
🆕 Наш новый сайт

С момента прошлого поста по нашему сайту, по ощущению, изменилось не много. Тем не менее, мы добавили:
1️⃣ Некоторый бэкенд функционал;

2️⃣ Улучшили старый код;

3️⃣ Добавили новые страницы (sitemap, support center, documentation, documentation detail, contact, faq, и другие.). Некоторые из них ещё не заполнены на 100% или что-то может не работать, например, поиск или чат.


Сайт отображает некоторые товары из нашей коллекции и посты (посты пока только на английском языке, но это изменится). Не на всех товарах готова инструкция, поэтому не пугайтесь, если вдруг после покупки не обнаружите её на почте, мы работаем над этим.

@usessnt | Наш сайт
🔥2
⚠️ Начиная с апреля 2025 года, новые публичные приложения, размещаемые в магазине приложений Shopify, должны использовать GraphQL

GraphQL теперь является основным API для взаимодействия с админкой Shopify. REST Admin API будет помечен как устаревший, а разработка и улучшение новых функций будет сосредоточена на GraphQL.

1 апреля 2025 года: Все новые приложения будут по умолчанию использовать GraphQL.

Организациям, созданным после этой даты, будет разрешено использовать GraphQL только для своих пользовательских приложений.
Все новые публичные приложения, представленные в App Store после этой даты, должны использовать только GraphQL.
Сроки миграции существующих приложений (за исключением необходимой миграции на новые API продуктов GraphQL, которые уже были анонсированы) будут объявлены в 2025 году. Мы позаботимся о том, чтобы обеспечить достаточное количество времени для плавного перехода.

Узнайте больше о стратегии Shopify в области API и направлении развития GraphQL.

Перевод официальной новости от разработчиков Shopify.

@usessnt | Наш сайт
👨‍💻1
🤔 Вы думали мы про вас забыли? А вот и нет.

🆕 Рассказываем про наш новый сайт (хоть ему уже и месяц). Для нас он всё ещё остается новым и мы постоянно над ним работаем и улучшаем многие аспекты.

Наш сайт представляет собой интернет-магазин со статьями. На данный момент товары хранятся в Gumroad, в будущем рассматривается вариант перехода на Shopify. Статьи хранятся в Sanity CMS. Это Headless CMS, которая позволяет удобно работать с контентом. Пока что нам нравится, если перейдём на Shopify, то статьи уже будут тянуться оттуда.

Список страниц сайта вы сможете найти по ссылке — https://usessnt.com/sitemap.


Изначально был план просто сделать Shopify тему, но мы не ищем лёгких путей и решили работать по-своему, так сказать. Конечно, в выбранном нами стеке технологий есть нюансы.

Но нашей команде показалось, что:
1. Прикольно поработать с Gumroad и Sanity одновременно;
2. Не привязывать себя к Shopify приложениям. Как вы знаете на каждый “пук” нужно либо писать своё решение, либо ставить приложение. Нам, как разработчикам, вариант с приложениями не очень нравится, а писать своё решение не всегда разумно. Особенно когда речь идёт о коротких сроках;
3. Иметь большой потенциал в кастомизации сайта. Мы можем сделать что угодно, как угодно, и где угодно — круто же, разве нет?;

Но есть и минусы, самый большой — нужно всё писать с нуля (аккаунт, вишлист, комментарии, недавно просмотренные товары, скидочные купочны, upsell / cross sell функционал и тд.). Но мы к такому привыкли. Да, это занимает много времени, но зато интересно. Поэтому мы и выбрали такой путь.

Контактная форма на сайте временно не работает, приносим извинения за неудобство.

@usessnt | Наш сайт
👨‍💻3
Запуск налоговой службы Shopify в ЕС и Великобритании

Shopify слышал от продавцов, что управление соблюдением НДС может быть стрессом и препятствием для роста бизнеса. Чтобы упростить налоги и помочь продавцам сосредоточиться на главном, Shopify запустили Shopify Tax в ЕС и Великобритании 29 октября 2024 года. Теперь Shopify Tax является налоговым сервисом по умолчанию для новых продавцов в этих регионах.

В рамках этого развертывания Shopify перевели существующих продавцов, использующих прежний налоговый сервис, на Shopify Tax. Торговцы были проинформированы об этом изменении по электронной почте 15 октября 2024 года, и им была предоставлена возможность отказаться от перехода.
Продавцы, отказавшиеся от перехода, были переведены на Basic Tax, который аналогичен устаревшему налоговому сервису. Миграция произошла в период с 29 по 31 октября 2024 года. Продавцы также могут понизить рейтинг своего магазина (магазинов) в любое время в админке Shopify.

Обновленные магазины сохраняют все существующие настройки, чтобы обеспечить плавный переход:

1. Ручные переопределения и исключения товаров
2. Выставление счетов через сторонние приложения - налог будет по-прежнему передаваться в приложения, как и раньше. Торговцы могут продолжать использовать это приложение, счета-фактуры Shopify Tax по умолчанию отключены.

Новые функции в Shopify Tax
Shopify представили несколько новых функций, призванных улучшить соблюдение требований, сэкономить время и упростить управление в админке Shopify. Это не только принесет пользу продавцам Shopify, но и позволит их партнерам лучше помогать своим клиентам.

Интеллектуальные расчеты при оформлении заказа: Точные ставки НДС, основанные на местоположении покупателей, категориях товаров и доставке, пропорционально облагаемой налогом на каждый заказ как в ЕС, так и в Великобритании.

Отслеживание пороговых значений: Автоматические оповещения о том, когда магазинам следует обновить регистрацию новых или существующих обязательств.

Счета-фактуры с НДС: Генерирование, хранение и отображение счетов-фактур для заказов клиентов и B2B.

В следующем году Shopify также планирует выпустить улучшения, предназначенные исключительно для Shopify Tax. Их текущие планы включают в себя переработанную отчетность, улучшения в счетах-фактурах с НДС и поддержку специальных территорий.

Ценообразование
Shopify Tax будет бесплатным для всех продавцов до 31 декабря 2024 года. С 1 января 2025 года вступает в силу следующая модель ценообразования:

Shopify Tax бесплатен для каждого магазина, пока он не достигнет (€/£/$)100 000 GMV в общем объеме продаж за каждый календарный год.
После достижения этого порога к заказам, в которых включен сбор НДС, будут применяться стандартные ставки. В Великобритании и Европейском союзе комиссия составляет 0,25 % или 0,15 % для магазинов на тарифном плане Plus, не превышая (€/£/$)0,99 за заказ.
Кроме того, с магазинов взимается не более (€/£/$)5 000 на регион в календарный год.

Валюта определяется по месту выставления счета магазина.
Варианты налоговых услуг Shopify
Продавцы в ЕС и Великобритании могут в любое время в админке Shopify перейти на базовый налог или ручной налог. Эти услуги бесплатны, но обеспечивают более низкий уровень соответствия и автоматизации.

Предстоящие изменения
Shopify также сообщает о предстоящем отказе от приложения AvaTax, который может затронуть некоторых продавцов Shopify Plus по всему миру. В начале этого года Avalara выпустила новое приложение Avalara Tax Compliance, в результате чего приложение AvaTax будет устаревшим 30 апреля 2025 года.

Продавцы будут проинформированы об этом и их возможностях по электронной почте в середине ноября. Продавцы, которые в настоящее время используют AvaTax 1.0 для расчета налогов и соблюдения налогового законодательства в своих магазинах, должны будут перейти на новое приложение Avalara, Shopify Tax (или другие налоговые сервисы Shopify в зависимости от местоположения магазина) или другое стороннее приложение до 30 апреля 2025 года.

@usessnt | Наш сайт
🔥2