ゆくゆくは本番サーバへ移行する際のための投稿記事でのリンク先記述方法

WEBサイト作成時にありがちな途中でURLが変わる時

過去記事をこつこつとアップしたけど、全部現サーバのリンクになってる

現テストサーバのリンクになってるのを、結局またあとで一つひとつ変更しなきゃいけないのかしら。
と、
既存のサイトから新サイトを作る時に素人の私は不安だった。

フィルターフックを使う

フィルターフックとは

参考にしたサイト
WordPressカスタマイズの幅が劇的に広がる、フィルターフックとアクションフックの使い方

ふむふむ、思ったほど難しくない。
フックに指定したものを実行した時に、自分が用意した関数を実行させる。

contentを読み込んだ時に、サイトのURLを変えたい!

そんな時は、

functions.phpに以下コードを記載

add_filter( 'the_content', 'replacehost');

function replacehost($content) {
    return str_replace('%SITEURL%', site_url(), $content);
}

で、現在記事中に「http://◯◯◯」ってでてる所には

%SITEURL%

に置き換える。

すると、the_content()を読み込む時に自動で
%SITEURL% → http://◯◯◯
に変換。

あとでホスト名が変わった時も、WPのsite_url()関数の出力によって
置き換えられるのでいちいち記事を修正しなくてもよくなります。

なるほど!

どうしてもカスタム投稿タイプの年別ページ作れなかった〜〜

クライアントもすでに確認中だし、新たに開発環境作った

年別アーカイブページいろいろとがんばってみたけど、
すんなりいかない&
クライアントもすでにテストサイトをチェック中なので、
新たに開発環境作ってもらって、実装してみる。

ついでに、CSSも変える。
実はこのサイト、私の人生初のWordPressサイトなんだもの。

いろいろ修正する!

成長してるとよいな。

台風すごかった〜。カスタムフィールドプラグインを変更!

本日は台風の為、自宅勤務。
こういうことができるのもこの仕事内容と会社のおかげだなぁ・・・

カスタムフィールドの日付から年別アーカイブを作る所で
どうしてもプラグインTypesだとできそうもなく、
急遽違うプラグインで試してみた。
使ったのはAdvanced Custom Fields

参考にしたのはこちら
Advanced Custom Fieldsの日付がサーバ環境で表示されない

そうしたところ、ちゃんと表示された。
うーんTypesのやろう。

ただ、今度はdate.phpが表示されないよ。
またかよ・・・

参考にしたサイト

WordPressプラグイン「Advanced custom field」の基本的な使い方と用例

カスタムフィールドの日付から年別アーカイブリストを作成

うたスキ動画21位!会員なったよー

前回の部活動画は今のところ21位

utasuki
前回の部活でとった動画が
今の所総合ランキング21位にいた!!

人気動画-うたスキ動画:うたスキ|JOYSOUND_com

と、いってもあれです。
撮ったの部活の日の動画だけど、この動画、私歌ってないー笑
(一番後ろの方で譜面操作してるんだぜ!)

投稿者もまちさんになってまでしょ。
そなんです、ハモリ用の動画や楽器演奏の動画がランキング上位ににきやすいぽい。
私もglobeのマークを歌ってる人探したりしてますし。

私の歌もハモってもらいたい

