WordPress 一括置換出来るプラグイン「Search Regex」

WordPress 全記事から検索して一括置換出来るプラグイン「Search Regex」です。
大量の投稿がある場合で、例えば電話番号など変更したいという場面など、一記事ずつ修正していたのでは、いくら時間があっても足りません
そんな時に「Search Regex」が活躍できるはずです。

■一括置換できるプラグイン「Search Regex」
Search Regex

■使い方
Search Regexのツールメニューの「Search pattern」に置き換えたい文字列を、「Replace pattern」に置き換え後の文字列を入力して、
Replace & Saveを押すだけで、一括置換を行ってくれます。

■Searchボタン

置き換える文字列の含まれるものを検索します。

■Replaceボタン

置換後の名用の確認

「Replace & Save」ボタン

一括置換したデータを保存します。

トップページのSEO設定方法

SEO設定はプラグイン「All in One SEO Pack」を利用するのが一般的です

WordPressのダッシュボードからAll in One SEO Packを開きます。

トップタイトルを書き換えはホームページ設定の
■タイトル
タイトルで設定したキャッチフレーズ-サイトタイトルが検索結果やSNSなどに表示されます。

■メタキーワード
ここでは、サイトの内容に合致するするキーワードを半角「,」(カンマ)区切りで入力します。

■メタディスクリプション
サイトの内容を要約した説明文を入力します。

全ての記事においてSEO設定が必要となるかどうかは、サイト内容や記事内容によります。検索エンジンにキーワードを入力して情報を求めている方々に届きやすくなるので必要な部分は設定しておいたほうがよいでしょう。

WP サイト公開を一時的に中止

「サイト全体や一部を一時的に非公開にしたい」など、サイト制作をしているうえでよくある場面だと思います。
また、確認用に、ログインしている状態では管理者がサイトを閲覧できるように、外部の人間にだけ見えないようにしたい場合、
プラグインのWP Maintenance Modeを使用すると簡単に実現が可能となります。

■WP Maintenance Mode
プラグイン → 新規追加 → WP Maintenance Mode の検索からインストール、有効化で、追加します。

WP Maintenance Modeの設定からプラグイン有効化を選択するとサイト全体を非公開にすることが可能です。

■wp maintenance mode の使い方
管理者リンクではログイン画面へのリンクを表示するかですが、一般ユーザーにもログイン画面が表示できてしまうのでoffにしておいたほうがよいでしょう。

CSSスタイルでは非公開の表示用のデザインの変更を行うことができます。

noindex,nofollow・・・メンテナンス中のメタrobotの動作です。

除外項では特定のページを非公開の状態を解除できます。

メディアクエリ

レスポンシブデザインが登場し、解像度のシェアなどからwebサイトの横幅の重要度が下がりました。
PC向けの横幅は最大サイズが1,920pxとなります。
基準としては、960pxなどが1つの基準になるかと思います。

メディアクエリのサイズの基準となるのは、

1.タブレット 768px
2.スマホ横 480px・568px
3.スマホ縦 320pxなど

タブレットなどではPC表示になるのか
タブレットはPC表示に含むかスマホに含むかは、コンテンツによって異なります。
ですが、タブレットはスマホに比べ、ウェブサイトを閲覧しやすいため、PCレイアウトが適していると思われます。タブレットならpc表示でも閲覧しても大丈夫な時はありますが、スマホ表示の場合、ボタンや画像などの余白が冗長的に見えることが多いです。
コンテンツのデザインによりますが、PC向けのレイアウトのほうがよいでしょう

border-image

border-imageのプロパティはIE11が対応して、大体のブラウザで使用可能です。

20 25 20 25 stretch
使用したい画像ファイルとボーダーのサイズ、ボーダーのパターンを指定できます。
横の数字がボーダーのサイズとなります。

CSS変数

CSS変数とは、「カスケード変数のためのCSSカスタムプロパティ(CSS custom properties for cascading variables)」となっています。

