WORD PRESSでブログを作った経験・備忘録

私は自分のサイトはWORD PRESSで作っていますが、正直、素人で色々調べながら作っています。

デザインがまだまだなのも自覚していますが、とりあえず、記事数を増やすことを優先して作成してきました。

備忘録も兼ねて、ブログ作成についてまとめていきたいと思います。随時更新予定です。

<サーバーについて>

サーバーはさくらのインターネットの一番安いサーバーを使っています。

さらに独自ドメインを作って、それが今のサイトのドメインとなっています。独自ドメインを使うメリットはさくらのレンタルサーバによると「さくらのレンタルサーバを契約すると「●●●.sakura.ne.jp」といったドメインが無料で使えるようになりますが、基本的には独自ドメインの取得をおすすめしています。
 例を挙げると、ドメイン名でご自身の企業名やサービスを表現できる効果がある他、SEO評価もドメインに集約されるためサーバーの引っ越しを行ってもSEOの評価に影響しにくいなどのメリットがあります。途中から独自ドメインに切り替えても良いのですが、そこまで高額なものでもありませんので、特にビジネス用途であればホームページ開設当初から独自ドメインの利用がやはりおすすめです。」とのことです。サイトを作って3年経ちますが、現状、独自ドメインで良かったという実感は特にありませんが、「sakura.ne.jp」と書いているよりは「.com」の方が、信頼できそうな気はします。

サーバーの出費は年1万円くらいです。正直赤字です。

<WORD PRESSの使用開始>

簡単にしか調べていませんが、ブログサイトなどを作るのにはWORD PRESSが一番良い、などの記事を複数見つけ、WORD PRESSを使うことにしました。さくらインターネットにおいても、クイックインストールの欄に3つのアプリの内の1つがWORD PRESSだったため、WORD PRESSの選択は間違っていなかったと思います。

これの導入方法ですが、さくらインターネットのクイックインストール(「契約中のサービス一覧」⇒「コントロールパネルを開く」⇒「クイックインストール」)を使っても良いように思いますが、ちょっと調子に乗って、FTPソフトを使用しました。具体的にはFileZillaというソフトです。

以下のサイトを参考にした記憶があります。
https://wordpress-drive.com/note/wordpress-ftp-filezilla/

こちらも正直、FTPソフトを使う意味があったのかは、現状では分かりません笑 たぶん意味があったと思うことにしています。さくらのインターネットの初心者向けページにもFTPソフトの使用が推奨されていたので、間違いないのだと思います。

<google search consoleの導入>

私は、アクセス解析用にgoogle search consoleを導入しています。導入方法は以下のサイトを参考にしました。
https://www.conoha.jp/lets-wp/wp-search-console/

端的には、①googleアカウントを作り、google search consoleにログインし、②WORD PRESSにALL IN ONE SEOを登録し、③ALL IN ONE SEOの一般設定に、google search consoleのメタタグを入れて保存し、④google search consoleで確認したという流れです。

*ここで③において、さくらインターネットにてWAF設定ドメインを有効にして、しまうと、ALL IN ONE SEOによる一般設定ができませんので注意してください。

<SSLの設定>

SSLの設定とは、簡単に言うと、httpをhttpsにする作業です。httpsにすることで、セキュリティが向上し、SEO対策にもなるようです。
独自ドメインの場合、課金してSSLを設定する必要があります。さくらインターネットではコントロールパネルのドメイン/SSLで簡単に作れますが、正直なところCSRの会社名をどう入力したら分からなくて困りました。
調べた結果、以下のサイトを参考に、「Personal」と入力しました。
https://wp-topics.com/work/741/

その後の、SSLの設定は以下のサイトを参考にしました。https://www.youtube.com/watch?v=FIuGan-ZApY

設定後、Wordpressの方でも設定をしました。これも
https://wp-topics.com/work/741/を参考にしました。

また、SiteKitの修正を行いました。Search consoleの方は、見てみたらhttpsとhttpの両方が選べるようになっており、勝手に反映してくれたようです。

こちらは年、1000円くらいの費用です。

自身のサイトのURLのリンクについては「Better Search Replace」というものを入れており、それでhttp://www.entertainformationを
https://www.entertainformationに置き換えました。

httpを置き換えると、特に外部サイトなどが繋がらなくなる可能性があるので注意しましょう。

それとSSLを導入しても最初はhttpの方ばかり訪問されるようです。
導入から5日の訪問者の合計の比はhttp:https=20:1でした。

<WAFの設定>
WAFは「Webアプリケーションファイアウォール」の略です。こちらはさくらのインターネットで有効にできます。上記の通り、ALL IN ONE SEOを使う時などに邪魔になることがあるので、サイトの編集をする時は無効にして、作業が終わったら有効にするのが良いと思います。

