WordPressでいずれテーマ変更をしたい人がテーマを選ぶ際の選び方と注意点

WordPressでいずれテーマ変更をしたい人がテーマを選ぶ際の選び方と注意点

WordPressはテーマ(テンプレート)がいくつもあり、手軽にテーマを変更することができるのが一つの魅力でもあります。しかし、テーマ変更自体はボタン一つでできたとしても、そのままではサイトの表示が大変なことになってしまいます。 そこでここでは、Wordpressのテーマを作ったり、テーマ変更やウェブサイトのリニューアルなどを経験してきている者として、テーマ選びの際に気をつけておきたいポイントをご紹介します。 WordPressにはどんなテーマがあるの? まず最初にWordpressにはどんなテーマがあるか見てみましょう。大きく分けて2つの違いがあります。 有料 / 無料 日本製 / 外国製 有料テーマと無料テーマの違い WordPressの有料テーマと無料テーマの違いは、もちろん文字通り有料か無料かではありますが、機能面での違いもあります。 有料テーマのメリット 有料テーマはデザインが美しいのは元より、独自の機能が使えたり、独自のカスタマイズ性が高いテーマであることが多いです。カスタマイズ性が高いテーマのものは、管理画面上でカスタマイズができるようになっているので、テーマ導入時の設定や微調整に時間を取られることがなく、サイト公開までの時間を大幅に短縮できます。 有料テーマのデメリット しかし、有料テーマのメリットが、時にはそのままデメリットにもなることもあります。テーマ内で利用していたテーマ独自のショートコードやカスタム投稿などは、テーマを変更する際にはそのまま引き継げませんので、テーマ変更をする際にこの部分の調整を行う必要が出てきます。 多少の調整で修正できるものなら良いのですが、テーマ独自の機能に頼り切っているような場合、調整に手間がかかり過ぎてしまい、簡単にテーマ変更をするメリットを享受することができません。(不可能ではないです) 無料テーマのメリット 無料テーマの一番のメリットは無料であるということですが、無料であるがためにシンプルな構造のものが多いということです。多くの有料テーマではそのテンプレートの独自デザインや機能の設定ができるようになっていますが、無料テーマの場合はそのような機能が付いているテーマは少ないです。(無いわけではありません) そのためテーマでコントロールするのはデザインのみで、サイトに必要な機能はプラグインで管理するなど、デザインと機能を分けて管理することができます。 無料テーマのデメリット 無料テーマは有料テーマと比べるとシンプルなものが多く、その分必要なところは自分で追加やカスタマイズする必要があります。自分でできる人なら良いですが、知識が少ない人だと大変です。 日本製と外国製テーマの違い 日本製のテーマのメリット 日本製のテーマのメリットは主に3つほどあります。…

WordPressタグクラウドのタグの前に#を自動で表示させてインスタグラム風にする方法【CSS初心者】

WordPressタグクラウドのタグの前に#を自動で表示させてインスタグラム風にする方法【CSS初心者】

WordPressでタグを使用していますか?タグ使用の是非に関しては色々ありますが、タグを上手く使うとサイトの利便性が高まったり、より詳細な記事の振り分けができて便利ですよね。しかし、無料テーマのものはデザインが若干ダサい場合も多いです。 そこで今回は、CSSだけでタグクラウドのデザインを整頓し、自動でタグの前に#を付ける方法をご紹介します。 タグクラウドとは WordPressで記事を書いた際にタグを付けておくと、カテゴリーとは別に自動でタグページを作ってまとめてくれます。 このタグをトップページやサイドバーに表示させるには、通常はタグクラウドというウィジェットを使います。 タグクラウドの初期デザイン タグクラウドでは、そのサイトで多く利用されているタグの文字が大きく、少ないタグは小さく表示され流ので、そのサイトがどんな事について書かれているかが一目でわかります。 初期のタグクラウドのデザイン しかしこのタグクラウド、標準ではデザインがイマイチ! 文字の大きさが揃っていないので、一気に乱雑な印象を与えてしまいます。 使用しているWordpressのテーマ(テンプレート)がタグクラウドのデザインに対応している場合は、もう少しマシな表示にはなりますが、この標準のデザインだと見た目に美しくないですよね。 タグクラウドのデザインを変更する そこで、タグクラウドのデザインを変更します。タグというからには、インスタグラムみたいにタグの前に#が表示するとそれっぽく見えますよね! ということで、今回はインスタグラムやTwitterなどのSNSのタグのように、タグの前に#を表示させることにします。 しかし、全てのタグの前に手動で#を付けるのは現実的ではないです。そこで、CSSでタグの前に自動で#を表示させるようにします。CSSで自動で表示をするから、タグ一つ一つに手動で#を付けるという間違ったことをせずに済みます。 タグクラウドのデザインCSS タグクラウドをインスタグラム風にするにはCSSを追加するだけでOKです。 ※マウスオーバーの色はお好みで変えることができます。 .tag-cloud の部分(class)はお使いのテーマによって変わってくるので、調べる必要があります。 タグクラウドのclassの調べ方 上記のCSSを追加しただけでは、テーマによってうまく表示されない場合もあると思います。その場合は、そのテーマに合わせて.tag-cloudの部分をお使いのテーマに該当するclassへ書き換えてください。 classの調べ方は、Google Chromeの検証機能(ウェブディベロッパー・ツール)を使います。 Google…

