Ver1.6 Released !

他テーマからSANGOに移行される方へ(作成中)

このページでは、他のテーマからSANGOに移行する際のコツや注意点をまとめていきたいと思います。随時更新していきます。

1. サムネイル画像のサイズが統一されていないとき

WordPressではテーマを移行した場合にも、新しいテーマ用のサムネイル画像が自動生成されることはありません。つまり、SANGO用の旧テーマのサイズの画像がそのまま使われています。

Regenerate Thumbnailsというプラグインを使うと、1クリックでSANGOに合ったサムネイル画像を再生成してくれます。操作は簡単ですが、詳しい使い方は下の記事をご覧くださいませ。

参考 Regenerate Thumbnailsの使い方NETAONE

2. ショートコードなどの置き換え

「Search Regex」というプラグインを使うと、全記事の「特定の文字列」を「指定した文字列」に置き換えることができます。

[kanren postid=“◯◯”[kanren id=“◯◯”]に置き換え

吹き出しなどもこれを活用すれば、簡単に切り替えることができるのではないかと思います。Search Regexの使い方についてはこちらの記事が参考になります。ショートコードがうまく置き換えできていないと、検索順位などにも影響が出る場合があります。ご注意ください。

参考 Search Regexプラグインの使い方 AdminWeb

3. All in One SEO Packに要注意

SANGOでは、あらかじめメタデスクリプション用の欄が用意されています。また、OGPタグは自動で設定されるような仕様になっております。とくにOGPタグは自動で出力されるため、All in One SEO Packで「Social Meta」を有効化していると、OGPタグが重複してしまいます。
こちらのプラグインを使われる場合にも「All in One SEO」⇒「Feature Manager」の「Social Meta」は「Deactive」にしておいて頂くようお願い致します。
(All in One SEOはWordPressを重くする原因になるので、あまりおすすめしません)。

MEMO
All in One SEOで記事ごとにメタデスクリプションを記入していた場合には、プラグインを無効にすると、メタデスクリプションは引き継がれません。メタデスクリプションを引き継ぎたい場合には、上記の通り、プラグインは有効化&設定で「Social Meta」を無効化するのが良いかと思います。
MEMO

XMLサイトマップの設定は「Google XML Sitemaps」というプラグインが軽くておすすめです。詳しい使い方はこちらの記事をご確認くださいませ。

【WordPress】サイトマップ作成からSearch Console登録までの全手順
【WordPress】サイトマップ作成からSearch Console登録までの全手順

4.「Lightening」から移行する場合は、専用プラグインを停止

「Lightening」に付随する「VK All in One Expansion Unit」は停止してからテーマを移行して頂くようお願いします。

69 Comments

サルワカくん

未対応です。対応も検討しましたが、問題が起きやすくなるため、現段階での対応はやめることにしました。

返信する
ハラッコ

All in One SEO Packを使ってGoogle AnalyticsのトラッキングIDを設定してしまいました。相性が悪いということで、現在は、All in One SEO Packは削除しています。
初心者が再度Google AnalyticsのトラッキングIDを設定するわかりやすい方法はあるでしょうか?

返信する
サルワカくん

外観⇒カスタマイズ⇒サイトの基本設定⇒Google Analytics設定にトラッキングIDを入力するだけでOKです。

返信する
サルワカくん

そちらはWordPressの機能ですね。テーマに関わらず、もともと自動挿入される設定になっています。
「wordpress br 削除」などで検索してみてください。分かりやすい解説記事がたくさん見つかります。

返信する
アリス

お世話になっております。カスタマイズから設定できる「おすすめ記事(記事下)」についてなのですが、現在3つ設定しているのですが、2つまでしか表示されません。記事のIDを確認したのですが、間違ってはいないようです。よろしくお願いいたします。

返信する
サルワカくん

その記事自身を開いているのでは?
その記事自身へのリンクを表示するのは明らかに無駄なので表示しないようにしています。

返信する
アリス

大変失礼しました。ほかの記事では表示されておりました。ありがとうございます。

返信する
takasi

質問よろしくお願いします。
他テーマから変更しました。PCブラウザですとサイドバーが下にいってしまいます。ブラウザ幅の問題では無さそうです。

原因が分かれば教えて頂きたいです。
お願いします。

返信する
サルワカくん

カスタマイズガイド用の子テーマをご利用のようです。通常の子テーマのダウンロードはこちらからどうぞ。

返信する
takasi

気づくのが遅くなり申し訳ありませんでした、ご返信遅くなりました!ご回答ありがとうございます。

返信する
よし

質問です。
以前まで、All in One SEO PackのSocial MetaでSNS用にアイキャッチとは違う画像を個別でアップロードしog:imageとして設定していたのですが、sangoにもそういった機能はあるのでしょうか?

返信する
サルワカくん

あいにくSANGOでは、アイキャッチ画像とソーシャルメタ画像には同じものが使用されるようになっております。
恐れ入りますが、ご理解の程よろしくお願い致します。

返信する
shunP

先日他テーマからSANGOへ変更しました。
質問なのですが、
トップページの記事一覧のカードに表示されるアイキャッチ画像が
トリミングされてしまいます。(Regenerate Thumbnails実施済み)
前テーマでは全て4:3でアイキャッチを作成していたので、
出来ればこの比率で表示したいです。
カードの幅はこのままで少し長くなるイメージです。

宜しくお願いします。

返信する
サルワカくん

以下の方法で対応可能かと思います。
①子テーマのfunctions.phpに下記のコードを追記します。

//サムネイル画像の高さを390pxにオーバーライド(解説)
function my_change_thumb_size() {
  add_image_size( 'thumb-520', 520, 390, true );
}
add_action( 'after_setup_theme', 'my_change_thumb_size', 11);
//END サムネイル画像をオーバーライド

②子テーマのstyle.cssに下記のコードを追記

#main .cardtype__img {
    padding-bottom: 75%;
}

