teratail
回答率
85.49%
質問するログイン新規登録
トップに関する質問Wordpress REST APIでサムネイル画像を読み込む

編集履歴

質問編集履歴

6

ソース修正

2017/12/02 05:25

投稿

holic
holic

スコア134

test CHANGED
File without changes
test CHANGED
@@ -148,7 +148,17 @@
148
148
 
149
149
  <title>WP REST APIテストページ</title>
150
150
 
151
+ </head>
152
+
153
+ <body>
154
+
155
+ <h2>メンバー 全件</h2>
156
+
157
+ <ul id="mylist">
158
+
159
+ </ul>
160
+
151
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
161
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
152
162
 
153
163
  <script type="text/javascript">
154
164
 
@@ -158,33 +168,29 @@
158
168
 
159
169
  $.each(results, function(i, item) {
160
170
 
161
- $("ul#mylist").append("<li>"
171
+ $('ul#mylist').append('<li>'
162
-
172
+
163
- +"【記事タイトル】" + item.title.rendered
173
+ +'【記事タイトル】' + item.title.rendered
164
-
174
+
165
- + "<br>"
175
+ +'<br>'
166
-
176
+
167
- +"【記事サムネイル_フル画像URL】" + item["_embedded"]["wp:featuredmedia"][0]["media_details"]["sizes"]["full"]["source_url"]
177
+ +'【記事サムネイル_フル画像URL】' + item['_embedded']['wp:featuredmedia'][0]['media_details']['sizes']['full']['source_url']
168
-
178
+
169
- + "<br>"
179
+ +'<br>'
170
-
180
+
171
- +"【記事サムネイル_リサイズ画像URL】" + item["_embedded"]["wp:featuredmedia"][0]["media_details"]["sizes"]["w700"]["source_url"]
181
+ +'【記事サムネイル_リサイズ画像URL】' + item['_embedded']['wp:featuredmedia'][0]['media_details']['sizes']['w700']['source_url']
172
-
182
+
173
- + "<br>"
183
+ +'<br>'
174
-
175
- +"【acf値】" + item.acf.事務所
184
+
176
-
177
- + "<br>"
178
-
179
- +"【acf フル画像URL】"　+ item.acf.メッセージ画像.url
185
+ +'【acf フル画像URL】'　+ item.acf.メッセージ画像.url
180
-
186
+
181
- + "<br>"
187
+ +'<br>'
182
-
188
+
183
- +"【acf リサイズ画像URL】"　+ item.acf.メッセージ画像.sizes.top_slider
189
+ +'【acf リサイズ画像URL】'　+ item.acf.メッセージ画像.sizes.top_slider
184
-
190
+
185
- + "</li>"
191
+ +'</li>'
186
-
192
+
187
- + "<hr>");
193
+ +'<hr>');
188
194
 
189
195
  });
190
196
 
@@ -194,19 +200,7 @@
194
200
 
195
201
  </script>
196
202
 
197
- </head>
198
-
199
- <body>
200
-
201
- <h2>メンバー 全件</h2>
202
-
203
- <ul id="mylist">
204
-
205
-
206
-
207
- </ul>
208
-
209
- </body>
203
+ </body>
210
204
 
211
205
  </html>
212
206
 

5

「「

2017/12/02 05:25

投稿

holic
holic

スコア134

test CHANGED
File without changes
test CHANGED
@@ -132,9 +132,7 @@
132
132
 
133
133
  kei344様の助言をもとに書き直しました（出力成功例）。
134
134
 
135
- エンドポイントの設定でカスタム投稿タイプを表す「member」のうしろに[
135
+ エンドポイントの設定でカスタム投稿タイプを表す「member」のうしろに[?_embed]を追記することで解決。
136
-
137
- ?_embed]を追記することで解決。
138
136
 
139
137
 
140
138
 

4

解決

2017/12/02 04:45

投稿

holic
holic

スコア134

test CHANGED
File without changes
test CHANGED
@@ -117,3 +117,99 @@
117
117
 
118
118
 
119
119
  rest　apiに詳しい方がいらっしゃいましたらご教示いただけましたら幸いでございます。
