ヘッダー全般

  • 著者:管理人
  • 記事の最終変更日:2024年9月16日

CSS

ダッシュボード>外観>カスタマイズ>追加CSSや、Scripts n Styles（プラグイン）等でコピペして使用します。

				
					/*サイトヘッダー固定（全デバイス全ページに効果）*/
header#site-header {
    position: sticky;
    top: 0;
}
				
			
				
					/*ページヘッダー固定（サイトヘッダー高さ考慮、全デバイス全ページに効果）*/
header.page-header {
    position: sticky;
    top: 73px;
    z-index: 2;
}
				
			
				
					/*ページヘッダーの背景色をグラデーションに＋余白調整*/
.page-header {
    position: relative;
    background: #ffffff; /* Fallback for older browsers */
    background: linear-gradient(to bottom, #ffffff 10%, #f5f5f5);
}
@media(max-width:959px){
.page-header {
    padding:0px 0 5px ;
}
}
@media(min-width:960px){
.page-header, .has-transparent-header .page-header {
    padding: 0 0 10px 0!important;
}
}
				
			
				
					/*ホームでのヘッダータイトルを中央から左寄せへ（他は左がデフォ）*/
body.home .page-header-inner {
    text-align: left;
}
				
			
				
					/*サブヘッダー非表示（ショップテンプレート）*/
.clr.page-subheading {
    display: none;
}
				
			
				
					/*カスタマイザーで設定した大きすぎるpngロゴを縮小*/
img.custom-logo.wp-post-image.wp-post-image.lazyloaded {
    width: 225.5px;
    height: 45.5px;
}
				
			
				
					/*パンくずリストのオーバーフロー時に横スクロール可へ*/
ol.trail-items {
    overflow-y: auto;
}
				
			
				
					/*モバイルでのパンくずリストだけなぜか左寄せなのを右寄せに*/
@media(max-width:959px){
.site-breadcrumbs {
    float: right;
}
				
			
				
					// システム情報を取得して表示するショートコード[version_info]を作成
function wp_php_version_shortcode() {
    // WordPressのバージョン情報を取得
    $wp_version = get_bloginfo('version');
    
    // PHPのバージョン情報を取得
    $php_version = phpversion();
    
    // バージョン情報を表示するHTMLを返す
    $output = "<p>WordPress $wp_version</p>";
    $output .= "<p>PHP $php_version</p>";
    
    return $output;
}
add_shortcode('version_info', 'wp_php_version_shortcode');

// データベース情報を取得して表示するショートコード[db_info]を作成
function db_info_shortcode() {
    global $wpdb; // WordPressのデータベースクラスにアクセスするために必要
    
    // データベースのバージョン情報を取得
    $db_version = $wpdb->db_version();
    
    // データベースの情報を表示するHTMLを返す（MariaDBは当サイトの場合）
    $output = "<p>MariaDB $db_version</p>";
    
    return $output;
}
add_shortcode('db_info', 'db_info_shortcode');

PHP追加

PHPは、①ダッシュボード>外観>テーマファイルエディター>テーマのための関数（functions.php）や②「子テーマ」のテーマのための関数（functions.php）に追記するか、③Code Snippets（プラグイン）等でコピペして使用します。①はテーマの更新で消失します。②③は更新の影響を受けません。
外観>カスタマイズ>トップバー>コンテンツに、以下を入力して使用します。
[current_date]現在公開中の総記事数は[total_posts]本です 
				
					// 記事の総数を取得するショートコード（固定ページはカウントしない）
function total_posts_shortcode() {
    $count_posts = wp_count_posts();
    $total_posts = $count_posts->publish;
    return '<span class="total-posts">' . $total_posts . '</span>';
}
add_shortcode('total_posts', 'total_posts_shortcode');

// 本日の日付を取得するショートコード
function current_date_shortcode() {
    $current_date = date_i18n( 'Y.n.j' );
    return $current_date;
}
add_shortcode( 'current_date', 'current_date_shortcode' );