③プラグイン「Regenerate Thumbnail」を実行

うまくいったかどうかご報告頂けると幸いです。

返信する
shunP

早速のご連絡有難う御座います。
上記方法で試してみたのですが、画像の下部がトリミングされてしまいます。
ただ、記事内の関連記事などのカードはきれいに表示されています。
恐らくTOPページのカードは日付部分がトリミングされている?

返信する
サルワカくん

すみません、#main cardtype__imgではなく#main .cardtype__imgです。ドットが抜けてました。
(コメントは修正済みです)。

返信する
shunP

コードを修正して再度やってみたところ、きれいに表示されました!

ありがとう御座います!

hiro

教えてください。
以前使っていたテーマではアイキャッチ画像を200×200で記事内で使用する画像とは別に作っていたのですが、SANGOに移行したら逆に記事ページでは拡大された分だけ画質が荒くなり、横2列の記事一覧ページでは画像が小さくて余白ができてしまいます。
何か方法はないでしょうか?
また、このページの最下段にもあるホームの下の「利用規約」等を設置するにはどこをカスタマイズすればいいのでしょうか?

返信する
サルワカくん

アイキャッチ画像が200×200と小さく正方形だと、Twitterやfacebookなどでシェアされたときにサムネイルが表示されません。
(これはSNS側の仕様です)
そのような理由からSANGOでは横長のアイキャッチ画像(600×320以上)を想定しております。
恐れ入りますが、大きく横長の画像をアップロードし直して頂くのが良いかと思います。

利用規約などのボタンについては、外観⇒メニューの「フッター固定メニュー」から設定可能です。
浮き上がったボタンにするには、よくある質問の「フッターメニューを浮き上がったボタンにしたい」をご覧ください。

返信する
hiro

ありがとうございました。
改めて作り直すしかないのは残念ですが、デザインが気に入っているので頑張ります。
今後ともよろしくお願い致します。

返信する
サルワカくん

ご理解ありがとうございます。
ご希望に添えず申し訳ありませんが、よろしくお願い致します。