120
+
121
+
122
+
123
+
124
+
125
+
126
+
127
+
128
+
129
+
130
+
131
+ ####解決コード
132
+
133
+ kei344様の助言をもとに書き直しました（出力成功例）。
134
+
135
+ エンドポイントの設定でカスタム投稿タイプを表す「member」のうしろに[
136
+
137
+ ?_embed]を追記することで解決。
138
+
139
+
140
+
141
+ ```html
142
+
143
+ <!DOCTYPE html>
144
+
145
+ <html lang="ja">
146
+
147
+ <head>
148
+
149
+ <meta charset="UTF-8">
150
+
151
+ <title>WP REST APIテストページ</title>
152
+
153
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
154
+
155
+ <script type="text/javascript">
156
+
157
+ $(function() {
158
+
159
+ $.getJSON( "http://example.net/wp/wp-json/wp/v2/member/?_embed", function(results) {
160
+
161
+ $.each(results, function(i, item) {
162
+
163
+ $("ul#mylist").append("<li>"
164
+
165
+ +"【記事タイトル】" + item.title.rendered
166
+
167
+ + "<br>"
168
+
169
+ +"【記事サムネイル_フル画像URL】" + item["_embedded"]["wp:featuredmedia"][0]["media_details"]["sizes"]["full"]["source_url"]
170
+
171
+ + "<br>"
172
+
173
+ +"【記事サムネイル_リサイズ画像URL】" + item["_embedded"]["wp:featuredmedia"][0]["media_details"]["sizes"]["w700"]["source_url"]
174
+
175
+ + "<br>"
176
+
177
+ +"【acf値】" + item.acf.事務所
178
+
179
+ + "<br>"
180
+
181
+ +"【acf フル画像URL】"　+ item.acf.メッセージ画像.url
182
+
183
+ + "<br>"
184
+
185
+ +"【acf リサイズ画像URL】"　+ item.acf.メッセージ画像.sizes.top_slider
186
+
187
+ + "</li>"
188
+
189
+ + "<hr>");
190
+
191
+ });
192
+
193
+ });
194
+
195
+ });
196
+
197
+ </script>
198
+
199
+ </head>
200
+
201
+ <body>
202
+
203
+ <h2>メンバー 全件</h2>
204
+
205
+ <ul id="mylist">
206
+
207
+
208
+
209
+ </ul>
210
+
211
+ </body>
212
+
213
+ </html>
214
+
215
+ ```

3

誤字

2017/12/02 04:44

投稿

holic
holic

スコア134

test CHANGED
File without changes
test CHANGED
@@ -116,4 +116,4 @@
116
116
 
117
117
 
118
118
 
119
- rest　apiに詳しい方がいらっしゃいましたらご教授いただけましたら幸いでございます。
119
+ rest　apiに詳しい方がいらっしゃいましたらご教示いただけましたら幸いでございます。

2

リンク

2017/12/01 03:14

投稿

holic
holic

スコア134

test CHANGED
File without changes
test CHANGED
@@ -12,7 +12,7 @@
12
12
 
13
13
 
14
14
 
15
- 「タイトル」と「カスタムフィールド値」の出力はLIG様の記事で出力に成功しました。
15
+ 「タイトル」と「カスタムフィールド値」の出力はLIG様の記事（https://liginc.co.jp/325391）で出力に成功しました。
16
16
 
17
17
 
18
18
 

1

っｄ

2017/12/01 03:13

投稿

holic
holic

スコア134

test CHANGED
File without changes
test CHANGED
@@ -18,7 +18,7 @@
18
18
 
19
19
  ###発生している問題・エラーメッセージ
20
20
 
21
- 問題はサムネイル画像です。現在下記のように記述しましたがmediaのURLを取得できません、どのように記述すれば良いのでしょうか。
21
+ 問題はサムネイル画像です。現在下記のように記述しましたがサムネイルのURLを取得できません、どのように記述すれば良いのか困っております。
22
22
 
23
23
 
24
24
 
@@ -117,9 +117,3 @@
117
117
 
118
118
 
119
119
  rest　apiに詳しい方がいらっしゃいましたらご教授いただけましたら幸いでございます。
120
-
121
-
122
-
123
- ###補足情報(言語/FW/ツール等のバージョンなど)
124
-
125
- より詳細な情報