• 文字サイズ


解決済

WordPress JSON アイキャッチを取得できない場合の書き方について

  • 相談者:非公開
  • 2022/03/30 14:34
お世話になります。

弊社本店 サイトでWordPressの記事をJSON形式で出力し、
javascriptとHTML、CSSで記事を表示しています。

記事のアイキャッチ画像を取得できない場合、
現在表示しているJavascriptの記述にどのように記述をすればよろしいでしょうか。
https://www.4860.jp/sub/test/

ブログを表示するJavascriptの記述と、
画像が無い場合の代替画像を表示のjavascriptを記述しましたが、表示されませんでした。
▼参考にしたサイトはこちら
https://designsupply-web.com/media/programming/4883/

取得出来なかった場合の代替画像を表示させる
記述方法がございましら、ご教示のほどよろしくお願いします。

<!-- ブログ記事を表示 -->
<div class="top_blog"></div>
<script>
$(function(){
$.ajax({
type: 'GET',
url: 'https://www.4860-blog.com/wp-json/wp/v2/posts?_embed&categories=813&orderby=id&per_page=20',
dataType: 'json'
}).done(function(json){
var len = json.length;
for(var i=0; i < len; i++){
var title = json[i].title.rendered;
var link = json[i].link;
var excerpt = json[i].excerpt.rendered;
var imgurl = json[i]._embedded['wp:featuredmedia'][0].source_url;

var pubDD = new Date(json[i].date);
yy = pubDD.getYear();if (yy < 2000) { yy += 1900; }
mm = pubDD.getMonth() + 1;dd = pubDD.getDate();
var pubDate = yy +'.'+ mm +'.'+ dd ;
var html = '<ul><li><a href="' + link + '">'+'<img src="' + imgurl + '" class="blog_img" ><br><span>' + pubDate + '</span>' + title +'</a>' + excerpt + '</li></ul>';
$('.top_blog').append(html);
}
}).fail(function(json){
$('.top_blog').append("読み込みませんでした。");
});


});
</script>

<!-- 画像が無い場合 代替画像を表示 -->
<script>
const images = document.querySelectorAll('img.blog_img'); //class名があるimgタグ
images.forEach((image) => {
 image.addEventListener('undefined',() => {
  image.setAttribute('src', 'https://www.4860.jp/contents/images/alternative_img.jpg'); //代替画像
 });
});
</script>
投稿内容について報告する

今気になってる疑問、
セミナーに参加すれば解決するかも!?
日本全国のネットショップ12,000社が参加!
ネットショップでお悩みがある方はまずはオンラインセミナーへGO!
広告0円で楽天の売上アップ続出!
ECマスターズチャンネルをチェック!
総視聴回数15万回突破!
最新の対策事例やSALE対策など、売上にお困りの方はぜひご視聴ください!

  • 返信者:非公開
  • 2022/03/30 15:44
ECマスターズの北原です。

>取得出来なかった場合の代替画像を表示させる記述方法がございましら、
ご教示のほどよろしくお願いします。

こちらのよう………(省略)………
このフォーラムへの質問は終了しました