Wordpress博客-网格视图

Question

默认情况下，Wordpress会显示博客中的一篇文章，另一篇下面显示简短的文本，如果可用的话，还会显示一幅图像。问题是-这有可能改变吗？我希望有一个网格，包括3列和4行每页，和一个项目(博客帖子)在一个网格将是一个特色照片。在这件事上，有可能调整Wordpress博客吗？

Answer 1

我使用砖石方式在我的css结束；

/* Masonry Custom CSS for the Grid Style Blog */

/* Masonry container */
body.blog div#content, body.archive div#content {
-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
-moz-column-gap: 1em;
-webkit-column-gap: 1em;
column-gap: 1em;
max-width: 100%;
margin-left: 20px;
margin-right: 20px;
}

/* Masonry bricks or child elements */

body.blog article, body.archive article {
background-color: #eceff1;
max-width: 100%;
display: inline-block;
margin: 20px 0 1.5em;
padding: 1.5em;
width: 100%;
}

body.archive .archive-header, body.blog .paging-navigation, body.archive .paging-navigation {
background-color: #ffffff;
-webkit-column-span: all;
column-span: all;
}
/* Responsive-ness for mobile */
@media only screen and (max-width : 1024px) {

body.blog div#content, body.archive div#content { /* Masonry container */
-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
}
}

@media only screen and (max-device-width : 1024px) and (orientation : portrait) {

body.blog div#content, body.archive div#content { /* Masonry container */
-moz-column-count: 2;
-webkit-column-count: 2;
column-count: 2;
}
}

@media only screen and (max-width : 768px) {

body.blog div#content, body.archive div#content { /* Masonry container */
-moz-column-count: 2;
-webkit-column-count: 2;
column-count: 2;
}
}

@media only screen and (max-width : 480px) {

body.blog div#content, body.archive div#content { /* Masonry container */
-moz-column-count: 1;
-webkit-column-count: 1;
column-count: 1;
}
}

Answer 2

是的，这都是一个问题，选择正确的主题，并将您的文章每页12 (设置->阅读)。

只是这样做的一个主题的例子：https://wordpress.org/themes/tempera