<URLの貼り付け>
よく記事にはURLを貼り付けますが、URLだけ貼りたいのに、youtubeならその動画が埋め込まれる感じになり、困りました。これについては一度、スペースを入れてから、貼り付けをすると、動画等が埋め込まれるのを回避できることが分かりました。もっと良いやり方があるかもしれません。

<バナーの貼り付け>
アフィリエイトなどのリンクは「カスタムHTML」を押してそこに貼り付けるとできます。プレビューで問題ないか確認できます。投稿を表示した時にバナーの位置がおかしい時、大きすぎる時、とりあえず、「グループ化」をしたら、中央に来たのでそれで対応していますが、もっと良い対策があるようにも思います。何か見つけたら記入します。*中央にするのは以下の「<アフィリエイト等のバナーを中央にする>」を参考にするのが良いと思われます。

<改行>
普通に「enter」を押すと新しいブロックが生成されるので、行と行の間に隙間ができます。「shift+enter」で通常の改行となります。

<投稿のタイトル名のサイズを変更>
カスタマイズの追加CSSに以下、コピペします。
以下のサイトを参考にさせて頂きました。
https://natsu-blg.com/wordpress-3/
h1.entry-title{
font-size: 60px; /* pxはお好みのサイズに変更できます */
}

<タイトルに改行を入れる>
文章中に<br>を入れるだけ。
例)適当な
  文章
としたければ
「適当な<br>文章」
と入力するだけです。
文章中のHTMLコードが認められるとは思っていなかったので正直ビックリでした。

<アフィリエイト等のバナーを中央にする>
カスタムHTMLで
<div style=”text-align:center;”>

</div>
で挟む。以下のサイトを参考にしました。
https://tekuteku-shoji.com/customhtml-center/
*ただし、左寄り且つ、下に空間がすごくできてしまうバナーに対してこの処理をしたところ、左寄りのまま、空間が無くなりました。何ででしょう?

<テーマ選択>
本サイトの作成時、元々入っていた「twenty twenty」というテーマを使用していました。正直大失敗です。新たに色々調べると、cocoonというテーマが無料で、日本語でかなり使いやすいとのことで、今はcocoonを使用しています。最初からこちらを使っていれば良かったです。cocoonについては「cocoon ダウンロード」とgoogle検索すれば以下サイトが出てくるので、ここからファイルをダウンロードします。https://wp-cocoon.com/downloads/

zipファイルですが、解凍しません。wordpressで「外観」⇒「テーマ」と移動し、「新しいテーマ」をクリックし、先のファイルをアップロードします。私はエラーが出て、上記サイトの指示通り、cocoon 低サイズ版をダウンロードし、最新版にアップデートしまして、テーマとして選択しました。確かに、twenty twentyよりだいぶ使いやすいです。

<投稿のタイトルを横表示にする>
cocoonを入れて最初に、投稿のタイトルが縦表示になって見にくいという問題が発生しました。これについては投稿の上の方にある「表示オプション」をクリックし、カラムの選択を減らすことで、横表示になりました。*厳密には縦表示だったのではなく、カラムの幅が狭すぎで改行されていたようです。

<メニューの設定>*cocoon
「外観」⇒「メニュー」からメニューを設定できます。あまり長いタイトルだと見切れるようです。
メニュー画面ではメニューに設定するページのメニュー上でのタイトルを変更できるので、それで見切れないようにできます。あるいは、メニューの下層に設定することでも解決しました。私はメニューにスマブラトップページを持ってきてそれを「スマブラ」と名前を変更し、その他のスマブラ関連のメニューを「スマブラ」の下層に設定しました。ただし、それだとスマブラトップページに行きたいときに「スマブラ」をクリックする必要があるのですが、それはそれで分かりにくいので、スマブラトップページを新たに1つ追加して、「スマブラ」の下層に設定しました
サブメニューは長めのタイトルでも問題なさそうです。

<SNSリンクの削除>
cocoonのテーマにした時に、以下のSNSリンクがデフォルトで発生しました。*以下は画像です。

これについて、「cocoon設定」⇒「SNSシェア」⇒「メインカラムトップシェアボタンを表示」をクリックし、「変更をまとめて保存」をクリックすることで削除することができました。

