いよいよ書いた記事をWordPressに上げる
これまで全7話、Claude Codeと一緒にHTMLで下書きしてきたこのブログ。
最終回はその記事を、立ち上げたばかりのWordPressに実際にアップロードするところまでやります。
ここまで来たら、もうおっさんも立派なブロガー予備軍です。
STEP 1:管理画面にログイン
第7話で変更した、自分専用のログインURLを開きます。
(標準の /wp-admin ではなく、自分で決めたURL)
- ユーザー名・パスワードを入力
- 2段階認証アプリの6桁を入力
- ダッシュボード(管理画面トップ)が表示される
カフェの無料Wi-Fi、空港のWi-Fi、コワーキングのゲストネットからの管理画面ログインは避けます。
どうしても外出先からログインする必要があれば、
自分のスマホでテザリングするか、信頼できるVPNを使います。
STEP 2:「投稿」→「新規追加」
左メニューの「投稿」から「新規追加」。
WordPressの編集画面(ブロックエディタ/Gutenberg)が開きます。
「タイトルを追加」と書かれた一番上の行に、記事のタイトルを入れます。
タイトルの付け方(おっさん的)
- 長すぎず短すぎず(25〜35文字くらい)
- 記事の「で、何が分かるの?」が一目で伝わる
- 例:「ド素人がClaude Codeでブログを始めた話」
STEP 3:HTMLで書いた本文を流し込む
ここがちょっとしたコツの要るところ。
HTMLで作った原稿を、そのままWordPressに貼り付けます。
方法A:HTMLとして貼り付ける(おすすめ)
- 編集画面の右上「︙」(縦三点)メニューを開く
- 「コードエディター」を選ぶ(「ビジュアル編集」と切り替えられる)
- HTMLファイルから
<article>内の本文だけをコピー - コードエディターに貼り付け
- 「ビジュアル編集」に戻すと、ブロックに変換される
方法B:1ブロックずつ「カスタムHTML」に貼る
上の方法でレイアウトが崩れるなら、見出し・段落ごとに
「+」→「カスタムHTML」ブロックを追加して、その中に該当部分のHTMLを貼る方法。
地味ですが確実。
「articles/01-introduction.html の本文部分だけを抜き出して、
WordPressのブロックに貼りやすい形に整えて」と頼めば、
HTMLを軽く整形してくれます。コードエディターに貼り付ければ、ほぼそのまま使えます。
STEP 4:パーマリンク(記事のURL)を整える
「設定 → パーマリンク」で、URLの形式を「投稿名」に。
これで、各記事のURLを https://◯◯.com/my-first-post/ のように
きれいな英数字に変えられます。
記事の編集画面で、右側の「URL」欄を、英数字とハイフンで
introduction、claude-code-setup のように指定。
日本語URLは避ける(メールやSNSで貼ると謎の文字列になる)。
STEP 5:カテゴリー・タグ・アイキャッチ
カテゴリー(必須)
右側のサイドバーから「カテゴリー → 新規カテゴリーを追加」。
例:準備編 / セキュリティ編 / 運用。
最初は3〜5個に絞るのがコツ。後から増やせます。
タグ(任意)
「WordPress」「SSL」「Claude Code」など、記事の話題を表す単語。
入れすぎ注意(1記事3〜5個まで)。
アイキャッチ画像
記事一覧に出てくる代表画像。サイドバーの「アイキャッチ画像を設定」から。
Google画像検索から拾った画像をそのまま使うのはNG。
無料素材サイト(Unsplash / 写真AC / いらすとや 等)か、
自分で撮った写真を使います。
ファイル名は IMG_2034.JPG のままにせず、
wordpress-login-screen.jpg のように内容が分かる名前に変更してから上げます。
STEP 6:プレビューと最終チェック
右上の「プレビュー → 新しいタブでプレビュー」で、
公開された時の見た目を確認。チェックリストはこれ。
- タイトル、本文の改行・見出しが崩れていないか
- 誤字脱字(音読すると見つかりやすい)
- リンクが全部
https://から始まっているか - 画像がちゃんと表示されているか
- スマホ表示でも崩れていないか(プレビューの「モバイル」切替)
記事内に http:// (鍵なし)の画像URLが混ざると、
ブラウザに「混在コンテンツ」警告が出ます。
全部 https:// に書き換える、または相対パスで貼ります。
Claude Codeに「この記事のHTMLでhttp://から始まるURLを全部探して」と頼めば、見落とし防止になります。
STEP 7:公開!
右上の青い「公開」ボタン → もう一度「公開」で確定。
「投稿が公開されました」と表示され、URLが発行されます。
そのURLをブラウザで開いて、世界に向けて記事が出ていることを確認。
おめでとうございます。これでド素人のおっさんが、ブログ運営者です。
STEP 8:公開後にやる地味だけど大事なこと
(a) Google Search Consoleに登録
Googleに「自分のブログがあるよ」と教えるツール。無料。
ドメインの所有者確認をして、サイトマップ(/sitemap.xml)を送信すれば、
検索結果に出るのが早まります。
(b) 公開後の小さなセキュリティチェック
- 記事を投稿したアカウントの「ニックネーム」を、ユーザー名と違うものに(記事下に表示される名前)
- 記事内に、間違ってパスワード・APIキー・サーバーIPなどを書いていないか最終確認
- コメント欄を開けるなら、「コメントは管理者の承認後に公開」に
(c) スパムコメント対策
公開した翌日から、海外からの謎コメント(薬の宣伝など)が来ます。
Akismetを有効化しておけば、ほぼ自動で振り分けてくれます。
長く続けるための「月1の運用ルール」
ブログは作るより続けるほうが100倍難しい。
ド素人のおっさんでも回せる、月1の最小限ルーチンを決めました。
| 頻度 | やること |
|---|---|
| 毎週 | WordPress本体・テーマ・プラグインの更新確認 |
| 毎週 | 怪しいログイン試行のメール通知をチェック |
| 毎月 | バックアップが取れているか実物を確認 |
| 毎月 | 使わなくなったプラグイン・テーマを削除 |
| 3ヶ月ごと | SSLの有効期限を確認 |
| 半年ごと | ユーザーアカウント・パスワードの棚卸し |
| 1年ごと | サーバー・ドメインの更新(自動更新でも内容確認) |
「今月のチェック項目を表で出して」と頼めば、
上の表をベースにチェックリストを毎月生成してくれます。
紙に印刷して、終わったらチェックを入れる。これだけで、
「気が付いたら脆弱性まみれ」を防げます。
最後に ─ ド素人のおっさんから、これから始める同志へ
ここまで読んで「やっぱり大変そう」と思った人、それは正しい感覚です。
でも、1人でやろうとしないこと。
Claude Codeに「分からないから、もっと噛み砕いて」と何度言っても、嫌われません。
そしてセキュリティだけは、面倒でもサボらない。
乗っ取られたブログを取り戻すのは、立ち上げの何倍も大変です。
最初の1日にやる地味な設定が、半年後の自分を救います。
おっさんの体験記、これにて完。
読んでくれてありがとうございました。
── では、ブラウザで自分のブログのURLを開いて、
改めて鍵マーク🔒を見てニヤニヤしましょう。


コメント