デイトラweb制作上級編 DAY18~19
nakano
自作コード（＋ショートコード）でサイドバーを作る
※Day17で作成したsidebar.phpは名前を変更して無効にして、また新しくsidebar.phpを作る
サイドバーの作成
1. プロフィールと検索ボックス
→ 「get_search_form」で標準の検索ボックスが作れる（sidebar.php）
2. 人気記事トップ5
→ functions.php + sidebar.php
3. 新着記事トップ5
→ sidebar.php
4. 日付アーカイブ
→ sidebar.php
2.のキーワード
・do_shortcode()
→ ショートコード用
・get_post_meta()
・delete_post_meta()
・add_post_meta()
・update_post_meta()
・is_user_logged_in()
・アクションフック『template_redirect』
5.キーワード
・wp_get_archives()
ショートコードの使い方
2. 「サムネイル付きの人気記事を５件表示」したいとき
<?php echo do_shortcode('[wpp range="last7days" limit=5 stats_views=1 order_by="views"]'); ?>で表示することができる
3. 「サムネイル付きの新着記事を５件表示」したいときは
<?php echo do_shortcode('[rpwe limit="5" thumb="true"]'); ?>で表示する（thumbはサムネイル）
※自作コードはいらない代わりにプラグインは入れておく必要あり
プラグイン公式ページ
人気記事の1～3位をメダル色に変更する
「.m_ranking .wpost-item」の疑似要素で1~5位が表示されているため、
/* style.css */
.m_ranking .wpost-item:first-child::after {
background: #DBB400;
}
.m_ranking .wpost-item:nth-child(2)::after {
background: #C9CACA;
}
.m_ranking .wpost-item:nth-child(3)::after {
background: #C47022;
}で1~3番目を上書きする
まとめ
今回は自作コードでサイドバーを作りました。
ショートコードを使うと自作コードを作らずに済むので簡単に実装できますね！
それはそうと今日も知らない関数がたくさん出てきて整理するのが大変です。。。
