質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

2回答

315閲覧

カスタムフィールドテンプレートとslick.jsでWPの投稿ページに画像が表示できず困っています。

kick731

総合スコア6

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2018/04/06 12:11

編集2018/04/07 07:30

前提・実現したいこと

すみません、初めて投稿させていただいて、自己中な投げ方をしておりました。
修正させていただきます。

WPのテンプレートを使ってカスタマイズしています。
プラグインのカスタムフィールドテンプレートとslick.jsでサムネイル付きのスライダーを投稿ページに反映させたいと思っています。画像のサイズを調整するためにliquid.jsも使っています。

よろしくお願いいたします。

発生している問題・エラーメッセージ

画像の登録が1枚だと表示されず、2枚以上あると大きい画像とサムネイル画像がきちんと表示されます。
画像が1枚のときも同じように画像が表示できるようにしたいのですが、何が原因かわかりません。
もともと勉強不足でコードが書けないので、ネットで調べていろいろ試していますが、解決できません。

該当のソースコード

lang=javascript

1<script type="text/javascript"> 2jQuery(document).ready(function($) { 3 $(".liquidImage").imgLiquid(); 4})(jQuery); 5</script> 6 7<script type="text/javascript"> 8jQuery( function ($) { 9$( '.slides' ).slick( { 10arrows: false, 11centerMode: false, 12fade: true, 13adaptiveHeight: true, 14centerMode: true, 15asNavFor: '.slides-nav' 16} ); 17jQuery( '.slides-nav' ).slick( { 18slidesToShow: 6, 19arrows: false, 20asNavFor: '.slides', 21focusOnSelect: true 22} ); 23} )(jQuery); 24</script> 25 26<script type="text/javascript"> 27jQuery( document ).ready( function ($) { 28$( ".slide-img" ).imgLiquid(); 29})(jQuery); 30</script> 31 32 33<div class="slides-area"> 34<div class="slides"> 35 36 <?php 37$myimage = post_custom('fileUpload'); 38if($myimage) { 39foreach($myimage as $var) { 40$imgArray = wp_get_attachment_image_src($var, 'full'); 41list( $url, $w, $h) = $imgArray; 42?> 43 <div class="slide-bigimg liquidImage"> 44<img src="<?php echo $url; ?>" /> 45 </div> 46<?php } //foreach ?> 47<?php } //if ?> 48 49 </div> 50 <div class="slides-nav"> 51 52 <?php 53$myimage = post_custom('fileUpload'); 54if($myimage) { 55foreach($myimage as $var) { 56$imgArray = wp_get_attachment_image_src($var, 'full'); 57list( $url, $w, $h) = $imgArray; 58?> 59<div class="slide-img"> 60<img src="<?php echo $url; ?>" /> 61 </div> 62<?php } //foreach ?> 63<?php } //if ?> 64 </div> 65 </div> 66<div class="clearfix"></div>

試したこと

lang=javascript

1<?php 2 $imgsize = "large"; 3 $productimgs = post_custom('fileUpload'); 4 if($productimgs){ 5 if(is_array($productimgs)){ 6 foreach($productimgs as $perimg){ 7 $productImg = wp_get_attachment_image_src($perimg, $imgsize); 8 list( $url, $w, $h) = $productImg; 9?> 10 <div class="slide-bigimg liquidImage"> 11 <img src="<?php echo $url; ?>"> 12 </div> 13 <?php 14 } 15 }else{ 16 echo wp_get_attachment_image($productimgs); 17 } 18 } 19?>

に書き換えたところ、画像の登録が1枚でも表示されますが、なぜかサムネイルサイズになってしまい、画質が荒くなり、<div class="slide-bigimg liquidImage"></div>が外れてしまいます。
他の何かが影響しているのかもしれません。

補足情報(FW/ツールのバージョンなど)

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2018/04/07 02:31

コードが見にくいので、```lang=javascript ```で囲ってください。
kick731

2018/04/07 05:39

すみません、ご指摘ありがとうございます。
guest

回答2

0

PHP

1// $imgsize = "thumbnail"; 2// ↓ 3 $imgsize = "full";

投稿2018/04/07 05:41

kei344

総合スコア69407

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kick731

2018/04/07 07:24

ありがとうございます。実際と書き方が間違っていただので、修正しました。 サムネイルサイズになってしまうので、他の何かが影響しているのかもしれません。
guest

0

画像が1枚で表示されなくて、画像が2枚だと表示される → 正常だと思いますよ。

投稿2018/04/07 02:34

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kick731

2018/04/07 05:42

正常とのことで、ありがとうございます。 1枚のときも画像を表示したいのですが、これでは難しいのでしょうか。。。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問