ハモってもらいたいといってもハモリができない(´;ω;`)ウッ…

ということで、globeのマークパートをやってもらうのを目標に
ついにうたスキ動画、有料会員になってもた!

マークさんよろしくお願いします!!

今日もあと5分だ。カスタムフィールドで投稿できるようにカスタマイズ

ベタ打ちHTMLだと私以外の人と共有するのはさすがにやばいな。と思い、
急遽カスタムフィールド作って作成。

wordpress カスタムフィールドテンプレートでチェックボックスを利用して画像を表示する
これを参考にしたけど、どうしてもできなくて

チェックボックスからラジオボタンに変更笑

その後は、
カスタムフィールド作った日付で年別アーカイブページを作りたいけどつまずき中

WordPress でカスタムフィールドの日付から年別アーカイブリストを作成する

を参考にしたけれど、
そもそもの前提である
カスタムフィールドの値の書式は ‘yyyy年mm月dd日’。
は、どうしたらいいんだ?
てつまずいてます。

最初か最後に年4桁がきてるわけじゃないんだね。
また次回に。

あと5分で日報かかなければ〜〜

自分だけの日報だから、書かなくてもOKだけど、
一度休んだらたぶんずっと休む笑

本日は
・サイドバー表示崩れ改修
だけ完了!

その他、
あるタームのカスタム投稿タイプ記事一覧と、同じタームの固定ページを記載したいのに、
うまくいったようで、あとからおかしくなってしまった・・・

カスタム投稿タイプの
ページ送りもおかしいし。

単純なカスタム投稿タイプのページ送りは無事表示

単純なカスタム投稿タイプのページ送りは無事表示

なんでつぎからつぎへて難しいことが・・・

固定ページと共通のタームをもつカスタム投稿タイプ記事一覧だすのが難しかった

teblepressは結構使えそう!

ガーデニングサイトの栽培スケジュールを何でつくろうと探してる時に
見つけたプラグイン「teblepress」。
やり方をググって背景色を指定することによって、栽培スケジュールを作ったけれど、
背景色の指定が結構面倒くさいな。
アボカド___ぽちのベランダガーデニングとビオトープ 2
今後、作ってく上で、毎回
この行この列のセルに色付けって何個もやるのが・・・

もっといい方法ないかしら。

固定ページが属してるタームの記事の取得

今日は、ここでだいぶつまずいた。
固定ページとカスタム投稿タイプ共通のタームがあって、
固定ページと同じタームのカスタム投稿タイプの記事を表示したかったけれど、
tax_queryのtermsの指定がなかなかできなかった。

WordPress PHPで現在表示しているタクソノミーIDを取得しtax_queryでカテゴリーを絞り込み、表示する方法
の記事を参考にしてなんとか表示。

それと、query_postsでなく 参考書みながらWP_Queryでやろうとしたけれどうまく表示できなかった。
理由はまたこんど考える。

固定WIKIページのデザインはこんなかんじになった。
アボカド___ぽちのベランダガーデニングとビオトープ

カスタムフィールドを使って投稿画面のカスタマイズをした

相変わらず、本日の予定が消化できないわ。

今日はホームページの更新作業もろもろ忙しかったかな。

Advanced Custom Fieldsを使ってオリジナル投稿画面作成

ガーデニングサイトのWIKIシングルページを作るにあたり、
カスタムフィールドを利用することに。

プラグインはAdvanced Custom Fields
これ、結構使いやすいかも。

使い方は下記サイトで

Advanced Custom Fieldsを使って、wordpressの記事入力項目を作り替える

tontotakumi.com

これ見て、すんなり表示されることは確認できたので、
CSSは次回。

ちゃんと吐き出せた

ちゃんと吐き出せた

自分で書いた記事「WordPressでカスタムフィールド内の改行をそのまま表示させる」も
すっかり書いた事忘れてたけど参考になった。
ブログ役に立ってる!!

それと、固定ページにするか投稿ページにするか悩んだ。
当初は投稿ページと思ったけれど、そうするとsingle.phpを使うかカスタム投稿タイプになるかで
何もひっかからないときにsingle.phpが表示されるけど、
そういうデフォルト系のデザインになる予定もさらさらなく。

wikiだし固定ページでいくことにしました。
なんだか、投稿ページを全く使わなくなりそうだ。

サーバに接続できなくなった時にまずすること

コマンドまわり、まだまださっぱりです。(ヽ´ω`)
まだまだよくわかってない状況で書いてるので間違いがあるかもしれません。

サーバに接続できなくなったと言われ、
まずこれをやりましょうと教えてもらいました。

  1. ssh でログイン出来るか確認
  2. psコマンドでapacheが起動しているか確認(コマンドは以下)
    ps ax | grep httpd

でました、コマンド操作。
そして今回もさっぱり。

そこでまた教えてもらいました。

概要図

概要図


すごい図ですね。さっと書いたらこうなっちゃいました。

