サポート » 使い方全般 » TOPページにて各記事を見やすくする境界線を付けたい

  • 解決済 uwakiconsul

    (@uwakiconsul)


    twentytenを使用しています。

    TOPページに記事を5つ表示させるようにしていますが、各記事の境界線が何もなく見づらい状態です。

    各記事の一番下(カテゴリーやコメントをどうぞ)の箇所の下あたりに線を入れたいと思っています。

    各記事をクリックして、個別記事ページになると、コメント欄の上に線が入っています。

    それと同じようなものを入れたいのですが、何処をどう触れば良いか分かりません。

    色々と検索しましたが、分かりませんでした。

    ご教授頂けます様、宜しくお願いします。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • TOPは固定ページでしょうか?
    テーマを編集する事になると思います
    ループで5件表示していると思うのですが
    一件表示ごとに間に画像を挟めばいいと思うのですが
    現在コードがどのように書かれているかもわからない状況なので悪しからず

    トピック投稿者 uwakiconsul

    (@uwakiconsul)

    TOPは固定ページではありません。

    twentytenのテーマをそのまま何も編集せずに使用しています。

    ベーシックな区切り線(<HR color=”#000000″ size=”1″ width=”100%” align=”left”>)をトップページの各記事の間に挿入したいと思いますが、どこから編集すれば良いでしょうか?

    ダッシュボードのテーマ編集の箇所からテンプレートの編集ができそうですが、具体的にどこに挿入すれば良いか分かりません。

    色々調べたのですが分からず、恐縮ですがご教授下さい。

    uwakiconsul 様

    こんにちわ、編集していないと言うことは、ウィジェットなどで最新の投稿を表示していると言うことでしょうか?

    それであれば、表示部分のリスト要素等に「widget_recent_entries」等のクラスが振られていると思いますので、CSSにてborder-topやborder-bottom等で装飾すればいいと思います。

    トピック投稿者 uwakiconsul

    (@uwakiconsul)

    ありがとうございます。

    編集していないというのは語弊があったかもしれません。

    現在は、ブログのTOPページに新着記事が5つ表示される設定になっています。

    上記の設定にする為に、オプション等を少し触っているかもしれませんが、html等の細かい部分は全く触っていいません。

    その場合、仰るようにborder-topやborder-bottom等は何処に挿入すれば良いでしょうか?

    外観 → テーマ編集から スタイルシート編集(style.css)

    530行目あたり

    .hentry {
               margin: 0 0 48px;
              }

    .hentry {
        border-bottom: 1px solid #E7E7E7;
        margin: 0 0 38px;
        padding-bottom: 10px;
    }

    などに変更。細かい調整はお好みでどうぞ。

    twentytenなどはバージョンアップで上書き等されてしまいますので
    子テーマの利用をおすすめします。

    トピック投稿者 uwakiconsul

    (@uwakiconsul)

    wizfreek様

    上記の通り修正すれば区切り線を導入することができました。

    感動です、大変初歩的な内容にお付き合い頂き、誠にありがとうございました。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • トピック「TOPページにて各記事を見やすくする境界線を付けたい」には新たに返信することはできません。