タグ

ブックマーク / tsumaboku.com (3)

  • 記事一覧ページをタイル状に配置する(Twenty Seventeen)-WordPress – 妻と僕。

    WordPressの無料テーマ「Twenty Seventeen」の記事一覧ページは、全ての記事をそのままつらつらと並べただけでとにかく見にくいです。「moreタグ」を使って多少はすっきりとできますが、それでもぱっと見どのような記事があるのか分かりにくく、サイトに訪問してくれた方に対して優しいものではありません。 そこで、各記事の情報をコンパクトにまとめて表示し、それをタイル状に敷き詰めることで見やすく、そしてスタイリッシュな記事一覧ページにカスタマイズしたいと思います。 《 目 次 》 今回変更するPHP PHPを子テーマにコピー index.phparchive.phpの変更 style.cssへ追記 Masonryの導入とheader.phpの変更 今回変更するPHP 今回手を加えるPHPは「archive」「header」「index」「content」と少し多めです。 ここを見

    記事一覧ページをタイル状に配置する(Twenty Seventeen)-WordPress – 妻と僕。
  • テーマ Twenty Seventeen を使ってブログをカスタマイズ(目次)-WordPress – 妻と僕。

    WordPressの初心者が無料のテーマ「Twenty Seventeen」を使用してブログをカスタマイズしていきます。 このページは、カスタマイズについて記述した記事のサイトマップ(目次)的なものとお考えください。ですので、カスタマイズの関連記事をアップするたびにここを更新していく予定です。 スポンサーリンク テーマを編集する時に絶対役立つツール ブログを始めてから4ヶ月。「WordPress」という言葉さえ知らなかったブログ超絶初心者の僕です。初心者の僕がテーマをカスタマイズできているのは、Google先生がなんでも優しく教えてくれるのと、ドラえもんの道具みたいに便利な『デベロッパーツール』を使用しているから。テーマのカスタマイズにおいて、この『デベロッパーツール』を知っているか知っていないかで、カスタマイズのしやすさに天と地ほどの差がでるので、知らなかった人は是非使ってみてください。

    テーマ Twenty Seventeen を使ってブログをカスタマイズ(目次)-WordPress – 妻と僕。
  • Twenty Seventeen アイキャッチ画像の位置変更(非表示も可)-WordPress – 妻と僕。

    と僕。 人生初ブログ。ブログ完全初心者のサイトです。アニメやべ物の感想。そしてwordpressについて経験したことを記述します。 「Twenty Seventeen」のアイキャッチ画像領域は、記事とサイドバーの上に画面横幅いっぱいにスペースが設けられている。まさにアイキャッチ!とばかりに主張するこのレイアウトですが、画像サイズの全体とのバランスが難しい。 「表示画面の横幅いっぱいにあるアイキャッチ領域」 画像サイズが大きいとアイキャッチが主張しすぎるし、画像が小さいと左右の余白が広く少し寂しく感じます。そこで、この画面横幅いっぱいの領域を削除し、記事上に記事幅の領域内で表示されるようカスタマイズしたいと思う。 このカスタマイズで変更するPHPファイル 今回のカスタマイズで手を加えるのは、「style.css」の他に「header.php」と「single.php」です。手を加える箇所

    Twenty Seventeen アイキャッチ画像の位置変更(非表示も可)-WordPress – 妻と僕。
  • 1