【wordpress】オリジナルテーマを作る土台Bonesを使おうとしたがSassで挫折(汗)

カスタマイズ専用のテーマ BONES

今回の新サイトからワードプレスの既存のテーマを使わずに新たにサイトに合ったテーマを作らなくてはいけない状況になって1から作ってみようという試みをしているんですが、

デザイナーじゃないのでプロっぽいサイトにならないというか変な感じで・・・なかなかレイアウトがうまくいかず苦戦しています。

Twenty

で、通常だったらワードプレスのデフォルトテーマの「Twenty Fifteen」や「Twenty Fourteen」を自分用のテーマにカスタマイズしていくと思いますが、テーマを作る土台としてのテーマがあったのでそれを使ってみます。

BONES

Bones is a WordPress Theme for Developers Built around the latest in Web Standards, Bones is a rock solid foundation to start any WordPress project. Keep what y...

なにやらHTML5対応、レスポンシブ対応と最初から使いやすそうです。

こちらのサイトからBONESのテーマをダウンロードできます。「Download for Free」を押せば始まります。

eddiemachado-bones-v1.06-726-g9db85e4.zip

ZIPファイルがダウンロードできました。解凍してみましょう。

BONES

フォルダーができましたがこんな名前だとアレなので自分のテーマの名前を決めて変更してみます。

今回は、試しにフォルダーを「items」に変更しました。さらにStyle.cssのTheme nameも変更しないとテーマとして認識されないので変更します。

Theme Name 変更

これでとりあえず完了でワードプレスがインストールしてあるテストサーバーにて試してみます。

public_html/wp-content/themes/items

場所はテーマディレクトリにアップロードしました。

オッサン骸骨

外観 > テーマを見てみると”オッサン ガイコツ”が表示されました。テーマ名はitemsになってます。

有効化してカスタマイズしてみましょう。

Sassの環境構築するのメンドウなので素のCSSを使おうと思ったが余計メンドウ

BONESはSassは簡単?な記述でCSSを吐き出すようで、変数も使えちゃったりして便利そうですがコンパイルしないといけないメンドウな側面もあってかちゅうちょしちゃいます。

一応以下のサイトでリアルタイムにCSSにコンパイルできるようですがどうなんでしょう?

SassMeister is a playground for Sass. Add some Sass and SassMeister will show you the rendered CSS.

スミマセン、BONES、ちょっとSass使ってて今は必要性を感じない。

Sass覚えるのが・・・メンドウなのでとりあえずBONESやめておきます。

役に立たない記事になってしまいましたがメモとして保存しておきます。

気が向いたらSass勉強してBONESについて研究した場合はこちらの記事に追加します。

ワードプレスの土台になる他のテーマ探さなきゃ、デフォルトのテーマを改造しようか?

シェアする

  • このエントリーをはてなブックマークに追加

フォローする