ニュースペーパーをイメージしたWordPress 有料テンプレート11選

ニュースペーパーをイメージしたWordPress 有料テンプレート11選

WordPressは初心者でもテンプレートを利用すれば、しっかりとしたウェブサイトが作れます。今回はニュースサイトを作るにあたって、ニュースペーパー(新聞紙)をイメージする有料テンプレートを調べたのでご紹介します。 テンプレートのイメージはニュースペーパー(新聞紙) 最近のテンプレートは以前と違って、写真を効果的に使えるようなテンプレートが増えましたが、今回は写真使いよりも文字を多く表示できるかを基準としました。 イメージはウォール・ストリートジャーナル(The Wall Street Journal)やThe New York Timesです。 最近は日本語のWordpressのテンプレートも多くなってきましたが、日本語のテンプレートでイメージに近いものが少なかったので、ほとんど英語のテンプレートになります。 海外のテンプレートを使用する際の注意点 海外のテンプレートは管理画面のメニューが英語だったりサポートが英語だったりして、若干敷居が高いと感じられるかもしれませんが、とても種類が多くデザイン性の高いものが多いです。 ただし、英語は1バイト、日本語は2バイトで表示されるので、英語のテンプレートを使うとフォントサイズが大きかったり、フォントの種類がイメージと違ったものになることが多いです。 たかがフォントですが、サイト全体のイメージが違ってしまうので、英語のテンプレートを日本語で使用する場合にはフォントの最適化が必要になります。 ニュースサイトにおすすめなテンプレート IloveNews デモ 詳細 白黒でクラシカルな見た目は、The Wall Street JournalやThe New York…

無料SSL(https)が使えるWordPressにおすすめレンタルサーバー比較【2019年】

無料SSL(https)が使えるWordPressにおすすめレンタルサーバー比較【2019年】

まだサイトのSSL化(https化)が済んでいませんか?何かよく分からないから後回しにしていて今まで来てしまったという人もいるかもしれません。 サイトでSSLを利用するには従来だと証明書の取得に費用がかかってくるので敷居が高いものでしたが、近年では無料で利用できるSSLが多くのレンタルサーバーで利用できるようになりました。 そこで今回は、無料のSSLが使えてWordpressにおすすめのレンタルサーバーを厳選してまとめました。 この記事がオススメな人 新しくサイトを開設するに当たって、最初からSSLで運営したいと思っている人 今あるサイトのサーバー移転の際にSSL化も考えている人 なぜSSLにする必要があるの? セキュリティ対策 SSLとはサイトのデータを暗号化して通信する仕組みのことです。ウェブサイトを常時SSLにすると、サイト上で発生する通信が全て暗号化されるため、セキュリティが強化されます。 セキュリティ面で大事なのはわかったけど、普通のブログやサイトだけならSSLにする必要が無いと思っていませんか?実はSSLはセキュリティ面だけでなく、他にもメリットがあります。 SEOで検索上位表示に有利になる サイトのSSL化はSEOにも重要だとGoogleが正式に発表しています。感覚的にはそこまで順位に影響があるものだとは思いませんが、例えば全く同じページがあったとしたら、httpのページよりもhttpsのページの方が上位に表示されるでしょう。 少しでも検索結果に優位になるのであれば、やらない理由が見つかりません。 ページ表示速度が速くなる 利用できる通信プロトコルはレンタルサーバーによって変わってきますが、HTTP/2プロトコルだと通信が高速化するので、SSL化したウェブサイトの表示速度が大幅に向上します。 SSLにすると具体的には何が変わるの? では、実際にSSLにした時に具体的に何が変わるのでしょう? URLの横に表示されるマークが鍵マークになる SSL化されていないサイトはアドレスバーのURLの横に( i )マークが表示されています。しかしSSL後はアドレスバーに表示されるマークが鍵マークになります。 URLがhttpsになる ウェブサイトをSSL化するとURLがhttpからhttpsに変わります。たった一文字変わるだけですが、URLが変わることで、SNSシェア数やRSSフィード数がリセットされるなどのデメリットもあります。 レンタルサーバーを選ぶ上で知っておきたいキーワード 共用SSLと独自SSLの違い…