graffiti on the web Twitter Bootstrapを使用して、レスポンシブなウェブサイトを制作していたのですが、iPhoneで縦画面、横画面での表示を繰り返すと画面からはみ出してしまう（拡大表示した時のように画面内にサイトが収まっていない）現象に悩まされました。
もちろん、縦でも横でも画面横幅ピッタリにサイトが表示されるのが理想なので、調べてみました。
今回使用していたのは、Bootstrap v3.…
1.WP REST APIプラグインをインストール
管理画面から「WordPress REST API」プラグインをインストールし、有効化します。
これでhttp://◯◯◯.com/wp-json/wp/v2/postsにアクセスすれば、記事の情報がjson形式で表示されます。 WordPress REST API
jsonを取得・表示させる
<?php
//WordPressのURLを指定（新着記事2件取得）
$url = 'http://◯◯◯.com/wp-json/wp/v2/posts?_embed&per_page=2';
$ch = curl_init(); // 1. 初期化
curl_setopt( $ch, CURLOPT_URL, $url ); // 2. オプションを設定
curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true );
$result = curl_exec( $ch ); // 3. 実行してデータを得る
curl_close(); // 4. 終了
//連想配列にする
$arr_json = json_decode($result,true);
// print_r($arr_json);
foreach ($arr_json as $json) {
$json_date = $json["date"];
$json_date = date('Y年n月j日', strtotime($json_date));
$json_link = $json["link"];
$json_title = $json["title"]["rendered"];
$json_img = $json["_embedded"]["wp:featuredmedia"][0]["media_details"]["sizes"]["full"]["source_url"];
?>
<div class="detail">
<?php //アイキャッチがある場合
if($json_img) { ?>
<div class="blog_img">
<img src="<?= $json_img; ?>" class="article_title_img">
</div>
<?php } ?>
<strong><span class="date">
<?= $json_date; ?>
</span></strong><br>
<a href="<?= $json_link; ?>"> <span class="listTitle">
<?= $json_title; ?>
</span> </a> </div>
<?php
}
?>
この投稿へのコメント
コメントはまだありません。