Pocket

こんにちは、@taichi_kimuraです。

ACFの柔軟フィールドで投稿一覧を取得して出力しようとしたら、posts_per_pageが効かなかったので、忘備録。

今日は時間がないので、結果だけ書いておきます。

codexにある普通のループに表示される投稿数を指定する。

<?php
//パラメーター
$paged = (int) get_query_var('paged');//ページ送りをする場合
$args = array(
  'posts_per_page' => 6,//表示件数
  'paged' => $paged,
 );

// The Query
$the_query = new WP_Query( $args );
$the_query->post_count = 6; //表示件数
// The Loop
if ( $the_query->have_posts() ) {
	echo '<ul>';
	while ( $the_query->have_posts() ) {
		$the_query->the_post();
		echo '<li>' . get_the_title() . '</li>';
	}
	echo '</ul>';
	/* Restore original Post Data */
	wp_reset_postdata();
} else {
	// no posts found
}
Pocket

Pocket

こんにちは、@taichi_kimuraです。

子テーマつくっててふと気になったので調べたのでまとめておきます。

get_template_part()の使い方

まずはおさらい。

├ page.php
├ parts.php
├parts-content.php
└ pagelist
├ mag.php
└ mag-big.php

のような状態での場合、

page.phpから各テンプレートを呼び出すときは、順に、

get_template_part(‘parts’)
get_template_part(‘parts’,content’)
get_template_part(‘pagelist/mag’)
get_template_part(‘pagelist/mag’,’big’)

の様に記載していきますね。

子テーマのから親テーマのテンプレートを呼びたいときはどうするか

はい。今回の主題です。

get_template_part(‘parts’,content’)の場合、要求順序は、

  1. 子テーマのparts-content.php
  2. 親テーマのparts-content.php
  3. 子テーマのpatrs.php
  4. 親テーマのparts.php

の順番で呼び出します。

なので、上書きしたかったら同一ファイル名でパーツテンプレートを作ればいいですし、

親テーマのパーツテンプレートを使いたければそのまま呼び出せばいいですね。

ちなみに、ツリー構造を書くときにいちいち「けいせん」って入力して変換してられないので、

AsciiTreeってツールが便利です。

https://codogue.com/asciitree/

Codogue [コドーグ]さんありがとう。

Pocket

Pocket

こんにちわ、@taichi_kimuraです。

ローカルでのサイト開発環境に、Local by Flywheelを利用してるのですが、アップデート後起動できなくなってしまいまいました・・。

起動すると下記の様にエラーが何度も出ます・・

「Uh-oh! we ran into a hiccup when trying to start the local machine」・・

Local by Flywheelが動かないの エラー画面2

Local by Flywheelが動かないの エラー画面1

Local by Flywheelが動かないの エラー画面3

エラーの内容から、VirtualBoxが起動できないって書いてあるので、VirtualBoxの状況を確認してみました。

VirtualBox

VM Virtual Boxマネージャーで起動しようと思っても、起動せず・・

なんでだろうと思って調べてみると、セキュリティソフトが問題でした。

Local by Flywheelが動かないのはtrusteerエンドポイント保護のせいでした

下記のドキュメントを見つけ解決しました。

Local doesn’t work after update

同様の現象の人、いましたね。

下記手順でtrusteerエンドポイント保護のアンインストールを行えば即解決です。

Windows 10でのRappportのアンインストール

 

誰かのお役に立てれば幸いです。

Pocket

Pocket

皆様、ウェブサイトのSSL化進めてますか?

聞くところによると不安を煽るような電話営業も流行ってるみたいですね・・。

さて、いくつものサイトをSSL化しているのですが、今回ちょっとつまずいちゃいました。

アウトプットしないとすぐ忘れるので記載しておきます。また、SSL化すべき理由については今後記事にしていきたいとおもいます。

WordPressのSSL化手順

サーバーによって様々ですが、メジャーなXserverやLolipop等だと、「無料」かつ「簡単」にSSL化できます。

SEOのためにもなるべく早めにSSL化しましょう。

WordPressのSSL化 事前準備

wordpressやプラグインを最新の状態にして、必ずバックアップをとっておきましょう。

バックアップは個人的に「All-in-One WP Migration」が最強だと思ってます。

