ページ送りは↓これの事です。
![応援しあうWeb活用術~アメブロカスタム・集客術~-1](https://stat.ameba.jp/user_images/20110104/22/hiroyoko3/9a/e1/p/o0217002610962796076.png?caw=800)
デフォルトのままだと、ちょっと小さくて、あまりに目立ちません。
でも、このページ送り、かなり重要なんです。
それは、あなたの記事を見てくれた人が他の記事も見たいと思った時、別のページに飛ぶ重要なリンクだからです。
なので、ちょっと目立たせる工夫をしてみたいと思います。
今回は、こんな風にカスタマイズしてみたいと思います。
![応援しあうWeb活用術~アメブロカスタム・集客術~-2](https://stat.ameba.jp/user_images/20110104/22/hiroyoko3/1f/ce/p/o0258004010962796048.png?caw=800)
まず、【アメブロカスタム】CSSの編集方法 を参考にして、CSSの編集画面に行って下さい。
そして、下の記述をCSSの一番下にコピペして下さい。
説明もコメントで書いてあるので、それを参考に色々とカスタムしてみて下さい。
一つだけ注意点。
通常はページ送りの間に | の区切り文字が入っています。
今回は箱型にしたので、この区切り文字は必要ありません。
なので、区切り文字の色を背景と同様にしています。
さらに、その区切り文字の大きさで、箱の間隔を調整する事ができます。
.page の font-size が「箱の間隔」になっているのはそういう意味です。
/* ページ送りの設定 */
.page{ /* 区切り | の設定 */
font-size:4px; /* 箱の間隔 */
color:#ffffff; /* 区切り文字の色 */
}
.page a{ /* 現在以外のページの設定 */
color:#ffffff; /* 文字の色 */
font-size:13px; /* 文字の大きさ */
background:#a1d0a1; /* 背景の色 */
border:1px solid; /* 枠の形 */
border-color:#ffffff; /* 枠の色 */
text-decoration: none; /* リンクの下線 */
padding:5px; /* 四角の大きさ */
}
.page .now{ /* 現在のページの設定 */
color:#000000;
font-size:13px;
background:#ffffff;
border:1px solid;
border-color:#000000;
text-decoration: none;
padding:5px;
}
.page a:hover{ /* マウスがのった時の設定 */
color:#000000;
font-size:13px;
background:#ffffff;
border:1px solid;
border-color:#000000;
text-decoration: none;
padding:5px;
}