返信する
森田造園

現在、弊社WEBサイトでSANGOを使っています。とてもデザインの良いテーマに出会えて嬉しいです。素敵なテーマのお陰でお客様への印象も良く、購入してとても良かったと思っています。

今後ランディングページを制作しようと思っているのですが、例えば「固定ページ、1カラムで制作をする」等ページを作る場合のおすすめの設定はありますか?

このような質問で申し訳ありませんが、ご教授いただけると嬉しいです。

返信する
サルワカくん

ありがとうございます。そう言って頂けるととても嬉しいです。
HTMLやCSSをできるかぎり書かずにランディングページを作るなら仰る通り、
「1カラム用の固定ページ」を使うのが良いかと思います。
横3列に並べるショートコードや画像の上に文字を載せるショートコードが役立つかもしれません(ショートコード一覧)。
一方、HTMLとCSSをガッツリ書くことができるのであれば、
ランディングページ用だけ別デザインテンプレートを作ることもできます。
特定の固定ページのみデザインを変えたい!ページテンプレートを作成する方法
これを子テーマ内で行えば、他のページのデザインを気にすること無く、自由にHTML/CSSのカスタマイズができます。

返信する
森田造園

お忙しい中、ご教授ありがとうございます。
「横3列に並べるショートコードや画像の上に文字を載せるショートコード」思いつきませんでした。なるほど!いろいろな方法でページを制作したり、カスタマイズが自分でできる、「SANGO」はスゴイですね。僕のようなPHP・CSSの知識に乏しい初心者でも扱えるよう設計された素晴らしいWordPresテーマなのでページ制作がとても楽しいです。いただいたアドバイス参考にさせていただきます。
ありがとうございました。

返信する
サルワカくん

そう言って頂けると本当に嬉しいです!
今後ともよろしくお願いします。

返信する
ton

お世話になっております。
PCとモバイルの記事一覧で表示される、cardのアイキャッチ画像下にあるタイトル部分のサイズの変更はどうすればよろしいでしょうか?

返信する
サルワカくん

返信が遅くなってしまい申し訳ないです。
以下のCSSを子テーマのstyle.cssなどに追加することで変更できます。

.cardtype h2 {
  font-size: 17px;/*スマホでのフォントサイズ*/
}
@media only screen and (min-width: 1030px) {
  .cardtype h2 {
    font-size: 18px;/*PCでのフォントサイズ*/
  }
}

それぞれのpxをお好みで調整くださいませ。

返信する
手塚俊也

シンプリシティから移行しました。アイキャッチについて教えてください。

【モバイル】トップページの記事一覧カードを横長にする

を選択すると、【モバイルのアイキャッチ】が【記事タイトル下のアイキャッチ】と同じ比率で表示されます。(横長)
モバイルのアイキャッチを自動で正方形に切り取る方法はございますか?

返信する
vict

いつもお世話になっております。
初心者な質問で恐縮なのですが、デフォルトで設定されているシェアボタンのロゴマークが一部表示(2個だけ表示される)されません。ロゴが表示されていなくても、リンク先のSNSには飛びはします。プラグインを停止したり、キャッシュを削除したり、テーマを再インストールしても改善されません。リンクには飛ぶのでcssの読込に何か原因があるのかと思いますが、まだまだ勉強中の為検討がつきません。ご教示頂きたく思います。

返信する
サルワカくん

よくある質問の最下部にある「シェアボタンが表示されない」を御覧いただけますか?
おそらくFontAwesome5の読み込みタグを貼り付けているのではないかと思います。

返信する
vict

ありがとうございました。Q&Aをよく読めておらず、申し訳ありませんでした。解決しました。

返信する
minimini11

半年前に移行させて頂きました。
最近になり、Consoleで239のタイトルタグが重複していることに気づきました。
どうやら色々いじった時に、全て同じ title タグを設定するようにしてしまったようで…。
現在、 title タグが2つあり、1つ目が全ページ同じになっているようなのです。
(これも人に教えてもらった内容)