無料だと512MBまでしかバックアップできないので、それ以上の容量の場合は、「Unlimited Extention」を購入しましょう。

$69しますが、それ以上の価値のあるプラグインです。

バックアップしたら、レンタルサーバーの管理画面からSSL化しましょう。

Lolipopの場合

Xserverの場合

証明書を購入したりする場合はそのマニュアルに従います。

https://ドメイン でサイトにアクセスできたら次に進みます。

WordPressのURL設定

WordPressの管理画面の「設定」>「一般設定」に進みます。

一般設定内の「WordPress アドレス (URL)」と「サイトアドレス (URL)」をhttpからhttpsに変更します。

wordpressのURL設定

WordPress記事内の内部リンクをhttpsに書き換える

wordpressのURLを変更したことで、記事やページのURLは変更されましたが、今まで書いた記事に記載されている内部リンクURLや画像URLは変更されません。

リンク切れがあると読者やgoogleに対して都合が悪いので、URLを変更します。記事ごとに変更していくのは到底無理なので、データベースの情報を置換してくれるプラグイン「Search Regex」を使います。

プラグイン>新規追加>「Search Regex」で検索、インストール、有効化します。

有効化が完了したら、ツール>Search Regex に進み、Search patternにhttpのURL、Replace patternにhttpsのURLを入力します。

Search RegexでURL置換

最初はSearchで検索して、問題なければReplace&Save(置換して保存)しましょう。

間違えるとやっかいなので、よくよく確認してから行ってください。

URLの正規化 リダイレクト設定

「http」のアドレスと「https」のアドレスはたった1文字「s」が入っているか入っていないかだけで、ドメインも同じでも、これだけでWEB上では別のアドレスだと認識されてしまいます。

サーバーにもよりますが、現段階では、「http」と「https」両方のアドレスにアクセスできる状況になっています。

.htaccessを利用して301リダイレクトする

index.phpがある階層に.htaccessファイルがあると思うので、以下を記述します。

RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://example.com/$1 [R=301,L]

上記を記載することで「http://example.com」というURLでアクセスすると「https://example.com」にリダイレクトされます。ちなみに、example.comの部分は自身のドメインに変えてくださいね。

リダイレクトを確認して、はい完了。

 

と、なるはずでしたがトップのスライダーや埋め込んだyoutubeが表示されません。

CDNのURLも確認する

結果からいうと、見出しの通りです。

jsを読み込む際のURLがhttpになってました。

使っていたのはSmart Slider 3 というスライダープラグインだったのですが、設定のせいだと思いわざわざ英語のドキュメント読んだりして、時間を無駄にしてしまいました。

ナウシカのミト爺のごとく「なぜじゃぁぁ、なぜ動かんのじゃぁ!!!!!」と騒ぐ前に、冷静に対処しましょう。

まとめ

  • SSL化は今後必須
  • 気を付けて確実に作業する
  • なにかあったらコンソール(F12)で確認

 

Pocket

Pocket

こんにちは。

皆さん張り切ってwordpressカスタムしてますか?

今日は使用している固定ページのテンプレートによる条件分岐についてです。

条件分岐タグを使った条件分岐

これはcodexにもある通りですね。

is_page_template()

<?php if(is_page_template()):?>
ページテンプレートが使われている場合の処理
<?php endif; ?>

特定のページテンプレートであれば、
例:page-templatesフォルダにあるabout.phpを使用

<?php if(is_page_template('page-templates/about.php')):?>
about.phpというページテンプレートが使われている場合の処理
<?php endif; ?>

注意点として、is_page_template()は、ループの外で使う必要があります。
今回はループ内で分岐させたかったので、別の方法を探します。
条件分岐タグについてはこちらを参照ください。

ループ内で条件分岐したい

もっと自由に、条件分岐したい場合は、
get_page_template_slug()を使ってみましょう。
get_page_template_slug()は適用されているページテンプレートのスラッグ(ファイル名)を返してくれます。

細かい条件分岐をしたいときに便利ですね。
具体例です。
通常のpage.phpと
page-templates/onecolumn-col10.php
page-templates/onecolumn-col8.php
という3種類のページテンプレートがあります。
テンプレートごとにクラスを分けたいのです。

