区切り線について

  1. カスタマイズされたLiquid→カスタムCSSで区切り線のコードを入れたいのですが、うまくいきません。どなたかコピペできるコードを教えていただけないでしょうか…区切り線を入れる方法があれば、これ以外の方法でも構いません。

  2. フッターに区切り線が入っているのですが、これを消す方法をご存知の方はいらっしゃいますか…?

  3. ブログ記事の見出しの文字を小・中・大・特大・4Lより小さくする方法をご存知のかたはいますか?

使用しているテンプレートはDawnになります。

どうぞよろしくお願いいたします。

@_6_6

  1. いくつか方法がありますが、一番シンプルな方法はクラスに対してborderつける方法かと思われます :bird:

以下は上下に区切りをつけたサンプルコードです。あとは単純にhr要素を記述するとかでしょうか。


    

テキスト

.custom-liquid {
  border-top: 0.1rem solid;
  border-bottom: 0.1rem solid;
}

  1. 一番簡単な方法はフッタークラスに適用されているborder-topを無効化することです。
    テーマのカスタマイズのカスタムCSSで以下記述することで消すことができます。
    ここではフッター自体とフッターの下部コンテンツに対しても消すようにしました。
.footer,
.footer__content-bottom {
  border-top: none !important;
}

  1. こちらもテーマのカスタマイズのカスタムCSSで以下記述することで任意のサイズに設定可能です。
    em, rem, pxの単位選定やレスポンシブ設定はご自身のサイトのコンセプトに合わせてください。
.article-template__title {
  font-size: 1em;
}

回答にズレがある、ここがもっと知りたいなどあれば再度コメントいただけますと幸いです。

1 Like