初投稿、そしてブログを長く続けるための運用ルール

AI・ガジェット

いよいよ書いた記事をWordPressに上げる

これまで全7話、Claude Codeと一緒にHTMLで下書きしてきたこのブログ。
最終回はその記事を、立ち上げたばかりのWordPressに実際にアップロードするところまでやります。
ここまで来たら、もうおっさんも立派なブロガー予備軍です。

STEP 1:管理画面にログイン

第7話で変更した、自分専用のログインURLを開きます。
(標準の /wp-admin ではなく、自分で決めたURL)

  1. ユーザー名・パスワードを入力
  2. 2段階認証アプリの6桁を入力
  3. ダッシュボード(管理画面トップ)が表示される
🔒 ログインは「自宅Wi-Fi」または「自分のスマホ回線」から

カフェの無料Wi-Fi、空港のWi-Fi、コワーキングのゲストネットからの管理画面ログインは避けます。
どうしても外出先からログインする必要があれば、
自分のスマホでテザリングするか、信頼できるVPNを使います。

STEP 2:「投稿」→「新規追加」

左メニューの「投稿」から「新規追加」。
WordPressの編集画面(ブロックエディタ/Gutenberg)が開きます。
「タイトルを追加」と書かれた一番上の行に、記事のタイトルを入れます。

タイトルの付け方(おっさん的)

  • 長すぎず短すぎず(25〜35文字くらい)
  • 記事の「で、何が分かるの?」が一目で伝わる
  • 例:「ド素人がClaude Codeでブログを始めた話」

STEP 3:HTMLで書いた本文を流し込む

ここがちょっとしたコツの要るところ。
HTMLで作った原稿を、そのままWordPressに貼り付けます。

方法A:HTMLとして貼り付ける(おすすめ)

  1. 編集画面の右上「︙」(縦三点)メニューを開く
  2. 「コードエディター」を選ぶ(「ビジュアル編集」と切り替えられる)
  3. HTMLファイルから <article> 内の本文だけをコピー
  4. コードエディターに貼り付け
  5. 「ビジュアル編集」に戻すと、ブロックに変換される

方法B:1ブロックずつ「カスタムHTML」に貼る

上の方法でレイアウトが崩れるなら、見出し・段落ごとに
「+」→「カスタムHTML」ブロックを追加して、その中に該当部分のHTMLを貼る方法。
地味ですが確実。

💡 Claude Codeに変換を頼める

「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年ごと サーバー・ドメインの更新(自動更新でも内容確認)
💡 Claude Codeに月次レポートを頼む

「今月のチェック項目を表で出して」と頼めば、
上の表をベースにチェックリストを毎月生成してくれます。
紙に印刷して、終わったらチェックを入れる。これだけで、
「気が付いたら脆弱性まみれ」を防げます。

最後に ─ ド素人のおっさんから、これから始める同志へ

ここまで読んで「やっぱり大変そう」と思った人、それは正しい感覚です。
でも、1人でやろうとしないこと。
Claude Codeに「分からないから、もっと噛み砕いて」と何度言っても、嫌われません。

そしてセキュリティだけは、面倒でもサボらない。
乗っ取られたブログを取り戻すのは、立ち上げの何倍も大変です。
最初の1日にやる地味な設定が、半年後の自分を救います。

おっさんの体験記、これにて完。
読んでくれてありがとうございました。
── では、ブラウザで自分のブログのURLを開いて、
改めて鍵マーク🔒を見てニヤニヤしましょう。

コメント