<?php
$page_slug = get_page_template_slug(); //テンプレートのスラッグを取得
//テンプレートによる切り替え
//10カラムテンプレートの場合
if( $page_slug == 'page-templates/onecolumn-col10.php' ): ?>
<div class="col-md-10 offset-md-1">
<?php
//8カラムテンプレートの場合
elseif( $page_slug == 'page-templates/onecolumn-col8.php' ):?>
<div class="col-md-8 offset-md-2">
<?php
//それ以外
else:?>
<div class="col">
<?php endif; ?>

また、get_page_template_slug()は通常のpage.phpだと、空の文字列を返します。

今回、page.php以外の時としたい箇所がありました。
page.php以外の固定ページテンプレートでclassを追加する例です。

<?php
$page_slug = get_page_template_slug(); //テンプレートのスラッグを取得
?>
<div class="もともとのクラス <?php if(!empty($page_slug)) {echo '追加したいクラス'; } ?>">

codexに
get_page_template_slug( $post_id ) /en 関数は現在割り当てられているページテンプレートのスラッグを返します (ページテンプレートが割り当てられていない場合は空の文字列を、$post_id に該当する 固定ページ が無い場合には false)。ループ内、外に関わらず簡単に割り当てられているページテンプレートを調べることができます。
とあるのに、page.phpが空で返ってくるのに気づくのに時間かかっちゃいました・・




固定ページテンプレート(ページテンプレート)によって条件分岐まとめ

ループ外の場合:is_page_template()を使う。

ループ内の場合:
get_page_template_slug()でスラッグを取得して分岐させる。

いかがでしょう。今使わなくてもいつか使うかもしれないので、頭の片隅においておきましょう。

Pocket

Pocket

はい。

タイトルの通りです。

あるテーマでサイト構築しようと思い、デフォルトのTwenty Seventeenからテーマを変更したら、

HTTP500エラーで、カスタマイズ画面が開かなくなってしまいました。

ロゴも、色も変えられないし困る~、とテーマ制作者に連絡もしてしまいました。

wordpressで問題が発生したらプラグインを疑う

メールを送ったのち、ちょっと冷静になったら基本を思い出しました。

最近トラブルが少なかったので忘れてましたが、wordpressで問題が発生したら、まずプラグインを疑いましょう。

カスタマイズが表示されないときの対処法

サイトの状況にもよりますが、許されるならプラグインを全停止しましょう。

この状態でカスタマイズが表示されるかどうか確認します。

これで表示されない場合は、ちょっと大変ですがテーマを変えてみたり、wordpressをアップデートしてみたり、DBやファイルをバックアップして、原因追及してみる

プラグインを一つづつ有効化する

面倒であれば、信頼しているプラグインは複数個づつ有効化してもよいかと思います。

該当したプラグインの設定を見直す

もしくは代替えのプラグインを探してもよいかもしれません。

今回はそこまで重要なプラグインじゃなかったので、そのまま削除しちゃいました。

そんなプラグインは最初から入れない方がいいね。

まとめ

wordpressでトラブったらまずプラグイン。

復唱します。

wordpressでトラブったらまずプラグイン。

無駄に調べる時間を減らしましょう~。

 

Pocket

Pocket

現在ドットワンで制作させていただいているウェブサイトはすべてwordpressを利用しています。

ウェブサイトはなんといっても更新が大事で、SEOや見栄えの観点からもクライアントさんに納品後スラッグを英語に変更して公開するようお願いしてるのですが、忘れられてしまうことがほとんどです。

途中からURL変更するのもよくないので、初期設定で英語にしてしまうことにしました。

スラッグ名が日本語だったら、自動的に「投稿タイプ+id」に変更

もちろんスラッグを自身で設定した場合は適用されません。また、管理画面>設定>パーマリンク設定をpostnameやpost_id等に設定している場合に限ります。

サンプルコード

下記コードをfunction.phpに追加してみましょう。

/*
* スラッグ名が日本語だったら自動的に投稿タイプ+id付与へ変更(スラッグを設定した場合は適用しない)
*/
function auto_post_slug( $slug, $post_ID, $post_status, $post_type ) {
    if ( preg_match( '/(%[0-9a-f]{2})+/', $slug ) ) {
        $slug = utf8_uri_encode( $post_type ) . '-' . $post_ID;
    }
    return $slug;
}
add_filter( 'wp_unique_post_slug', 'auto_post_slug', 10, 4  );

