FrontPage

WordpressのスタイルをQHMに組み込む方法

WordpressのデザインをQHMに適合させる方法は2通りあります。自分にあった方法でやるのがよいかと思います。

考え方

なるべく、お手軽にスタイルを適合させたい。できれば、phpは修正したくないな。

WordpressとQHMの違いは何でしょうか?

 QHMWordpress
用途ホームページ作成ブログ用
構成6パートのみ6~7パートが主
CSSmain.css独自(style.css)
テンプレートpukiwiki.skin.phpsidebar.php, header.php, footer.phpなどを改造

Wordpressテンプレートの見つけ方

  • なるべく、6パートのものを選びます。6パート以外でも適用できますが、不要部分を削除したりしないといけないので手間がかかります。

方法1.CSSをWP AdapterでQHM用に変換

この方法は北研が作成したWP Adapterを利用します。WP AdapterがWordpressのテンプレートを自動でQHMのスタイルにあわせてくれますが、phpのソース修正が必須です。

  • WordpressのPHPソースを修正して、無理やりQHMに合わせます。あまり細かい修正にこだわらないほうがよいです。
  • CSSは、Wordpressのものをほぼそのまま使用します。修正が必要なときもあります。
  • QHMのデザイン変更は、/skin/wordpress/ 配下にWordpress用のPHP, CSS, imageなどのファイルをコピーします。

◆メリット:

  • PHPのソースが理解できる人はいろんな形に改造できます。
  • QHMと相性の良いデザインはたぶん少しの修正で利用できます。

◆デメリット:

  • PHPのソースが理解できないと改造できません。
  • CSSもある程度理解していないと改造は厳しいでしょう。
  • ブログ用なので、適合しないところも多数あります。
  • 相性が悪いテンプレートのときは、画面が真っ白になりまったく表示されないときもあります。
  • QHMのおまじないが思うように動作しないときがあります。

方法2.QHMのCSSをWordpressのCSSに入れ替える

  • WordpressのPHPソースは修正しないで、WordpressのCSSだけを使用します。
  • または、Wordpress以外のCSSをQHM用に改造して取り込みます。
  • CSSは、QHMのものに適合するように改造します。
  • QHMのテンプレートであるpukiwiki.skin.phpを改造する場合もあります。
  • QHMのデザイン変更は、/skin/hokukenstyle/ 配下にQHM用に改造したCSSファイル(main.css)とimageファイルとpukiwiki.skin.phpをコピーします。
    以下のサイトで配布しているテンプレートはこの方法です。

当サイトのWPのCSSは、QHM Temps からダウンロードさせていただきました。
ありがとうございます。

◆メリット:

  • PHPのソースが理解できなくても改造できます。
  • QHMのスタイルをそのまま利用するのでSEO上都合がよいと思われます。
  • QHMのおまじないが全部利用できます。

◆デメリット:

  • CSSが理解できないと改造できません。
  • 結構手直しが必要なときもあります。

結論

自分にあっている好きな方法で改造するのがベストですが、強いてあげると方法2の
CSSだけを適合させる方法が問題が少ないような気がします。

ご意見箱

皆様のご意見をお待ちします。


認証コード(4856)

当ページは役に立ちましたか?

選択肢 投票
たいへん役に立った 49  
ちょっとだけ役に立った 5  
普通 0  
あんまり 21