ここで質問するのは間違いかもしれませんが…どう対処したらいいのか分からず質問しました。
よろしければ、アドバイス頂けないでしょうか?

返信する
サルワカくん

SANGOではそのような仕様はないので、プラグインかカスタマイズで追加したのだと思います。
プラグインを全てオフにしても直らないのであれば、titleタグをどこかに書いているのはずなので、そちらを消していただくとしか言えないです…。

返信する
minimini11

見当違いな質問にお答え頂き、ありがとうございます。

要素の検証を見ると、サイト名以外に、記事タイトル|サイト名とありましたが、これはそのままで大丈夫でしょうか?
titleタグを消した場合、どこでtitleタグが重複していないことを確認すればいいのか分かりません。確認方法は、Search Consoleでタイトルタグの重複が減っていくのを待つしかないのでしょうか…?

返信する
サルワカくん

それはそのままで大丈夫です。
要素の検証をして<title>サイト名</title>が無ければ、重複していないということです。
あとはGoogleが次に巡回しに来たときに正しくtitleタグを認識してくれるはずです。

返信する
minimini11

サイト名があったので消しました。
意味も分からずにコピペしていた結果だと思い、これからはもっと勉強したいと思います。
お騒がせして申し訳ありませんでした。
ありがとうございました!

coachsan

本当にド素人の質問で申し訳ないです。

まだ、SANGOを入れたばかりなんですが、突然サイドバー(初期設定の)がごそっと消えてしまいました…。

あまりどこかをいじった記憶もないのですが、何もせずに消えるわけがないので、どこかの設定を変えたのだとは思うのですが、自分ではわかりません。

本当に拙い質問で恐縮ですが、何か考えられる原因はありますでしょうか?

返信する
サルワカくん

外観→カスタマイズ→ウィジェットで「サイドバー」は空になっていませんか?
また、一部のページで表示されない場合は投稿編集画面にて「1カラムでのみ表示」にチェックが入っていたりするかもしれません。
子テーマを解除すると戻る場合には、子テーマの種類が誤っている可能性があります(通常の子テーマはこちらからダウンロードできます)。

返信する
coachsan

ありがとうございました!
焦って質問して申し訳ありません。

あと、もう1点モバイルだけなんですが、「トップページの記事一覧を横長にする」にチェックを入れるとアイキャッチ画像が表示されません。

色々調べたり試したのですが改善できませんでした。
どういった解決策があるでしょうか?

重ね重ね申し訳ありません。

返信する
サルワカくん

他のテーマから移行されたのでしたっけ?
Regenerate Thumbnailはすでに行っていますか?
可能であれば、サイトURLを教えて頂けると原因究明がしやすくなります。

返信する
coachsan

はい、シンプリシティから移行いたしました。

Regenerate Thumbnailは行っています。(と思います…。)
ただ、
「Regenerate Thumbnail For All 215 Attachments」
というボタンと,
「Regenerate Thumbnail For The 30 Featured Images Only」
の2つのボタンが表示されていたので、上の方だけ実行しています。

サイトのURLです。
ちなみに恥ずかしいので、URLの公開はNGでお願いします(笑)m(_ _)m

お忙しいのに何度もお付き合いさせてしまって申し訳ありません。
何卒よろしくお願いいたします。

返信する
サルワカくん

拝見しましたが、Regenerate Thumbnailの問題ではなさそうですね。
アイキャッチ画像が完全に出力されていないようなのですが、カスタマイズしていますか?
(子テーマに何らかのファイルを入れていますか?)
また、プラグインを全てオフにしても同様の問題が生じますか?

返信する
coachsan

プラグインを全てオフにしても改善は見られませんでした。

カスタマイズといっても、マニュアルを拝見しながらちょこちょこっといじっているだけで、もともとそんな知識もスキルもありません(笑)

それとも、知らない間にどこか触ってしまったのでしょうか…?

返信する
coachsan

