男性
AFFINGER5（アフィンガー）で使用できるCSSの装飾について色々知りたい！
こんな悩みに答えます。
稼ぐことに特化したWordPressテーマ「AFFINGER5（アフィンガー）」。
今回はスマホでの表示をすっきりさせる「スライドショー」についてご紹介します。
スライドショーを使うとサムネ表示され視認性が高まりますよ！
AFFINGER5（アフィンガー）なら使うべき「スライドショー」とは
こんなのを指します↓
AFFINGER5の記事
【WordPressプラグイン無し】Prism.jsを使ってソースコードを綺麗に表示させる方法
こんな悩みにお答えします。 多くのサイトでCSSやHTMLなどのコードを記載されていますが、中にはSyntax Highlight（シンタックス ハイライト）というもので綺麗に表示されているものが多くあります。 方法はプラグインをいれることでできたりしますが、設定が難しかったり、使い方がいまいちだったり... 導入したもののうまく機能しなかったりと様々なエラーがありますよね 筆者も色々と調べた結果、プラグインを使わずに表示する方法が一番簡単でしたので、ご紹介いたします。 目次1 Syntax Highli ...
【AFFINGER6】「ヘッダーを分割しない」が解除出来ない時の解決方法【JET】
男性サイトロゴの配置で真ん中に設定してたけど、設定を外しても変わらない... なんで～（泣） こんな悩みにお答えします。 サイトロゴの配置を試行錯誤しているうちに、サイトロゴの位置を中央配置から左寄せに戻そうとしたときに設定を変えても戻らなかったため、その解決方法をご紹介いたします。 本記事ではテーマエディターを編集します。テーマエディターの編集は自己責任のため、バックアップを取ってから作業するようにしてくださいね。 まだ、中央配置の設定をしてない方は、こちらを先に御覧ください。 目次1 「ヘッダーを分割 ...
【AFFINGER6】サイトロゴを左寄りから中央配置にする方法
女性AFFINGERの初期設定だとサイトロゴが左側だけど、中央に配置している人もいるよね？どうすればいいんだろう？ こんな悩みにお答えします。 ブログの信頼性やかっこよさに大きな役割を担っている、「サイトロゴ」 先輩方のブログを見ていると、おしゃれなロゴが多いですよね。 でも、安心してください。多くのブロガーさんが最初から完璧なデザインで始めたわけではありません。 9割近くの人が、運営していく中でシフトチェンジしたり、よりブラッシュアップしたりしていると思います。 今回はそんなサイトロゴの配置位置に関する ...
【AFFINGER6】サイトロゴ、ファビコン、アイコンの設定方法【結構重要】
女性・ブログを作ったけど、ロゴとかって作ったほうがいいの？ ・どうやって作ればいい？ ・ブラウザのタブに表示してみたい こんな悩みお答えします。 ブログ作ったばかりの初心者の方で陥りやすいのが、「デザイン」です。結論から話すと、デザインなんかより記事を書くことが大事です。 だけど、見た目を整えたい！！こんな人は多いのでしょうか？かく言う私もその一人です笑形から入るタイプなので、細かいところがずれてたりできてなかったりすると気になって記事どころではありません...笑 さて、サイトデザインとは少し異なるかもし ...
【AFFINGER5】吹き出しの設定と作り方
稼ぐことに特化したWordPressテーマ「AFFINGER5（アフィンガー）」。 今回はページ数リンク、ページャーのカスタマイズをご紹介します。 当ブログおすすめしているブログテーマ「AFFINGRE5（アフィンガー）」をまだ導入してない方はこちらをどうぞ。 AFFINGER5（アフィンガー）では画像の設定を事前にしておく必要がありますが、 最初にやっておけば、記事作成時はとても楽になります！３分で終わります！ 目次1 AFFINGER5（アフィンガー）の吹き出 ...
一つの箇所で、スライド表示させることができ、TOPページなどで使うとすっきりします！おしゃれ！
では、やり方を見ていきましょう。
AFFINGER5のスライドショーの作り方
記事作成画面のエディターから
タグ＞記事一覧＞カテゴリ一覧（スライドショー）
から作成できます。
できるショートコードは
st-catgroup cat="0" page="5" order="desc" orderby="id" child="on" slide="on" slides_to_show="3,3,1" slide_date="" slide_more="ReadMore" slide_center="on" fullsize_type=""
ですね（［ ］は削除しています）
文言の記載方法は、
st-catgroup cat="8" page="5" order="desc" orderby="id" child="on" slide="on" slides_to_show="3,3,1" slide_date="off" slide_more="" slide_center="on" fullsize_type=""
- cat="" にスライドショーにする記事のカテゴリを入力する
※例: cat="0" （0は新着記事）
- page=""に表示する記事の数を入力する
※例: page="5"
- slide="on"でスライドショーになる
- slides_to_show=""は端末ごとの同時表示数設定
※例: slides_to_show="3,3,1" だとPC3枚、タブレット3枚、スマホ1枚を指す
- slide_date=""はアイキャッチ右下に公開日（更新日）の表示設定
- slide_more=""は続きを読むボタンの文言
※例: slide_more="ReadMore"
ポイント
カテゴリーIDはWordPress管理画面＞カテゴリーから確認できます！！
スマホ表示でもすっきりしますし、PCでも記事が長くならないので覚えておくといいですよ！
プレビューで見ながら書くと出来上がりのイメージが付くかもしれません。
これだけ！
まとめ：AFFINGER5使ってるならタグ装飾はすごい簡単
以上、今回は「タグ」ついてご紹介しました。
すごい簡単ですよね。
WordPressそもそもの機能がすごいので、
HTMLやCSSの知識がなくても、
おしゃれな装飾が簡単にできます。
特にAFFINGER5だと様々な種類ががあるので、
使いこなすほうが難しいです笑
今後もこういったAFFINGERに関することを紹介していきます。
お疲れさまでした。