動作

初期のまま

スラッグ名が日本語の記事を自動的にidに変更するよう設定する方法 初期のまま

上記コードを追加

スラッグ名が日本語の記事を自動的にidに変更するよう設定する方法 コードを追加

自分でslugを入力した場合

スラッグ名が日本語の記事を自動的にidに変更するよう設定する方法 自分でslugを修正

いかがでしょう。簡単ですね。

SNSなどに自動投稿している場合は、日本語スラッグですと呪文のようになってしまうので、ミス防止のためにも設定しておいたほうが良いと思います。

参考サイト

WordPress の投稿スラッグを自動的に生成する | Simple Colors

Pocket

Pocket

カスタム投稿タイプで新たな投稿タイプ作って、カスタムフィールドで内容を入力・表示させて、本文はおまけ、またはプラグインやテーマのフック用なんてこともあるかと思います。

子テーマなんか作ってると、the_content()は外せないけど、サブ的に利用したいなんてことも多いかと・・

そんな時本文の内容が空どうが判別して表示を変えたいですよね。そんな時にどうぞ。

<?php if(!empty($post->post_content)){ //投稿の本文があるかどうか調べる !emptyはお好みで
//ある時の処理
				echo '<h3>スタッフからのコメント</h3>';
				the_content();	//本文の内容
				}else{
                                the_content(); 
		}?>

これで表示を制御できますね。
頑張って思い通りのサイトを作りましょー。

Pocket

Pocket

wordpressプラグインでおなじみの、ACF(advanced Custom fields)

リピーターフィールド内のラジオボタンで、ラベルと値を出力しようとしてちょっと戸惑ったので備忘録です。

前提

まず、ACFのカスタムフィールドの設定は、

repeater_field_nameというリピーターフィールドの中に、btn_nameというラジオボタンのフィールドを設定し、

選択肢を、

3f : 3F
loft : ロフト
2f-only : 2Fまで

と設定しました。
で、「2f-only : 2Fまで」の時は値を表示しないようにしたかったのです。

上手くいかなかった出力方法

通常通りのリピーターフィールドとラジオボタンの出力のコードを書きました。


<?php
if( have_rows('repeater_field_name') ):
while ( have_rows('repeater_field_name') ) : the_row();
//ラジオボタンのデータを代入
$field = get_sub_field_object(‘field_name’);
$value = get_sub_field(‘field_name’);
$label = $field[‘choices’][ $value ];
?>

<?php if($value <> '2f-only'):?>
<p><?php echo $label; ?>
<?php endif;
endwhile;
else :
// no rows found
endif;
?>

これだと「Array」と表示されるだけ。まいったなぁと思ったときは頑張ってDocumentationを確認しましょう。

上手くいった出力方法

調べてみたら、get_sub_field_objectは、has_sub_fieldループ内で使用する必要があるようです。

なので、次のようにコードを修正。


<?php
if( get_field('repeater_field_name') ):
while ( has_sub_field('repeater_field_name') ) :
//ラジオボタンのデータを代入
$field = get_sub_field_object(‘field_name’);
$btn_value = $field['value'];
$value = $btn_value['value'];
$label = $btn_value[‘label’];
?>

<?php if($value <> '2f-only'):?>
<p><?php echo $label; ?>
<?php endif;
endwhile;
else :
// no rows found
endif;
?>

ここまで至るのに諸々ありましたが、迷ったときはprint_r()関数で配列を全て出力してみると糸口をつかめます。

出力した配列

Array
(
[ID] => 6024
[key] => field_58e4c643fc29f
[label] => 3F または ロフト
[name] => repeater_field_name_0_field_name
[prefix] => acf
[type] => radio
[value] => Array
(
[value] => 2f-only
[label] => 2Fのみ
)

[menu_order] => 3
[instructions] => 3階建てまたはロフトをお選びください。
[required] => 0
[id] =>
[class] =>
[conditional_logic] => 0
[parent] => 6020
[wrapper] => Array
(
[width] =>
[class] =>
[id] =>
)

[_name] => field_name
[_prepare] => 0
[_valid] => 1
[choices] => Array
(
[3f] => 3F
[loft] => ロフト
[2f-only] => 2Fのみ
)

[allow_null] => 0
[other_choice] => 0
[save_other_choice] => 0
[default_value] => ロフト
[layout] => horizontal
[return_format] => array
)