今、パッと見たらモバイルのアイキャッチ出てました!
私は何もいじっていません。

もしかして色々やってもらったのでは…?

本当にありがとうございます!
助かりました!

返信する
shichimi

見出しのh4タグをよく使うのですが、cssでデザインを変えると、サイドバーの各タイトルもそのデザインに反映されます。

そうならない方法はありますでしょうか?

返信する
須藤真人

サルワカさんのおしゃれなサイトにあこがれて、lightningから移行しました!

早速ですみませんが教えて下さい。
今までは、サイトの紹介ページをターゲットごとに書き分けて、固定ページの親子機能を使って階層構造にして作成していたのですが、SANGOに切り替えてから親のページに子のページが表示されなくなってしまいました。
どのような設定をすれば、表示できますでしょうか?
よろしくお願いいたします。

↓当該のページです↓
https://trackonsnow.jp/introduction-of-this-website/
以前はこのページに子のページのリンクが3つ表示されていました。

今は暫定的に、投稿ページを使って階層構造にしていますが、
サイトの紹介が、人気記事ランキングに入ったりすると厄介なので、固定ページで作りたい、というのが主旨です。

返信する
サルワカくん

お世話になっております。
恐縮ながらSANGOでは、固定ページに子固定ページへのリンクが自動的に表示される仕様にはなっておらず・・・。
関連記事ショートコードを使って、子固定ページへのリンクを表示させるのが手軽かと思うのですが、いかがでしょうか。

返信する
須藤真人

そうなんですかー…。残念ですがわかりました!
代替提案ありがとうございます。ですが、イメージ的には自分で作った暫定仕様の方がイメージに近くできそうですので、それをもうちょっと頑張ってカスタマイズしてみます。

ひとつ問題が残っているので、引き続き質問いいですか?

投稿で紹介ページを作ると、ウィジェットの「人気の記事」の上位を、アクセスが集中しやすい「サイトの紹介ページ「」が占有してしまう可能性があり、そうなるとちょっと困ってしまいます。
特定の記事を、人気の記事の集計対象から除外する良い方法は何かありますでしょうか?

返信する
サルワカくん

人気記事ウィジェットで一部の記事を計測から除外する方法ですが、子テーマにfooter.phpを複製して

if( !is_bot() && !is_user_logged_in() ) {
  sng_set_post_views(get_the_ID());
}

の部分を

if( !is_bot() && !is_user_logged_in() && !is_single('99')) {
  sng_set_post_views(get_the_ID());
}

などと書き換えると、特定の記事をカウントから除外できます(99の数字のところを除外したい投稿のIDにします)。

返信する
須藤真人

わかりました!
これでイメージに近いサイトにできそうです。
ご丁寧にお教えくださりありがとうございました^^

須藤真人

度々すみません。
やってみたのですが、対象の記事がカウントから除外されない様で、再度教えてください。

まず、書き換える様ご教示下さったコードについてなのですが、元々footer.phpには無く、single.phpにありました。

footer.phpとsingle.php、両方を子テーマに複製し、片方づつコード追記と書き換えを試してみましたが、カウントが除外されないようなのです。

質問としては、下記の3点です。
・コードを書き込むファイルはfooterとsingleどちらでしょうか。
・コードを書き込む位置で気を付けるべきことはありますか。
・ほとんどコピペさせて頂いているので大丈夫かと思っているのですが、下記のコードに誤りはありますか?
if( !is_bot() && !is_user_logged_in() && !is_single(‘678’, ”687)) {
sng_set_post_views(get_the_ID());
}

よろしくお願いいたします。

サルワカくん

申し訳ないです。single.phpが正しいです。footer.phpは誤りなので、該当のファイルもしくはコードは消していただくようお願いします。
(追記するとダブルカウントされるのでコードを修正してください)
コードに誤りありです。
is_single内のダブルクオテーションが閉じておりません。
また、複数指定するときには配列(array)にする必要があります(この記事を読めば分かると思います)。
なので