<ブログのテーマについて>
私は、スマブラSPが好きなので、備忘録も兼ねてスマブラについて書きまくりました。正直全キャラ書くのはしんどかったです。それなりに、アクセス数もあり、月に3000くらい行きましたが、アフィリエイトの利益額はとても少なかったです。RPM(表示回数 1,000 回あたりの見積もり収益額)がすごく低かったです。サイトの見やすさをあまり意識していなかったことも原因かもしれませんが、それ意外だと、そもそもスマブラが儲からないとも考えられました。というのも見る人がスマブラをやっている層は子供、学生などが多く、あまり無駄にお金を使わない、そもそもスマブラに必要なものは揃っているから買うものが無い、からです。
ということで、基本赤字ではありましたが、ブログ作りはそこそこ楽しいものであり、私としても良い経験になっているので良しとしましょう。あわよくば、そのうち利益が発生してほしいものです。
お金を稼ぎたいなら、購入経験とか、お得情報等のお金に直結するような内容の方が適しているように思われます。

<ボックスを枠線で囲む>
「白抜きボックス」を追加して、そこに文章を入力orコピペする。*左上の「+」から探す。けっこう下の方。何度も使用すると、文章入力の「ブロックを追加」からも選べるようになり、探すのが楽。

<リスト(箇条書き)>
ボックスと同様。「リスト」を追加。改行で新たな「・」が生成される。

<URLの変更>
先述の通り、間違って記載していた文字やリンクは基本的に「Better Search Replace」で置換できるのですが、ある時リンクが検索(および置換)できないことがありました。その際、リンクの編集から対象をコピーするのではなく、HTML編集をクリックしてから対象をコピーすることで、きちんと検索されたので、そのような状況になった方は、ぜひお試しください。

<URLの検索>未解決
Google Search Consoleにて「ページのインデックス登録 見つかりませんでした(404)」というエラーが発生しました。そのURLは「https://www.entertainformation.com/ブロックでサイトを作成/」で、以前、私が書いた記事で、変なURLがあてられたものです。URLは後から変更可能であり、この記事のURLを変更した記憶があります。しかし、その際、上記の「URLの置換作業」を忘れてしまい、今回のエラーメッセージが出た次第です。おそらく、リンクから飛ぼうとしても、そのURLが無効で入れないという状況になっているのでしょう。ここで、私はそのURLを変更した記事が何か忘れてしまいました。。。
そこで、「https://www.entertainformation.com/ブロックでサイトを作成/」をサイト内検索したのですが、それでは引っ掛かりませんでした。「Better Search Replace」で置換しようとすると8か所にこれが使われていることが分かったのですが、何に置換したら良いかが分かっていないため、置換作業はできません。「Better Search Replace」ではどこに「https://www.entertainformation.com/ブロックでサイトを作成/」があったかまでは教えてくれないのです。有料版なら教えてくれるみたいですが。ということで、現在対応を検討中です。

<テーマの削除>
WordPressのサイトから「外観」 ⇒「テーマ」を選択して、削除したいテーマを右クリック。「削除」を押せるようになるので削除。

<プラグインの削除>
WordPressのサイトから「プラグイン」 ⇒「インストール済みプラグイン」を選択して、削除したいプラグインを「無効化」。その後「削除」を押せるようになるので削除。

<最新の投稿を表示>
「設定」の「表示設定」の「ホームページの表示」を「最新の投稿」にチェックしました。これで自分のサイトを誰かが開いたときに、新しい投稿順に投稿が表示されます。また、より見て欲しい投稿についてはそれぞれの記事編集の右の「投稿」において「ブログのトップに固定」にチェックを入れることで、上記表示の上位に来るようにできます。

<表のセルの結合>
HTMLの編集をする必要があります。以下サイトを参考にしました。
https://uto-room.com/manual/wordpress/cocoon-table-cell/#:~:text=%E3%82%B9%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB%E3%81%A7%E3%81%8D%E3%81%BE%E3%81%99-,%E3%82%BB%E3%83%AB%E3%82%92%E7%B5%90%E5%90%88%E3%81%99%E3%82%8B%E3%81%AB%E3%81%AF,%E3%81%99%E3%82%8B%E3%81%93%E3%81%A8%E3%81%8C%E3%81%A7%E3%81%8D%E3%81%BE%E3%81%99%E3%80%82
端的には横のセル3つを結合したい場合、
目的のセルの前の<td>を<td colspan=”3″>に変更して、</td>の後の「<td></td>」2つを削除します。
before:<td>テスト</td><td></td><td></td>
after:<td colspan=”3″>テスト</td>
となります。

縦を結合する場合はcolspanをrowspanにして同様の編集を行います。

<ページ内リンク(ジャンプ)の作成>
リンク先のブロックの「高度な設定」の「HTMLアンカー」に言葉を入力。例)test
続いてリンク元のリンクボタンでリンク先に「#」と先ほどの「HTMLアンカーに入力した言葉」を入力。上記例の場合、ここでは「#test」となります。

以下のサイトを参考にしました。
https://webst8.com/blog/inpage-link/

コメント

タイトルとURLをコピーしました