Hiromuブログ(夏)

どこにでもいるただのホロレンジャーです

css

ブログエディタMarsEditの利用

さて、WordPressのオリジナルテーマが完成したところでエディタについて。 オリジナルのテーマが作れるということはHTML,CSSであれば問題なく使いこなせるという状態ではないでしょうか。 そうであればMacから投稿する場合は、MarsEditの利用をお勧めします…

コメント投稿後の画面遷移不具合解消

不具合第2弾です。 前回の対応でコメント投稿後画面が真っ白になることはなくなりましたが、次はコメント投稿後、投稿したコメントよりも上にスクロールできなくなっていました。 この原因はcssにありました。 不適切な場所にoverflow:hiddenが設定されてい…

ナビゲーション(次の記事、前の記事)の実装

今回はページ下によくあるナビゲーション(次の記事、前の記事)について。 どのサイトにもだいたいあるごく普通のものですがWordPressのテーマとして実装するにはそれなりに苦労しました。 実装したものは以下のようになっています。 まず一番上が通常の状…

HTMLのオリジナルテーマ化

今回は作成したHTMLのテーマ化について。 正直今回テーマを作るまで何をしていいのかよくわかっていませんでしたが「はじめてWordPressのオリジナルテーマを作るときの参考になればと思って書きました(サンプルダウンロード)」のサイトを参考に順に進めて…

画像を使ったパンくずリストの実装

今回はパンくずリストのHTML化について。 「パンくずリスト」とはよくサイトの上の方にあり、いまどこにいるのかを示すリンクのことです。 こんなやつ 童話「ヘンゼルとグレーテル」で森で迷子にならないように通り道にパンくずを置いていったというのが語源…

オリジナルテーマ化・各記事ページのデザイン検討

今回は各記事のページのデザイン検討について。 トップページのデザインは済んでいるので、だいたいの場合はそれを流用したデザインになると思います。なので今回新たに考える部分は、文章を装飾する各タグを使ったときにどのように見せるかというところがポ…

オリジナルテーマ・HTML化作業

デザインを考えたら、次はHTML化作業です。 WordPressのテーマはPHPを利用して作りますが、PHPを利用しても結局のところ最終的なアウトプットはHTMLになります。(PHPを利用して「こういうHTMLを出力してください」とお願いする感じ) HTML化作業をしてしま…

WordPressオリジナルテーマへの道

WordPressのオリジナルテーマを作る過程を以下にまとめてみました。改めてまとめてみると結構なボリュームになりました。リンクが張ってある部分はその工程の詳細について書いているので興味のある方はご覧ください。 1日目 ブログトップページのデザイン検…

Apple Keyboard風のショートカットの表記

こちらの記事で紹介されているショートカットの表記はきれいでいいですね。 WordPressの今のテーマで無理やりstyleタグをエントリー中に埋めたら以下のようになりました。 予想外にちゃんと表示されましたw body { padding:20px; height:100%; font: 20px h…

トップページをようやく更新

一番トップのindex.htmlを更新しました。 初めてiPhoneアプリを作った時に間に合わせで適当に作っていたまま放置していましたが、HTMLとCSSを書き直しました。 見た目はほとんど変わっていませんが(^^;) 更新に合わせて最近作成したLabsページへのリンクも追…

CSSを覚えたのでテンプレみたいなものを作ってみた

せっかくCSSを覚えたので忘れないうちに自分なりのテンプレを作ってみました。 こちらで公開していますので気になる方はご覧ください。 こんな感じのWebサイトです。少しフラットデザインっぽいかもw せっかくなのでソースも貼り付けておきます。 HTMLファ…

CSSのメモ

このページを結構苦労しながら手探りで作っていましたが、 やはり効率が悪すぎるので今更ながらまじめにCSSを覚えました。 今回はこの本をけっこうじっくりと読みました。実践的なサイト作りについて丁寧に解説されており大変参考になりました。 HTML&CSS標…