記事一覧にサムネイルを表示させるパターンはよくあります。
ですが、ワードプレスの場合通常はアイキャッチ画像を使うので、記事内に表示させる画像の他にアイキャッチ画像として登録する手間が生じてしまいます。
自身のサイトならなんてことはない手間ですが、クライアント様に納品するシステムとしては
「カスタムフォールドに登録した画像を、アイキャッチ画像にも登録してください」と言うのが、なんともダサイ気がしてなりません。
ワードプレスの管理画面には様々な文字があります。
しかし、もとの英文をワードプレスが日本語に翻訳しているので、なんとなくわかりづらい言葉もあります。
管理者は慣れているので問題ありませんが、ワードプレスでホームページを作りクライアント様に納品時に操作説明する際に、直感的にわかりやすい言葉のほうがよろしいかと思います。
例えば、、、
「新規追加」 ⇒「記事を追加」
「ダッシュボード」 ⇒ 「各種お知らせ」
「メディアを追加」 ⇒ 「画像を追加」
画像投稿時の「画像を選択する」などは、画像アップロードした時点ですでに選択状態にあるのですから、「画像を埋め込む」とかのほうが分かりやすいと思います。
寄稿者ユーザーを持つワードプレスの場合、寄稿者が投稿しても管理者の承認が必要となります。
その際に、デフォルトでは管理者が常にレビュー待ちの記事がないかチェックしなくてはなりません。
これは面倒ですね。
レビュー待ちの記事が投稿がされた場合、管理者にメールで知らせるようにしましょう
複数のユーザーで記事投稿するような運営の場合、投稿者を寄稿者権限にして内容を管理者が精査し、承認するというパターンもあります。
その際に、面倒なのが、なぜかワードプレスの寄稿者は画像アップロードの権限がないのです。
不特定多数のユーザーを持つブログなどはこの方が安全ですが、例えば社内の複数の人間で運営する場合などは信頼できるユーザーなので画像のアップロード権限を持っている方がスムースですね。
この場合、寄稿者にも画像アップロードが出来るような記述があります。
管理画面の記事一覧にある絞込フィルターは「日付」と「カテゴリー」だけです。
しかし、カスタム投稿で作った自前のカスタムタクソノミーはこのカテゴリーの絞込に表示されません。
下記がfunction.phpに追加するカスタムタクソノミー用の絞込フィルターの増設です。
管理画面の投稿一覧ページでは、デフォルトで「投稿者」「タグ」「コメント数」などが表示されていますが、これってクライアント様に渡すときに必要あるとは思えないのです。
逆に、特定のカスタムフィールド値などが表示されていたほうが記事の選別がしやすいと言うパターンが多々あります。
ワードプレス制作の覚え書きとして、自分のために記録しています。
どなたか、ご同業で参考にされる方がいらっしゃいましたらお役に立ててください。
例えば、フォトギャラリーなどを作るときに、サムネイル一覧を並べておいて、画像クリックで元サイズの画像を表示させる場合など、カスタムフィールフィールドとアイキャッチ画像の両方に同じ画像を登録するのは面倒です。
その場合、カスタムフィールドに登録した画像のサムネイルを出力するためには、フロント側の記述を変更します。
フィールド値が「画像1」だった場合
<img src=”<?php the_field( ‘画像1’,$post->ID); ?>”>
これは、フィールドの返り値をURL指定していれば画像がそのまま表示されます。
上記を
<?php echo wp_get_attachment_image(get_post_meta($post->ID, ‘画像1′, true),’thumbnail’); ?>
にすることで、画像1 のサムネイルが表示されます。
・・・で、よく見ると元画像を出力するときと違い、<img>タグは書きません。
この場合、<img>タグ込みで出力されます。
<imgの中に、width=”*****px” heght=”*****px” とサイズしてされてしまいますが、これはHTMLですので、CSSでサイズを指定しなおしてやればCSSのほうが優先されます。
例)
<div class=”image”>
<?php echo wp_get_attachment_image(get_post_meta($post->ID, ‘画像1′, true),’thumbnail’); ?>
</div>
<style>
.image{
width:100px;
}
.image img{
width;100%;
height:auto;
}
これで横幅100pxのサムネイルの表示となります。
ちなみにheightでautoを指定してあげないと高さだけもとのサムネイルのサイズで出力されてしまいます。
==========================================================
横浜・川崎でのホームページ制作、インターネット関連のご相談はお気軽ご連絡ください。
有限会社テクニカルプロデュース
神奈川県川崎市中原区新丸子町745
044-711-8100
メールでのお問合せはこちら>
アイキャッチ画像に登録したサムネイルをそのまま出力すると、<img>タグ内にwidthとheghtの指定サイズが書き込まれてしまいますね。
このため、CSS側でサムネイル画像のサイズを指定しても思うようにいきません。
function.phpにこのサムネイルのサイズの書き出しを行なわない記述を追加すれば解決します。
ホームへ戻る