えっと。
私のPCがあります。
遠い場所に繋がらなくなったサーバーがあります。(ここでいうとハードウェアと書いてあるところ)

ますは、遠い場所のサーバーにつながるか私のPCから確認します。
それが、

SSH

ssh [オプション] ホスト名 [コマンド]

ですが、
私の場合、.sshフォルダのconfigファイル内に情報を書いてあるので、

ssh ホスト名 

でいけるとのこと。

なので、ここが通っていることを確認してSSHはOK。

では、Apacheは?と次の確認にうつった模様。

ps ax | grep httpd

【 ps 】 実行中のプロセスを表示する

を参考にすると、

ps:実行中のプロセスを表示する
a:自分以外のユーザーのプロセスも表示する
x:シグナル形式で表示する

linuxのコマンドで、 ps aux | grep http  とはどういう意味なのでしょうか…

より、

パイプ【 | 】:コマンドの連結
grep:文字列を検索する

でApacheが起動していないことがわかったみたい。。

sudo を使った別の方法

root権限 はそのサーバーの中で一番強い権限
そこで使うのがsudo(ずっとスドーって読んでたけどスードゥーらしい笑)
それを使って中に入り

which service

をおこない

 service httpd staus

とすると
実行されていれば下記表示される。

httpd を実行中...

ちなみにhttpedに対応しているのがApacheのこと。

dはデーモンの意味で、
mysqlの後ろにもdがつく。うんぬん。とありましたが、細かいことはまたの機会に勉強しよう。

今回は、Apacheが動いていないことを担当の方に伝え対応してもらい無事解決。
原因はApacheアップデート時の設定ファイルに誤りがあったようです。

まだまだ、難しいな。

あ、そうだ。サーバーから抜けるときは

exit

と入力して出るそうです!
忘れそう!

コマンドの復習

さすがに何回もでてきて覚え始めてきたもの

cd(チェンジディレクトリ?):ディレクトリを移動する
cdのみだとホームディレクトリに移動

pwd(プリントワークディレクトリ?):現在のディレクトリの場所を確認する

ls:ファイルやディレクトリの情報を表示する

タクソノミー一覧とWIKIページ作成

本日の予定、また全然やってないわ・・・

先週とちゅうまでやったタクソノミー表示のCSS調整

「,」を最後つけないのができなかった

「,」を最後つけないのができなかった

親一つ、子供が数個って時の表示方法はぐぐってコピペ。

[WordPress]カスタムタクソノミーに親子関係(階層)を持たせ、複数選択したタームの並び順を親>子の順番に表示する

それでもエラーが表示されるので、
それまたググって、↓arrayで対応

PHPのforeach文でnullチェックなしでエラー回避

ぐぐると9割はヒットするね。

wikiはまたもやbootstrapを利用

CSSでいつもつまずく

CSSでいつもつまずく

あ、なんでul liタグつかわなかったんだろう。と後からやり直しした。

そして、植物の前にフリーイラストいれたかったけど、どうもうまく入らなくて飛ばした・・・