変数には文字列や数値などを入れることができます。
この変数に、繰り返し利用する数値やカラーコードなどをCSS変数を使えば、
定義しておいた変数の中身だけ変えるだけで、変更が可能となります。

CSS変数の定義
利用したい部分で var(–変数名) と記述すると、定義した値を当てはめられます。

CSS変数は動的に利用でき、JavaScriptに流用することができます。
下記では.testの変数–text-positionの中身を取得する記述です。

カスタムタクソノミー

wpに標準であるタクソノミー「カテゴリー」や「タグ」とは別に、自由にタクソノミーを追加することが可能です。
自由に追加した、タクソノミーが「カスタムタクソノミー」となります。

■タクソノミー
タクソノミーは簡単に言うと「カテゴリ」や「タグ」などといった分類を自分で追加することができる事です。

■ターム
言葉で説明するとタクソノミーに属した分類です。

例えば「商品」(タクソノミー)に「食品」を追加したとします。
この場合は
「商品」がタクソノミー
「食品」がタームのようになります。

■カスタム投稿タイプ
標準の「投稿」「固定ページ」とは別に、自由にで投稿タイプを追加することができます。
追加した投稿タイプを「カスタム投稿タイプ」と呼びます。

Flexboxのプロパティ(flex-grow、flex-shrink、flex-basis)

■flex-grow
flex-growプロパティはflexのアイテムの伸長数を設定でき、数値で指定します。

Flexのコンテナがアイテムを格納して、余りがある場合、指定されたプロパティに沿って、自動的に余白を埋めるよう伸縮します。

ただし、flexアイテムでないときは伸縮しません。

■flex-shrink
flex-shrinkプロパティはflexアイテムの縮短数を設定でき、数値で指定します。

先ほどの「flex-grow」とは違い、数値が大きいほど幅が狭くなります。

そして、「flex-shrink」は「flex-wrap:nowrap」と同時に使用しないといけません。

■flex-basis
flex-basisの使い方は、width、heightと同じです。

flexアイテムの幅をwidthで指定しても、別のプロパティで比率を指定している場合、widthの値が反映されません。
その場合に幅を固定してくれるのが、このflex-basisプロパティです。

「flex-direction」が、row、row-reverseのときは「flex-basis」は横幅を指定します。
「flex-direction」が、columnやcolumn-reverseのときは「flex-basis」は縦の長さを指定することになります。

値に指定できるのは数値と、初期値である『auto』です。

WordPressのマルチサイトでTemplateを変更する

マルチサイトでテーマを変更する方法です。マルチサイト化してもヘッダーやフッターが共通化されている状態だと思いますが、新規追加したサイトのテンプレートを変更することが可能です。

1.参加サイトから、サイトネットワークの管理→サイト
2.サイトを編集の設定からTemplateの箇所をテーマのフォルダ名を指定することによって使用するテンプレートの変更が可能になります。

マルチサイトはサイトごとにテーマを変えたり、使用プラグインの組み合わせを変更することができるので、汎用性を持ちつつ、サイトを一元管理できるというメリットがあります。

マルチサイトに対応しないプラグインもあり、
一般的に単一でのサイトでのみ運営するケースが多いため、マイナーなプラグインやテーマファイルの場合、マルチサイト対応を行なっていないケースがあります。

wp 複数サイト運用

WPのマルチサイト化は、1つのサーバー、1つのプログラムで複数のサイトを運営できる便利な機能です。

ネットワークの有効化をしてから、WordPressをマルチサイト化すると親サイトのURLに「/blog」が追加されてしまい、ページのリンク切れなどを引き起こします。この「/blog」は不要なので削除する方法を紹介します。

ネットワーク管理者の管理画面から親サイトのパーマリンク設定を変更することです。

ネットワーク管理者の管理画面から「サイト」を開き、設定タブをクリックします。そうすると、「Permalink Structure」という項目があるので「/blog」を削除すれば完了です。

WordPressを初めてマルチサイト化したとき、つまずくポイントだと思うので、対処法は知っておきたいですね。