Shopify Текст в реч — Аудио на продуктова страница
Shopify интеграция
Shopify текст в реч — аудио на продуктова страница с изкуствен интелект чрез theme.liquid
Превърнете описанията на продуктите, колекциите и публикациите в блога на Shopify в готови за слушане аудио на продуктовата страница с GSpeechТърговците получават естествени гласове с изкуствен интелект и модерни плейъри, докато синтезът работи в... GSpeech Конзола за облак - Не се изискват API ключовеи без зареждане на TTS на вашия хост на Shopify тема.
Това ръководство обхваща Shopify TTS настройка: поставете кода за връзка преди in theme.liquid (или персонализирана течност / персонализиран HTML), поставете плейъри на цяла страница / бутон / кръг върху шаблоните за продукти и съдържание, след което картографирайте Селектор на съдържание намлява Рендиране на елемент така че разказът чете описанията, а списъкът с изключения пропуска цената, формулярите и значките.
theme.liquid текст към реч — едно вграждане на витрина за шаблони за продукти, колекции и блогове.
Генериране на облачно аудио — синтезирайте веднъж, кеширайте и възпроизвеждайте повторно между купувачите.
Не се изискват API ключове — гласове и играчи от една конзола.
Изключете цената и формулярите — запазвайте потребителския интерфейс на плащане безшумен, докато описанията говорят.
Най-доброто за: Търговци от Shopify, които искат готови за слушане описания на продукти, истории за колекции и статии в блога – с изключени от речта цени, формуляри за добавяне в количката и значки.
Създайте уебсайт — ако все още не сте добавили сайт на магазин, последвайте го създайте уебсайт.
Отворете сайта — отидете при вас табло и изберете сайта Shopify.
Копирайте кода на Shopify — отворено Интеграции → Shopify и копирайте кода за връзка.
Постави преди — вмъкнете кода във вашата тема (обикновено theme.liquid, персонализирана течност или персонализиран HTML) преди затварящия маркирайте, след което публикувайте.
Кодът за връзка се зарежда GSpeech на всяка страница на магазина, където е налично. Играчите се показват само там, където поставяте монтировки / персонализиран HTML код и само когато съответстващият уиджет е публикуван и конфигуриран.
Модел на картографиране
theme.liquid, монтиране на продукти и картографиране на съдържание
В Shopify, един theme.liquid embed зарежда целия магазин на двигателя. След това всеки уиджет съпоставя текста на описанието на продукта, текста на колекцията или HTML кода на блога с монтиран плейър — без твърдо кодиране на аудио във всеки продукт:
1Код за връзка
Зарежда двигателя от theme.liquid / Custom Liquid. Без него, стойките за продукти остават празни.
2Персонализирана джаджа
Конфигурация на таблото за управление: глас, език, дизайн, настройки на съдържанието, URL правила за продукти спрямо блогове.
3Монтиране / Персонализиран HTML
Маркер в продуктова секция или тематичен блок (например .gsp_full_player) където се появява играчът.
4Картографиране на съдържание
Селектор на съдържание = текст на описание за четене. Рендиране на елемент = къде се появява играчът. Изключете цената, формулярите и значките.
Неограничени джаджи — отделни джаджи „Цяла страница“, „Бутон“ или „Кръг“ за продукти, колекции, блогове или езици.
Неограничен брой играчи на джаджа — един публикуван уиджет може да захранва всяко съответстващо монтиране, разрешено от правилата за Render Element + URL.
Персонализиран HTML / Liquid — в Shopify стойката изглежда така <div class="gsp_full_player"></div>В WordPress същата идея използва кратки кодове като [gspeech].
Настройки по подразбиране срещу разширени настройки — монтираните по подразбиране елементи работят бързо. Разделите на персонализираните теми изискват точни стойности за селектор на съдържание / елемент за рендериране.
Играчите
Добавете играчи с Shopify Custom HTML
Поставете някое от тези маунтове там, където играчът трябва да се показва на страниците с продукти или съдържание. Кликнете върху карта, за да я копирате. След това задайте уиджета. Рендиране на елемент към същия клас.
Съпоставете текста на продукта и темата на Shopify с плейъра
В уиджета съдържание раздел, описание на целевия продукт и обвивки на тема, които купувачите трябва да чуят – и изключете цена, формуляри за продукти и значки, така че звукът да остане полезен.
идентификатор → # / клас → . — HTML атрибутите стават селектори с диез или точка.
Съберете парчета — Селекторът на съдържание може да изброи няколко обвивки, разделени със запетаи.
Подстригване на парчета — Списъкът за изключване използва същото # / . + запетаи (ценови формуляри, значки, хромираната кошница).
Определя какъв текст се произнасяИзползвайте CSS селектори, разделени със запетаи. Примери:
.product__description, .rte, #ОсновноСъдържание — прочетете тези елементи.
.product__description,.rte,#my_id,.my_class — множество цели в едно поле.
родителски_клас — прочете родителската обвивка на монтираното поле (полезно за персонализиран HTML код в продуктова секция).
себе_клас — прочетете същата обвивка, в която се намира монтировката.
Оставете празно, ако използвате Съдържание Текст вместо това (фиксиран текст, а не DOM съдържание).
RE
Рендиране на елемент
Определя където е инжектиран потребителският интерфейс на играчаТрябва да съответства на реален елемент на страницата на магазина.
За персонализирани HTML монтирания, задайте го на класа за монтиране: .gsp_пълен_плейър, .gsp_button_player или .gsp_circle_player.
Можете също така да насочвате контейнери за оформление, като например тяло, #ОсновноСъдържание или .product__title когато не използвате специално монтиране.
Ако „Селектор на съдържание“ е правилен, но нищо не се показва, „Елементът за рендиране“ обикновено е грешен или липсва на тази страница.
RP
Позиция на изобразяване
Поставя играча Преди or След съдържанието на Render Element. За специален div за монтиране, After/Before обикновено все още работи спрямо този възел — дръжте монтирането празно и оставете уиджета да го запълни.
EX
Списък за изключване
Селектори, които трябва не да бъдат изговорени, дори ако се намират в селектора на съдържание. Същото # / . правила, разделени със запетаи. Пример: .product-form,.price,.badge,.no-speech.
TT
Селектор на заглавия / Текст на заглавието
Селектор на заглавие — динамично заглавие от страницата (пример: h1.product__title).
Заглавен текст — фиксирано заглавие, показвано в плейъра. Оставете селектора на заглавие празен, когато използвате текст на заглавието.
CT
Съдържание Текст
Незадължителен фиксиран текст на разказване. Когато се използва, селекторът на съдържание може да остане празен. Полезен е за кратки промоционални блокове на страници с колекции, когато продуктовият DOM не трябва да задвижва аудио.
Емпирично правило за Shopify: Цели на селектора на съдържание .product__description (или .rte), Render Element е насочен към монтирането, а Exclude List запазва .price намлява .product-form извън аудиото.
Примери
Практически примери за картографиране на продуктови страници на Shopify
Пример А
Описание на продукта с плейър за цяла страница
Шаблонът за продукт включва описание и стойка близо до кутията за покупка:
Списък за изключване - .product-form,.price,.badge
Селектор на заглавие - h1.product__title (незадължително поле)
Пример Б
Колекция или статия в блога с parent_class
Ако монтираното изображение се намира в историята на колекцията или в тялото на блога на магазина, селекторът на съдържание може да бъде относителен:
Селектор на съдържание - parent_class (чете родителя на планината)
Рендиране на елемент - .gsp_full_player
Списък за изключване — запазвайте цената и формулярите без информация, ако се появяват в един и същ шаблон
употреба self_class когато самата обвивка на монтирането съдържа текста, който трябва да бъде разказан.
Пример В
Аудио за продукти в целия каталог с един уиджет
Място .gsp_button_player върху продуктовия шаблон. Уиджет за плейър с един бутон и елемент за рендериране .gsp_button_player може да захранва всяка продуктова страница. Създавайте допълнителни джаджи само когато гласът, селекторите или правилата за URL адреси трябва да се различават (например блог спрямо продукт).
Публикувай и слушай — задайте „Статус“ на „Публикувано“, обновете витрината на живо, тествайте възпроизвеждането.
Когато текстът на продукта или страницата се промени, Smart Audio Sync може да регенерира разказването във фонов режим. Полетата за картографиране все още решават... който текст и където играчът живее.
Често задавани въпроси
ЧЗВ: Shopify текст към реч на продуктови страници
Shopify поддържа ли преобразуване на текст в реч и гласове с изкуствен интелект с GSpeech?
Да. GSpeech добавя Текст в реч от Shopify така че търговците могат да предлагат аудио с изкуствен интелект на продуктови страници в описания, колекции и блогове на магазини. Аудиото се генерира в облака и се възпроизвежда чрез съвременни джаджи — без API ключове към вашата тема.
Как да добавя GSpeech с theme.liquid или Custom Liquid?
Копирайте кода за връзка с Shopify от Интеграции → Shopify. Поставете го вътре theme.liquid (или персонализирана течност / персонализиран HTML) преди и публикувайте. След това добавете монтиране, например <div class="gsp_full_player"></div> в шаблона на продукта и задайте Render Element на този клас.
Какво е Content Selector срещу Render Element в Shopify?
Селектор на съдържание избира кой HTML на темата да разкаже — обикновено .product__description or .rte. Рендиране на елемент избира къде се показва плейърът — обикновено вашият персонализиран HTML файл. Използвайте списъка за изключения за .price, .product-formи значки, така че купувачите да чуят описанието, а не потребителския интерфейс за плащане.
Ще забави ли звукът на GSpeech магазина ми в Shopify?
Не. Синтезът и кеширането се случват в GSpeech облак, а не на Shopify сървъри. Вграждането на темата е леко и плейърите се показват само в шаблони, където поставяте монтирани елементи. Страниците на продуктите поддържат нормалната производителност на магазина, докато аудиото се възпроизвежда при поискване.
Необходими ли са ми API ключове за Shopify TTS?
Не. GSpeech is Не се изискват API ключове за Shopify. Свържете се с theme.liquid, конфигурирайте аудио джаджи за продукти в Cloud Console и публикувайте. Гласовете и плейърите се управляват от един акаунт без ключове за синтез на говор от трети страни във вашата тема.
Помогне
Нуждаете се от помощ при намирането на селектори за тема на Shopify или оформление на продукта?
Свържете се с поддръжката на GSpeechИзпратете URL адрес на страница и ние ще ви помогнем да картографирате селектора на съдържание / елемента за рендиране.