本日の予定のうちこれだけできたよ。
えっと、どうやったんだっけ？
うぉー既に忘れてるっていう。
そのための、日報・・・です・・・
<h4><a href="<?php echo get_term_link($child,'plants_group'); ?>"><?php echo esc_html($child->name); ?></a></h4>
あれ？これだけ？なかなかできなかったのに・・・涙
今までの記事に使った画像をサイドバーにランダムに表示させたい
を参考に作ってみたものがこれ。
細かい所、日付やら、タイトルやら、カスタム投稿の種類やらもろもろおかしくでてしまうのですよ。
悲しい。
花
ーマリーゴールド
ーパンジー
野菜
ーなす
ーピーマン
花と野菜以外の一覧を作りたかったのに、親も子も全部含めてでてしまった一覧。
当初は、
<?php get_terms( $taxonomies, $args ) ?>
の
'exclude' => array(),
で、親のIDを指定して除外することでなんとかしましたが、
先輩が教えてくれました！！！
実はこれ、昨日ドットインストールで知ったばかり。
それでも、これ使うって気づかないもんなー(;´д｀)ﾄﾎﾎ…
これを使って無事親を覗いて表示することできました！！
<?php if ($child->parent == 0) { continue; } ?>
写真を入れたらぐっとサイトらしくなってきました。
でもね、
この「アボカド」や「ブルーベリー」でその一覧ページ飛びたいけれど、そのリンクがつけられないんですわ。
明日もまた苦しみそうだわ
植物大分類と中分類を別々にタクソノミーを作っていたので、
大分類の中に中分類を作り直し。
親子関係を作り直すのも大変。
そして、親子をどうやってひっぱってくるかもっぱらぱー
沢山のサイトをサーフィンし、
親と子両方ひっぱってきちゃう
結局できずじまい。
これは、植物のカテゴリーページ。
植物中分類、たとえばピーマンとかアボカドとかの記事をまとめて表示したいのだけど、
さらに上の野菜とか果実とかの親もひっぱってきちゃう。。。うー。
基礎もできていない私にはほんとわけわからん。くそぅ。
ついにこの本のお世話になりはじめました。
今までは、これ読んでもぱっぱらぱー。
うぉ〜〜
手っ取り早くカスタム投稿タイプのアーカイブページを作るには
category.phpをコピペしてファイル名前を「archive-スラッグ.php」にかえればよかったはず。
なのに、表示されない！！
なぜなの！なぜなの！
とググったら、
この一連の作業をやったらOKと。
え・・・
それだけ。
そして、本当になおりました。
私の３時間返して涙
2014年9月24日追加
実は4日間ぐらい悩んだもの。
と思い、「保存」したものの、直らず。
パーマリンク設定をデフォルト設定にしたものの治らず。
あぁ、もうなんかおかしい。
あぁ、既存テーマごちゃごちゃ直してるから知らない間に変になるのかな。
とか考えだす。
ふと、参考書のtaxonomy.phpをそのまま使ってみようとデータを移動。
ん？？？
タクソノミーｐｈｐ二個あ る よ
taxonomy.php
taxnomy.php
スペル間違いかーーーーーいっ！！！！
簡単な事でつまづいてるんだろうとは思ったけど。
(´Д｀)ﾊｧ…
無事、taxonomy.php表示されましたよん！
(´Д｀)ﾊｧ…
時間短縮の為にと、既存のテーマを使うんだけれども、
そのせいでわけがわからなくなることも多々あり・・・
デザインはあとにして、組み込んでいこう！って思ったけれど、
テンプレート作るときに、複製して作ることもあるので
ある程度のデザインは作らなきゃだよなぁ・・・と本日は始めました。
ナビゲーション
記事の表示をこんな感じにしたいんだけど、
もうどう組み込めばいいかさっぱりだよ・・・
イメージはプロジェクト管理なんだけど、それをWordPressでどう整理していいかもわからないし、
とりあえず、カスタム投稿タイプに親子関係つけてやってみようと思ったけど、
さぁてどうやったら表示できるんだ？って状況でございます。
いつも利用してるのが、ホットペッパーBEAUTY。
ポイントが貯まるのと、
自己アフィリエイトができるということがよいんですよね。
なんだかんだ、ネットで広告だしてるところは、
紙面でもだしていて、値引率もだいたい同じなんですけど、
細かい事いえば、数ポイント（＝数円）の差でそれなり違ってきますよ。
なので、ネットに慣れてる人なら、
ネット予約がおすすめです。
自分仕様のガーデニングサイトを作りたかったものの、
こういった機能がほしいな〜〜
というのを、いざ実装できる力はまだまだまだまだなかったので後回し。
ついに、作成しようというところまできました。
最低限の仕様で望むことになったものの、
しょっぱなからつまづきっぱなし。
まず、更新していたもとのブログから引っ越そうと思ったら
画像は引っ越しできないことに気づき。
さてインポートと思ったら、
タイトルが入力されておらず、調べたら
ここで、なんだかおかしくなりました。
空っぽのものを削除しようと思っても、全然削除されない。
これはおかしいと作りなおせばよかったのに・・・
カスタム投稿タイプをせっせと作ったのでなかなか実行できず。
でも、こういうことがあると、
後から後から、変なことになるんですよねぇ
このサイトではあっさり作ったカスタム投稿のアーカイブページも表示されないっ！
少しググったら、
データベースを一旦全部消してやり直したら、直った。
とあったので、今のうちにやり直すことにします。
はぁ〜〜。大変だ〜〜
プライベートで、私テレビに出るんです。
そのための宣伝といいますかなんといいますか、
プライベートサイトを作りまして、そのためのアイキャッチ？カスタムヘッダー画像を作っておりました。
おかしいところだらけなのわかっちゃいます？
暗くしてる画像おかしすぎーー！！
背景だけが伸びるようにやっても、私も伸びるし。
勝手に背景作ってくれる機能やっても、ドラムが何個も出ちゃうしｗ
まぁ、よいでしょう。ひとまず。
ごちゃごちゃやったらなんとかなりました。
幅の設定が変だったのかなぁ・・・
仕事してるのか？という声が聞こえた気がして。
仕事もしてます。
合間に、勉強しまくってます。合間をくれる、というところもいい会社でしょー
カラオケ番長まちさんの紹介で、
取材に同席させていただくことになりました。
某日、池袋のカラオケ館に集合！！
取材入ってます
到着した時すでにスタッフの方がいて、当初は一緒に歌う方だと思いました笑
今回の取材は、JOYSOUNDさんのカラオケ「うたスキ動画」を
うまく利用している人に密着！という感じでした。
カラオケで動画をとってそのサイトにアップできるサービスです。
それだけにはとどまらず、
他の人が撮った動画に重ねて一緒に歌うことができる「コラボ」という機能があります。
ちなみに、まちさんとはこのサイトで出会いました！
ギタナビはこんな画面
うーん、わかりづらいですが、こんな感じ。
カメラマンさんの後ろ姿
うたスキ動画のカメラ
サイトでも確認できますが、その場で見ることもできます！！
店によってカメラが上側にあったり、腰ぐらいの位置にあったりします。
今回は上側ですね！
どんな風に編集されてるんだろう。
楽しみです！
告知に使われた画像
【予告】9月13日（土）朝10:00～、BS-TBS「グローバルナビ フロント」にて、エクシング（JOYSOUND）のカラオケ戦略について紹介されます！ユーザーさんにも密着取材！予告映像⇒bs-tbs.co.jp/globalnavi/ pic.twitter.com/RUQ0PmcwL4
順位を表示したけれど、なんかデザインがぱっとしないのよねぇ。。。
以前も利用させていただいた
プラグイン不要！WordPressのページャー（ページネーション）機能を簡単に実装する方法
の記事を利用。
なのに表示されない。
なぜだーなぜだー。と
の方法でやり始めた時に、気が付きました。
そもそも記事が１０件ないからページャー表示されない！！！
ぬぉ・・・また、こういう事ではまってしまった・・・
表示件数を４件にしたらあっさり表示されました。
それと、このサイトはWordPressのデフォルトテーマtwentwelveを改造して作っているので、
もともとも入っていた
twentytwelve_content_nav関数は削除しました。
他のサイトでFBのリンクを貼るために、
作成。
参考にしたのは、
フェイスブック ページのウォールをホームページに埋め込む方法
話はそれますが、FBのタグ付けの仕組みがよくわからず悪戦苦闘。
友達限定の友達がアップした写真に、公開設定のアカウントでタグ付けされたらどうなるんだろう？
TLには流れないんだろうか。
結局流れなかったんだけどね・・謎。
別サイトでインスタグラムの一覧を作りたくて、WEBSTAGRAMを利用したけれど、
あれいれると、ものすごーく重くなる。
以前、重くて重くて困っていたら、これが原因という記事を見つけて、削除したら治りました。
でも数ヶ月してまたチャレンジしてみたけど、やっぱ重いや！
そこで、WordPressのプラグインを利用！
WordPressでInstagramのギャラリーページを作る方法
を参考に
今日はなんだかいまいち調子がでなかった。
そういう日もある。
そう思って帰るんだけど、外ものすごい豪雨だよ。
いままで、いろいろなサイトを見ては、どうやってこんな機能作るんだろ。
と思っていましたが、
WordPress始めて思ったこと。
ほんと、簡単にいろいろ作れるようになってるんですねぇ・・・
使い方は
を参考にしました。
本当にいろいろ載ってますね。これ。
で、完成したのがこんな感じ。
このサイトは、とくにサムネイルがあるわけではないので、これでよいとして、
他のサイトで、サムネイルを表示したいものがあったので変更しました。
いつも、どこで何を変更するのか迷ってしまいますが、
私は、サムネイルを表示したかったので、どこでやるんだよーーーと探したら、
「表示する数」「時間間隔」「並べ替え順」「タイトル短縮」「抜粋」の設定はこちらですね。
表示したいサムネイルのサイズ入力もここです。
一生懸命スタイルシートいじってしまいましたよ。
こんなかんじで完成です！
ちなみに、
WordPress Popular Postsでサムネイル画像付き人気記事一覧の表示方法
を参考にしました！
いやはや、本当簡単ですねぇ〜。
本日予定していたものはほとんどできなかったなぁ・・・
・if文を使ってカスタム投稿が未入力時に項目ごと非表示にする、もしくは空欄で表示方法をまとめる
はできた。
あとは、
結構記事を投稿したなぁ。
記事作成中にスペースに使える特殊文字を表示できなくてあくせくしました。（結局わからずじまい）
そして、今さっき
カスタム投稿タイプのパーマリンクを設定するプラグイン
Custom Post Type Permalinks をインストールして、日報は
/%year%/%monthnum%/%day%/
として年月日表示にしました。
なんだかんだで沢山のプラグインを使うんだよなぁ〜
タイトルの日本語が果てしなくわかりづらいですね。
ごめんなさい。国語の偏差値２ですので、ご了承ください(´；ω；｀)ｳｯ…
さて、お仕事で
カスタムフィールドを未入力のまま登録されると、デザインが崩れてしまっておりました。
そのための対応方法です。
例えば、
「果物：りんご」の「りんご」の部分がカスタムフィールドの場合
「果物： 」と表示するか、「果物：」の行すら出力しないかってことです。
「（行すら出ない）」のパターンですね。
未入力の場合は・・・・
「if文」ですね。きたーーー！！！！苦手なif文だ！！
まずは、参考サイトがないかググってみる。
ありました。
WordPress｜カスタムフィールドで値無記入の場合、項目非表示。
フリーランスWEBデザイナーの仕事
<?php if(get_post_meta($post->ID,'wpcf-fruit',true)): ?> <div class="fruit">果物：<?php echo get_post_meta($post->ID,'wpcf-fruit',true); ?></div> <?php endif; ?>
なるほど。タグごとif文で囲ってしまえばいいんですね。
「果物： 」のパターンですね。
基本的にこういった場合２パターンあると考えられます。
min-heightを指定すればデザインが崩れずにいけるかなと思った私は、
デザイナーさんに確認してみました。
すると
「height系で調整の場合、ブラウザでフォントサイズを大きくされると崩れる危険がある」
とのことでした。
なーるーほーど！！！！
なので、
「「& nbsp;（←余白は抜いて記載）」を入れる」で処理することにします。
コードは
<?php if(post_custom('fruit')): ?>
<li><?php echo post_custom('fruit'); ?></li>
<?php else: ?>
<li><?php echo ' '; ?></li>
<?php endif; ?>コピペしていると何気なく使っちゃってるんですよね。
日本語CODEXではヒットしないようです。
指定したキーに対して入力した値が1つだけの場合
参考サイト→カスタムフィールドの指定したキーの値だけ表示する方法
に使えるようなので、get_post_metaで書きなおしましょう。
<?php if(get_post_meta('fruit')): ?>
<li><?php echo get_post_meta('fruit'); ?></li>
<?php else: ?>
<li><?php echo ' '; ?></li>
<?php endif; ?>ですね。
↑をそのまま表示できなくて（空白になる）苦戦してしまった・・・
結局あきらめて、＆の後に半角スペースいれました(´；ω；｀)ｳｯ…
改行がうまく反映されずにぐぐっていたらドンピシャな記事がありましたので
リンク貼りますね。
WordPressでカスタムフィールドの改行を反映して表示させる
まちいろ
PHPを全く知らずに入ったものからすると、当たり前ですが、初耳〜
そもそもなんて読むの？と思ったらあるもんですね。
えぬえるつーびーあーる
nlはnewlinesの略、brはbr要素(break)。読み方プロトコル
<?php echo nl2br(get_post_meta($post->ID,'フィールド名',true)); ?>
とはいえ簡単で、これだけでちゃんと表示されます。
初心者の私からすれば、エスケープ処理自体まだなれない。
そんなこと言ったら、カスタムフィールドすらまだ慣れてない笑
そこにさらに、改行のコードが入る〜〜〜！！！
PHPってそもそもどうやって書くのーーーー！！！！！！！！！
私「なんていうか、どんどんコードが入れ子になるんですけど(´；ω；｀)ｳｯ…」
先輩「PHPの文法自体は問題ないっす！！！」
とのことでしたので。
<?php echo nl2br(esc_html(get_post_meta($post->ID,'フィールド名',true))); ?>
でOKです！
改行とエスケープ処理を入れ替えると
<br /> <br />
が表示されちゃいますので、順番が大事です！
WordPressは、画像をアップロードすると自動的に3種類の大きさの画像が生成され、
記事の本文に挿入する時に大きさを選択する事ができます。
当初はこれすらも意味がわかりませんでした・・・
管理画面から、上記の3種類のサイズを調整することも可能ですが、
functionsに新たに違うサイズを生成する方法をご紹介します。
これを使えばいくらでも増やしていけます。
後ろの方にプラグインでなんとかする方法もあるので、
手っ取り早い方が好みの方はそちらへ。
たとえば、横600、縦200のサムネイル画像を追加で作りたい場合。
functions.phpに
//自動作成する画像サイズ
add_image_size('size600_200',600,200,true);と記載します。
（）内のパラメータは
「’画像サイズを示すキーワード（好きなやつ）’,’横幅’,’高さ’,’画像の切り抜きを行うか否かを指定’」です。
詳しくはWordPressのCODEXで。
と言いつつも、最初の頃はこのCODEXがとっつきにくくて苦手でした笑
画像の作成ができたので、今度は出力ですね。
出力したいテンプレートに
<?php the_post_thumbnail('size600_200'); ?>でOKです。先ほどつけた名前を書いてあげて呼び出します。
今になって思うと、そんなに難しい事ではないんですよね。
さて、新しく画像サイズを生成するので、今までアップロードした写真は
再度アップロードしなければいけなくなります。
が、量によっては大変。という時に、便利なプラグインがあります。
「Regenerate Thumbnails」です。使い方はググってください。
記事の最初に細長の画像があるサイト多いですよね。
あんな目を引く画像をアイキャッチ画像といいますが、
これを勝手に生成してはたまた、記事のTOPに出力してくれるプラグインがあります。
勝手にはつくってくれませんでした・・・
twentytwelveを改造して作ったので、つい勝手にと・・・
１から作っている方は、functions.phpや表示したいテンプレートにコードを書く必要があります。（2014/09/11追加）
ちなみに投稿した画像の最初の写真を自動で持ってきます。
Auto Post Thumbnailというプラグインです。
こちらも使い方はぐぐってください。
参考サイトはこちら→新しい記事も過去の記事も全部自動でアイキャッチを作成してくれるAuto Post Thumbnail
過去の写真もちゃんと生成してくれますよ〜
なんでもプラグインで済ませられても、
こうしたい、ああしたいは尽きないんですよね。
私は、トリミングする場所をどうにか自分で調節できないかと思いぐぐってみました。
あるんですね笑
Post Thumbnail Editorというプラグイン
こちらも使い方はググってみてください。
参考サイト→サムネイル（アイキャッチ）画像のトリミング範囲を手動で決められるWordPressプラグインPost Thumbnail Editor
当初自分でサイトを作った時は、一番最初の方法で、functions.phpに追加して作成しましたが、
後に私のやりたかったことはAuto Post Thumbnailのプラグインで十分だったことに気づいてしまいました笑
いままで、みんななんでこう上手にサイトを作れるんだろう。と思っていましたが、
こういったプラグインをうまく使えば、それなりに出来上がるものなんだなぁ。
というのが、プログラマになって半年たち思うことでございます。
思ったより簡単！WordPressのサムネイルを別サイズも含め作り直す方法！！
LIG