【備忘録】WordPressを設定するときにはまったところ

# 概要
Wordpressを構築後、記事を作る途中でハマったところをメモる。

## 環境
バージョン：`WordPress 6.6.2`
実行OS：`Almalinux9.3`
phpバージョン　`PHP 8.0.30`
httpdバージョン `Server version: Apache/2.4.57 (AlmaLinux)`
MySQLバージョン ` MySQL 8.0 database server`


### サイトアイコンなどで画像が表示されない。

サイトアイコンなどを設定しようとして、画像をアップロードしても、うまく表示されない。
ただし、画像を編集などはできるように見える場合。

![スクリーンショット 2024-10-29 21.59.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/a936eb17-0ced-c45f-9e02-060f6b824556.png)

WordPressの設定をhttpsにする。

![スクリーンショット 2024-10-29 22.23.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/377d0e22-2de9-fda5-3a43-ae267b50cc0e.png)

おそらく、httpで画像を表示しようとしてエラーが出ていたと思われる。ブラウザの開発者ツールを見ればちゃんと理解できた可能性がある。

###  「公開（更新）に失敗しました。 返答が正しい JSON レスポンスではありません。」のエラーを修正する

結論、パーマリンク設定の問題。
ここは、色々な参考書を読むと変えるべきというように言われているが、自分の場合はデフォルトにしないとページの更新や投稿をすることができなかった。

https://y-com.info/contents/?p=7585


## WordPressのテーマのCSSが、外部からのテスト時に読み込まれない。

開発者ツールを見ると、1行目からCSSが読み込まれていないというような旨の情報が出ているのが確認できる。

この時自分の場合は、上記のWordpressのアドレス（URL）がドメインでなくプライベートのIPアドレスになってしまっていた。上記のURL部分をIPアドレスからドメインに変更して対応した。


## WordPressでアフェリエイトを設定する時に、aフレームを入れ込めと言われる。

アフェリエイトを、たとえばdti-cashのサイトで設定しようと思ったら、
こんな感じでAフレームを埋め込めと言われたりする。この時、普段Wordpressをcssから入れることなんてなくて困ると思ったりする。

![スクリーンショット 2024-11-04 16.53.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/a1af2e3f-5f4c-be4c-f5c5-74a4a2b48ebd.png)

そういった時は、
```
サイドバーなどのカスタマイズから、カスタムHTMLを要素として追加することで、該当の広告を表示させることができる。
```

![スクリーンショット 2024-11-04 16.45.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/0568e7e6-1717-bb06-b1da-5c0249a76cc7.png)

![スクリーンショット 2024-11-04 16.45.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/a3aa9d6e-1417-0712-8b45-9f2cb089dd79.png)


## WordPressでcocoonなど以外のテーマで、XMLサイトマッピングを適応させる。

cocoonやJINなど特定のテーマであれば、googleのxmlサイトマップから簡単に指定することができるが、できないサイトもあり、情報が少ない。それらは自分で指定する必要がある。

https://hitodeblog.com/searchconsole-first

まずは以下サイトに移動して、ドメインでもURLでもどちらでもいいけど、サイトのURLをいれて続行する。

https://search.google.com/search-console/welcome?utm_source=about-page

その他の確認の中のHTMLタグの中を確認し、コピーして控える。*このとき、そもそも<head>タグの中に入れてくださいって言われているな。

![スクリーンショット 2024-11-07 23.21.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/e5d383d4-ca31-554a-0d0d-472f64b9c440.png)

その後、WordPress内の中の
```
「外観」 > 「テーマファイルエディター」
```
に移動する。

![スクリーンショット 2024-11-07 23.24.02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/2afde226-ef93-2f27-37a2-e48a5efa7ff0.png)

その後、`header.php`を探す。

![スクリーンショット 2024-11-07 23.24.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/a934bdaf-5c3c-8868-8c41-2dcf54e976aa.png)

