我一直试图通过移动背景并移动小部件来使最新的帖子特色图像成为标题的背景。问题是,当我尝试使用边距或填充移动窗口小部件时,它只显示白色而不是移动实际窗口小部件。
以下是呈现的HTML:imgur.com/a/5nLcE /
这是我的代码:
Functions.php(未完整)
//* Register featured post widget area
genesis_register_sidebar( array(
'id' => 'featured-post',
'name' => __( 'Featured Post', 'duniayudhis' ),
'description' => __( 'This is a widget area that can be placed after the navigation bar', 'duniayudhis' ),
) );
/*
remove_action( 'genesis_after_header', 'genesis_do_nav', 5 );
add_action( 'genesis_before_header', 'genesis_do_nav', 5 );
*/
remove_action( 'genesis_after_header', 'genesis_do_nav', 10 );
前page.php文件:
add_action( 'genesis_meta', 'duniayudhis_front_page' );
function duniayudhis_front_page() {
// Force full width content layout
add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_full_width_content' );
if( is_active_sidebar('featured-post') ) {
// Add the featured post widgets
add_action( 'genesis_header', 'duniayudhis_featured_post', 18);
}
// The function to register the Welcome Area Widget
function duniayudhis_featured_post() {
genesis_widget_area( 'featured-post', array(
'before' => '<div class="featured-post-widget">',
'after' => '</div>'
));
}
}
style.css(仅适用于侧边栏和标题):
/* # Site Header
---------------------------------------------------------------------------------------------------- */
.site-header {
background-color: #212121;
}
.site-header, .wrap {
max-width: 100%;
}
/* ## Title Area
--------------------------------------------- */
.title-area {
float: left;
width: 79px;
}
.header-full-width .title-area {
width: 100%;
}
.site-title {
font-size: 32px;
font-size: 3.2rem;
font-weight: 400;
line-height: 1.2;
}
.site-title a,
.site-title a:hover,
.site-title a:focus {
color: #333;
}
.header-image .site-title > a {
background: url(images/logo.png) no-repeat left;
float: left;
min-height: 79px;
width: 100%;
margin-left: 2rem;
}
.site-description {
font-size: 16px;
font-size: 1.6rem;
font-weight: 300;
line-height: 1.5;
}
.site-description,
.site-title {
margin-bottom: 0;
}
.header-image .site-description,
.header-image .site-title {
display: block;
text-indent: -9999px;
}
/* ## Widget Area
--------------------------------------------- */
.site-header .widget-area {
float: right;
text-align: right;
width: 100% - 79px;
}
/* # Site Navigation
---------------------------------------------------------------------------------------------------- */
.genesis-nav-menu {
clear: both;
font-size: 16px;
font-size: 1.6rem;
line-height: 1;
width: 100%;
}
.genesis-nav-menu .menu-item {
display: inline-block;
text-align: left;
}
.genesis-nav-menu a {
color: #333;
text-decoration: none;
display: block;
padding: 30px 24px;
}
.genesis-nav-menu a:hover,
.genesis-nav-menu a:focus,
.genesis-nav-menu .current-menu-item > a,
.genesis-nav-menu .sub-menu .current-menu-item > a:hover,
.genesis-nav-menu .sub-menu .current-menu-item > a:focus {
color: #c3251d;
text-decoration: none;
}
.genesis-nav-menu .sub-menu {
left: -9999px;
opacity: 0;
position: absolute;
-webkit-transition: opacity .4s ease-in-out;
-moz-transition: opacity .4s ease-in-out;
-ms-transition: opacity .4s ease-in-out;
-o-transition: opacity .4s ease-in-out;
transition: opacity .4s ease-in-out;
width: 200px;
z-index: 99;
}
.genesis-nav-menu .sub-menu a {
background-color: #fff;
border: 1px solid #eee;
border-top: 0;
font-size: 14px;
font-size: 1.4rem;
padding: 20px;
position: relative;
width: 20rem;
word-wrap: break-word;
}
.genesis-nav-menu .sub-menu .sub-menu {
margin: -55px 0 0 199px;
}
.genesis-nav-menu .menu-item:hover {
position: static;
}
.genesis-nav-menu .menu-item:hover > .sub-menu {
left: auto;
opacity: 1;
}
.genesis-nav-menu > .first > a {
padding-left: 0;
}
.genesis-nav-menu > .last > a {
padding-right: 0;
}
.genesis-nav-menu > .right {
color: #fff;
float: right;
list-style-type: none;
padding: 30px 0;
}
.genesis-nav-menu > .right > a {
display: inline;
padding: 0;
}
.genesis-nav-menu > .rss > a {
margin-left: 48px;
}
.genesis-nav-menu > .search {
padding: 10px 0 0;
}
.slicknav_menu {
display:none;
}
/* ## Site Header Navigation
--------------------------------------------- */
.site-header .sub-menu {
border-top: 1px solid #eee;
}
.site-header .sub-menu .sub-menu {
margin-top: -5.6rem;
}
.site-header .genesis-nav-menu li li {
margin-left: 0;
}
/* ## Primary Navigation
--------------------------------------------- */
.nav-primary {
position: relative;
z-index: 100;
}
.nav-primary .genesis-nav-menu a {
color: #ccc;
text-decoration: none;
}
.nav-primary .genesis-nav-menu li a:first-child {
margin-left: 10rem;
margin-right: -10rem;
}
.nav-primary .genesis-nav-menu a:hover,
.nav-primary .genesis-nav-menu a:focus,
.nav-primary .genesis-nav-menu .current-menu-item > a {
color: #fff;
text-decoration: none;
}
.nav-primary .genesis-nav-menu .sub-menu a {
color: #333;
}
.nav-primary .genesis-nav-menu .sub-menu a:hover,
.nav-primary .genesis-nav-menu .sub-menu a:focus,
.nav-primary .genesis-nav-menu .sub-menu .current-menu-item > a {
color: #c3251d;
text-decoration: none;
}
.widget-wrap #genesis-responsive-slider {
background-color: #fff;
border: 0px solid #eee;
margin: 0 auto;
padding: 0px;
width: 100%;
z-index: 1;
margin-top: -9.5rem;
}
li .slide-image a{
background: rgba(70, 72, 82, 0.3)
}