Liquid、JavaScriptなどに関する質問
成功
@SHOKO06 様
初めまして。新垣です。
下記コードを{{ article.content }}が存在するファイル、または、そのファイルが取り込んでいるJSファイルに記述してください。
document.addEventListener('DOMContentLoaded', function() { // ページ読み込み時
const images = document.querySelectorAll('img[alt]'); // alt属性を持つすべての画像を取得
images.forEach(image => {
const altText = image.getAttribute('alt');
if (altText) { // alt属性が存在する場合
const p = document.createElement('p');
p.textContent = altText; // pタグにalt属性のテキストを挿入
p.className = 'article-img_alt'; // classを追加
image.insertAdjacentElement('afterend', p); // 画像の直後にpタグを挿入
}
});
});
以上、ご参考になりましたら幸いです。
成功
@SHOKO06 様
初めまして。新垣です。
下記コードを{{ article.content }}が存在するファイル、または、そのファイルが取り込んでいるJSファイルに記述してください。
document.addEventListener('DOMContentLoaded', function() { // ページ読み込み時
const images = document.querySelectorAll('img[alt]'); // alt属性を持つすべての画像を取得
images.forEach(image => {
const altText = image.getAttribute('alt');
if (altText) { // alt属性が存在する場合
const p = document.createElement('p');
p.textContent = altText; // pタグにalt属性のテキストを挿入
p.className = 'article-img_alt'; // classを追加
image.insertAdjacentElement('afterend', p); // 画像の直後にpタグを挿入
}
});
});
以上、ご参考になりましたら幸いです。
ありがとうございます!
早速試してみます。
無事、こちらで実装できました!ありがとうございました。
Shopify アカデミーの学習パスB2B on Shopify:立ち上げとカスタマイズで卸売販売に進出しましょう。これら3つの無料コースは、ShopifyストアでB2B機能...
By Shopify Jan 31, 2025サポートの選択肢が増えていく中、最適となる選択の判断が難しくなっているかと存じます。今回は問題の解決に最適となるサポートの選択方法を、紹介させて頂きます。 選択肢のご紹介...
By Mirai Oct 6, 20242023年初頭、Shopifyペイメントアカウント、及びShopifyアカウント全体のセキュリティを強化する為の変更が適用されました。ユーザーのアカウントセキュリティを強化す...
By Mirai Sep 29, 2024