Wordpressでのポートフォリオ作り中間発表

Wordpress

4/19(金）時点での進捗まとめ
4月に入ってからWordpressでのポートフォリオ作りに取り組んできましたが、四苦八苦です。
まだ先生とみんなにレビューもしていません。（本来は一週間前の金曜にレビューするスケジュールだったが・・。）
とてもお見せできる段階ではないですが、後の振り返りのためにこの辺りで一回、これまでの道のりを振り返っておこうと思います。
少しだけ、掴めた感じがします‥。

4/21(日)時点でのデザイン
とてつもなくダサいかも・・
20130422103308
テーマはデニムとタータンチェック（ブラックウォッチ柄）いつも自分が好きで着ている洋服のイメージ、自分の分身という事でこのデザインにしています・・。


Twenty Elevenをテーマとして選択
レスポンシブでベーシックなテーマなので、カスタマイズしやすいだろうと期待して選択。しかし・・・楽な道ではありませんでした。

トップページの画像をデフォルトから変更する
まず、どのサイズの画像にしたらうまく表示されるかがわからない。
試行錯誤の結果幅1000px、高さ150pxだと上手く表示されることがわかったので、それで行くことにしました。
固定ページのアイキャッチ画像も同じサイズにしました。

ヘッダー画像の指定はfunctions.phpにある
ヘッダー画像、つまりトップページの画像ですが、サイズ指定はfunctions.phpで指定されていることが最近判明しました。
最初に非常に苦労した部分です・・

cssを編集して細かいデザインを変更
テーマ編集のstyle.cssの一番最後のエリアから、自分のカスタマイズ記述を書いていきます。
後から書いたほうで効果が上書きされますので、デフォルトのCSSと区別するためにこのようにします。
ここから自分の！とわかるようにコメントアウトを丁寧に書いておきます。

投稿本体ページにサイドバーを出す
single.phpのget footerの直前にの一文を入れる。
しかし、結局コメント欄の表示について思い通りにコントロールできず、サイドバーなしの表示に戻しました・・。

投稿一覧ページに表示されるコメントにリンクする吹きだしを消す

20130421005639

content.phpの28行目くらいに入っている、下記のコメントに関する部分を削除する。

<?php if ( comments_open() && ! post_password_required() ) : ?>
      <div class="comments-link">
        <?php comments_popup_link( '<span class="leave-reply">' . __( 'Reply', 'twentyeleven' ) . '</span>', _x( '1', 'comments number', 'twentyeleven' ), _x( '%', 'comments number', 'twentyeleven' ) ); ?>
      </div>
      <?php endif; ?>

WordpressにSyntax High Lighterを入れる

  • プラグインでSyntax High Lighter Evolvedをインストール
  • 有効化
  • 設定をほとんど初期設定のまま保存
  • ソースコードをSyntax High Lighterで装飾したいページの編集画面を開き、ソースコードの前後を[html][/html]ではさむ。
  • [php][/php]でも良い。
  • [css][/css]でも良い。

このように見えます。
20130422103843