if( !is_bot() && !is_user_logged_in() && !is_single(array('678','687'))) {
sng_set_post_views(get_the_ID());
}

ですかね。

須藤真人

今度こそできました!
大変助かりました。
ありがとうございます!!!m(_ _)m

勉強不足ですみませんでした。
サルワカさんのサイトと、おすすめの本で勉強するようにします!

サルワカくん

こちらこそ誤った案内をしてしまい、すみませんでした。
なんにせよ、うまくいったようで安心しました!

みかん

先月からsangoを使用させて頂いています。色使いやカスタマイズのしやすさからとっても気に入っています。
ありがとうございます。

教えていただきたいのですが、
アイキャッチ画像を正方形に設定しているのですが、記事下の関連記事なども正方形に設定できるのでしょうか?
またカードタイプの記事一覧も正方形にできるのであれば教えて頂きたいです。

似たような質問があったのでやってみたのですが、比率が違ったようでうまくいきませんでした。

教えていただけると助かります。
よろしくお願いします。

返信する
サルワカくん

アイキャッチ画像や関連記事の画像の縦横比を1:1にしたいということですね。
①子テーマのfunctions.phpに下記のコードを貼り付けます。

//サムネイル画像サイズを変更
function replace_thumbnail_src($src,$size) {
      $width = ""; $height = "";
      if($size == "thumb-160" ) {
        $width = "160";
        $height = "160";
      }
      if($size == "thumb-520" ) {
        $width = "520";
        $height = "520"; //widthと数字を合わせると画像が1:1の比率になる
      }
      if ($width && $height) {
        $search = array('.jpg','.jpeg','.png','.gif','.bmp');//画像拡張子
        $replace = array();
        foreach ($search as $ext) {
          $replace[] = '-'.$width.'x'.$height.$ext;//トリミング後の画像パスに置き換え
        }
        $replaced_src = str_replace($search, $replace , $src);
      }
      return $replaced_src;
}

function my_change_thumbnail_size() {
  add_image_size( 'thumb-520', 520, 520, true ); //2つの数字(520)を合わせると画像が1:1の比率になる
}
add_action( 'after_setup_theme', 'my_change_thumbnail_size', 11);
//END サムネイル画像をオーバーライド

②子テーマのstyle.cssに下記のコードを貼り付けます。

.cardtype__img {
    padding-bottom: 100%; /*縦横比1:1の場合は100%*/
}

③Regenerate Thumbnailというプラグインで画像を再生成します。

ご確認よろしくお願いします。

返信する
あおい

こんにちは。素晴しいテーマを作ってくださり、ありがとうございます。

教えて頂きたいことがあります。

GoogleAnalyticsを使う際に自身のアクセスが反映してしまうので、カスタムディメンションのフィルターで除外したい(固定IPが無いため)のですが、うまくできません。

カスタマイズ > 詳細設定 > Google Analytics の元々ご用意下さった方法と、
自分でheadに埋込む方法も試したのですが、変りありませんでした。
gtag.js で除外ページを作成しています。

他のテーマ(twentyfifteenなど)に切替えるとフィルターが動いて除外されます。
プラグインも入れていません。
何と干渉しているのでしょう…。
教えて頂けると助かります。よろしくお願いいたします。

members.htmlを外すとメインページになります。

返信する
サルワカくん

JavaScriptのエラーは出ておりませんし、Analyticsのコードを制御するようなコードはテーマに全く書かれていないため、おそらくAnalytics側の問題かと思います・・・。
headタグに追加欄からTwentyFifteenと全く同じコードを貼ってみてはいかがでしょうか。

返信する
あおい

先ほど質問したものです。
gtag.jsで書いていると言いましたが、ダメでしたので
anlytics.jsで書直したものをアップしなおしています。

返信する
あおい

早速のお返事ありがとうございました。
お忙しい中ご確認いただき、感謝致します。アドバイスをもとに色々試して見ます。今後ともよろしくお願い致します。

返信する

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です