少しずつ分かってきてる事実感した一日ε-(´∀`*)

経験値が増えてきた感じがする

・投稿時にツイッターへ自動POST設定
WordTwit Twitter Pluginプラグインを使って実装完了!
なぜか、実装したかったサイトにはうまくいかず、他のサイトで試したらすんなりOK。
なので、あまりイライラせず、プラグインを再インストールしたり
ツイッターをログインしなおしたりしていたら無事できました。

・カスタム投稿タイプ別にサイドバーに新着記事5件表示
こちらもそれなりにすんなり実装完了
ついでにWordpress Popular Postsプラグインを使って人記記事も表示PLANTS___ぽちのベランダガーデニングとビオトープ

ただ、困ったことに表示が崩れる・・・
twentyywelve使ってるのに?何か大事なの消しちゃったかしら。
PLANTS___ぽちのベランダガーデニングとビオトープ
とりあえず、後回し。

あとは各タクソノミのターム表示
ついにハイビスカスシンデレラも咲いた!___ぽちのベランダガーデニングとビオトープ
CSSで整えてないけど、
結構スムーズに表示できて自分で感動してしまった。

参考にしたサイト

LIGさん
WordPressで投稿した記事のカスタム分類(タクソノミー)からタームの親を取得する
array_popとarray_shiftを知ることできてよかった!

新サイトオープンした!途中だけど!

新サイトオープンまでこぎつけた

いままでは、誰も見ないだろうと、検索可のまま構築していたけれど、
今回は手強いと思ったので検索できないようにして構築。
それでも途中だけれど。本格的にスタートだ!というわけで旧ブログ削除。
思えば、ブログから画像の引っ越しができなくて手作業でやったなぁ・・・

さて、今日の作業

ナビゲーションを中央に

ネットサーフ中に見つけた写真でーんのデザインを見て
TOPページのデザインも変更

昔の庭写真見てたら懐かしくなった

昔の庭写真見てたら懐かしくなった

参考にしたサイト
大きな背景画像を使った魅力的なWEBサイトをつくろう
WEBクリエイターボックスさんにはほんと、お世話になってます。

ナビゲーションを真ん中には
[CSS]レスポンシブ対応、ナビゲーションを水平の真ん中に配置するテクニックのまとめ
から「position:relative」を利用させていただきました!

久しぶりにwacomでお絵かき

本当はもっとイラストの勉強したいけどそうもいかず・・
だって、ペンタブレットつなげるのに時間かかってるレベルですから・・・

pochigardenlogo2
うさぎだけ新しく描き変えました。は は ははははは

プラグインをちまちまインストール

PHP Code Widget
Wordpress Popular Posts
WordTwit Twitter Plugin
wp-jquery-lightbox
WP Social Bookmarking Light
を追加
WordPressで記事投稿すると自動でPOSTするのがうまくできなかったので明日以降に。

taxonomy.phpの山を越えて整ってきた

予定していた事、全くやらなかったな・・・
ま、いっか。参考書は結構読めたし。

taxonomy.php作成

無事に表示

無事に表示


ずっとarchive.phpが表示されていて、なんなんだよーと思ったら
ただのスペルミスでございました。
ぽちさまベランダガーデニングとビオトープ___理科好きの観察日記
デザインも少し変えてみた。
が、ナビゲーションが中央にいかない。
これ、前もつまづいた気がする・・・
そして相変わらずどう対応したか覚えていない涙

基礎:WordPressに必ずでてくる if(have_posts()): とは

if(have_posts()):何個カッコつければいいんだけ〜〜って思っていたあの頃

if文を理解してからの次のステップ!

if文を軽く前回倒したので、きっとこの意味がわかるようになるのでは、
と思ったら、本当にわかるもんですね。

まずはWordPress内によくあるコード

<?php
if(have_posts()):
   while (have_posts()): the_post();
?>
・・・略

でたでたでた。やたらポストポストいってる感じの笑
これを見た時にWordPress無理って思った頃が懐かしい。

さて、まずはifから

<?php
if(have_posts()):?>

if後の括弧内が条件だから、「もし、表示する記事も持ってたら(記事があったら)

while文

これも結局if文に似ていてifが「もし条件にあったら」なら
whileは「もし条件にあったらそのあいだずっと」です。

なので、

while (have_posts()):

は「記事を持っていたらその間ずっと

では最後のthe_post()はなんなの?

これは今、本を読んでへぇ〜ってなってるんですけど、

処理対象の記事を1つ先に進める。ということらしいです。
1つ。だから単数形のpostなのか。
これがないとひたすら同じ記事を出力してしまう。なので、大事なんですね(今更)

ながれとしては、
記事あるのかなー?
あるならずっとこれやってよ〜
ちなみに1つずつずれてね〜

ってことかな。

清書。

<?php
if(have_posts()):
   while (have_posts()): the_post();

  繰り返して表示されるコード

 endwhile; ←whileの繰り返し終了
else: ←ifに対応して条件以外の時

  表示する記事がない場合のコード

endif; ←ifの終了
?>

さっさと慣れて覚えちゃう方がラクそう!

参考にした本


なによりうれしいのは、この本を読んで理解できるくらいのレベルにはなったっていうことがとにかくうれしい!!
(当初、この本わからすぎて違う本に移行した)