WordPress のフォーラムに、「Twenty Seventeen テーマのメニュー (ナビゲーション) をページトップに固定するには?」というような内容のトピックが上がっていたので、その方法を紹介したいと思います。
方法は、簡単でスタイルを追加するだけです。
スタイルシート
スタイルシート (style.css) に以下のスタイル (CSS) を追加します。
@media screen and (min-width: 768px) {
.navigation-top {
top: 0;
bottom: auto;
position: fixed;
}
.site-branding {
margin-bottom: 0 !important;
}
.twentyseventeen-front-page.has-header-image .custom-header,
.twentyseventeen-front-page.has-header-video .custom-header,
.home.blog.has-header-image .custom-header,
.home.blog.has-header-video .custom-header {
height: 100vh !important;
}
.custom-header {
margin-bottom: 0 !important;
padding-top: 77px;
}
.admin-bar .navigation-top {
top: 32px;
}
.admin-bar.twentyseventeen-front-page.has-header-image .custom-header,
.admin-bar.twentyseventeen-front-page.has-header-video .custom-header,
.admin-bar.home.blog.has-header-image .custom-header,
.admin-bar.home.blog.has-header-video .custom-header {
margin-top: -32px;
}
}
あとがき
実際に、ナビゲーションをページトップに固定すると案外良かったです。ぜひ、お試しください。