そして、<head>タグの中にコピペしたメタタグを追加する。php wp_headの前にいれる。
```
<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>">
	<link rel="profile" href="http://gmpg.org/xfn/11">
	<?php wp_head(); ?>
	<!-- Google Search Console verification -->
	<meta name="google-site-verification" content="75h3tdyyyyyxxx" />
	<?php wp_head(); ?>
</head>
```

その後、すぐ下のファイルの更新を押す。
`ファイルの編集に成功しました。`とでてくればOK。

その後、サーチコンソールの画面に戻り、確認を押すと、所有権を証明できる。

![スクリーンショット 2024-11-07 23.30.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/0f123083-a290-2e43-37bd-a4b5f2fa65a8.png)

登録ができると以下のように情報を見れるようになる。

![スクリーンショット 2024-11-07 23.31.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/a425d13d-f707-956d-84a7-29015e522ed2.png)

## XMLサイトマップを表示しても404エラーがでる。

自分が使っているのは、`XML Sitemap Generator for Google ：Version 4.1.21`だった。

まず、以下のサイトを試しダウングレードしてみる。

https://hitodeblog.com/google-xml-sitemaps

そして有効化するといけた！！最新版はどうも使えなかったみたいだ。

![スクリーンショット 2024-11-07 23.56.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/3b839835-50c3-6df6-6354-c77c9f6d25b4.png)


ちなみに自分の場合はサイトマップのURLが`index.php?xml_sitemap=params=`というもので、よく記事で見かける`sitemap.xml`ではなかった。

すると、成功しましたとでてくる。

![スクリーンショット 2024-11-08 0.02.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/d697881c-7b12-9d59-e9f9-f1abbef792ea.png)

記事をどんどん更新していくと、`検出されたページ数`が増えていき、URLがGoogleに表示されやすくなるらしい。

## 予約投稿をする

Wordpresの投稿の欄から、近くにある`公開`をクリック。するとカレンダーが表示されるので、投稿したい日付と時間を選択する。

![スクリーンショット 2024-11-27 22.37.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/71da6e4d-e4a6-f69b-6a04-0ae7ea990a72.png)


## 記事の投稿が、404 Oops! Page not found.と表示される。

結論、リンクの部分に日本語を入れない。
記事を作成している時、タイトルのデフォルトの設定で日本語が入ってしまう事がある。
その際は、記事のリンクの部分を直接編集し、alphabetだけで記載することで解決できる。

![スクリーンショット 2025-03-04 21.23.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1288524/d6d45aca-28fd-4eb3-8449-a5127bce9e22.png)

# wordPressの管理者画面を、特定のIPに制限させる。
このようなイメージで、`/var/www/html/wp-admin/.htacsess`を作成して、中に許可するIPを記載していく。ただ、クラウドフレアトンネルでオリジンサーバとキャッシュサーバに乖離があるからなのか、うまくいかなかった。

```
[jst-dito@my-portfolio wp-admin]$ pwd
/var/www/html/wp-admin
[jst-dito@my-portfolio wp-admin]$ 
[jst-dito@my-portfolio wp-admin]$ ls -la| grep .htaccess 
-rw-r--r-- 1 apache apache   158  6月 21 23:41 .htaccess
[jst-dito@my-portfolio wp-admin]$ 
[jst-dito@my-portfolio wp-admin]$ cat .htaccess 
        <Files wp-login.php>
          Order deny,allow
          Deny from all
          Allow from 00.00.00.00
        </Files>
[jst-dito@my-portfolio wp-admin]$ 
```


https://wp.fairground.co.jp/qa/3269/

cloudflareでやる方法もあるみたいだが、記事が古すぎて参考にならなかった。
今cloludflareのfirewallはかなりUIや設定方法が変わっている。

https://www.bambiman.com/?p=1882

これがいいかも？

https://nw.t-spirits.com/zerotrust/access-self-hosted/

## メモ：テーマ

個人的によかったのは、`blogmate`。

https://www.wpbeginner.com/ja/showcase/best-free-wordpress-blog-themes/