何故導入したのか
SNSのアカウントを持っていない人やそれほどでもない時に、押してもらいたいから。
(^^/タシカdjugがツカッテイルテンプレートガ、「F-light」ダッタヨネ?
いろいろ戸惑って何回も、さめさんに問い合わせフォームから質問しました(笑)
何回くらいかは忘れましたが、せめて5回くらい?は質問したような気がします。
でふじやんさんのブログの「F-light版はてなスターの設置」の記事をふと思い出して「もしやここにヒントがあるのでは?」と思った。
その後にその方法でカスタマイズしてみたら、案の定カスタマイズが成功したということ。
最後に
僕の質問を受け取ってくれたさめさん、設置方法の参考になったふじやんさんありがとうございました。
またわからないことがあったら質問させていただきます。
以上!
コメントを投稿
別ページに移動します2 件のコメント (新着順)
CSS の上下にあるタグを消してください!
<b:if cond='data:view.isPost'>
<style>
と
</style>
</b:if>
以上の4行は不要です!
あとついでにこちらも追加で(この記事にいいねしてね が中央寄せになります)
.like h3 {
text-align:center;
margin-bottom:.5em
}
深夜に失礼します。
また表示がおかしくなってる所があって気になったもので。
ブログタイトルの上の左端に /*]]>*/ が出ちゃってますが、これはいいねボタンの CSS に余計なタグを付けてしまっているせいです。
以下のようにすれば直ると思うのでお試しください。
あ、あとついでにいいねボタンの位置や色がいい感じになるように調整しておきましたので😉
<b:if cond='data:view.isPost'>
<style>
.like{
margin: 2em 0;
padding: 0;
line-height: 1;
font-size: 15px;
}
.like-button{
display: block;
margin: 0 auto;
padding: .5em;
width: 100px;
background: #333;
color: #fff;
text-align: center;
border-radius: 3px;
}
.like-button:not([disabled]):hover,
.like-button:not([disabled]):focus,
.like-button[disabled]{
background: #666;
}
</style>
</b:if>
↓↓このように変更
.like{
margin: -2em 0 3em;
padding: 0;
line-height: 1;
font-size: 15px;
}
.like-button{
display: block;
margin: 0 auto;
padding: .5em;
width: 100px;
background: var(--color);
color: var(--dark-bg);
font-weight: bold;
text-align: center;
border-radius: 3px;
}
.like-button:not([disabled]):hover,
.like-button:not([disabled]):focus,
.like-button[disabled]{
background: var(--dark-color);
}