誰かのお役にたれてば幸いです。

参考:ACF Docmentation

Pocket

Pocket

プラグインアップデート中に、

「Briefly unavailable for scheduled maintenance. Check back in a minute.」

のメッセージがでて、サイト側も管理画面側も使えなくなってしまいました・・

どうしよう!って慌てずにgoogleに聞きましょう。

原因は「.maintenance」というファイル

wordpressのディレクトリ内に上記ファイルがあると思うので削除しましょう。

.maintenance

アップデート中に作成されるファイルですが、画面遷移やアップデートの失敗でファイルが残ってしまうことがあるようですね。

消してサイトが適切に見れればOKです。

お疲れ様でした。

 

Pocket

Pocket

最近のサイトは運用を考えて、ほとんどACFでカスタムフィールドを作って納品してます。

が、カスタムフィールドの値がプレビューに反映されないことが判明しました・・。

それじゃ困るので、早速検索。

親切な人がコード書いていてくれました~

function.phpに下記を記載

/*-------------------------------------------*/
/*  カスタムフィールドもプレビューできるようにする
/*-------------------------------------------*/
function get_preview_id($postId) {
    global $post;
    $previewId = 0;
    if ( isset($_GET['preview'])
            && ($post->ID == $postId)
                && $_GET['preview'] == true
                    &&  ($postId == url_to_postid($_SERVER['REQUEST_URI']))
        ) {
        $preview = wp_get_post_autosave($postId);
        if ($preview != false) { $previewId = $preview->ID; }
    }
    return $previewId;
}

add_filter('get_post_metadata', function($meta_value, $post_id, $meta_key, $single) {
    if ($preview_id = get_preview_id($post_id)) {
        if ($post_id != $preview_id) {
            $meta_value = get_post_meta($preview_id, $meta_key, $single);
        }
    }
    return $meta_value;
}, 10, 4);

add_action('wp_insert_post', function ($postId) {
    global $wpdb;
    if (wp_is_post_revision($postId)) {
        if (count($_POST['fields']) != 0) {
            foreach ($_POST['fields'] as $key => $value) {
                $field = get_field($key);
                if ( !isset($field['name']) || !isset($field['key']) ) continue;
                if (count(get_metadata('post', $postId, $field['name'], $value)) != 0) {
                    update_metadata('post', $postId, $field['name'], $value);
                    update_metadata('post', $postId, "_" . $field['name'], $field['key']);
                } else {
                    add_metadata('post', $postId, $field['name'], $value);
                    add_metadata('post', $postId, "_" . $field['name'], $field['key']);
                }
            }
        }
        do_action('save_preview_postmeta', $postId);
    }
});

ネタ元はコチラです。
[WordPress]カスタムフィールドの値もプレビューする

Pocket

Pocket

結構お世話になっている、MapPress Easy Google Maps。Pro版も何度か使いましたが、あるサイトでmapが表示されず焦ったので備忘録。

現象

枠だけでて表示されない。↓こんな感じです。

mappressが表示されない

確認事項

まず、確認ですがgoogle mapを表示させるためには、API登録が必要になってます。サイトの登録ミスやキーのミスがないか確認します。まぁ、ここにミスがあると記事へ挿入段階でうまくいきませんが・・。

やったこと

googlemapの呼び出しだけうまくいってないようでしたので、googlemapそのものはjavascriptで呼び出しているので、その確認をします。

MapPressの設定画面を見てみると、ありました。「Output scripts in footer」と。scriptをヘッダーではなくfooterで呼び出しているんですね。

Output scripts in footer

スクリプトの順番のせいかな~。これで解決とチェックを外して確認すると、まだ表示されない・・どうしましょ。

 

あれこれやる前に基本に戻ってちょっと考えます。

プラグインが正しく動かない場合は・・・他のプラグインを止めてみます。

MapPress Easy Google Mapsと相性の悪いプラグイン

僕の場合は以下でした。

  • Head Cleaner

とりあえず、停止で対応しちゃいました。

慌てる前に冷静に基本的なことを考えないとですね。

他にもあったら教えてください。

Pocket