Wallpress - Modify blog page, width, link icon, number of posts

A Carrington
asked 8 years ago

Hello,

Is there a way to increase the width of the blog page so there is a double column, while keeping the right sidebar?
How can I remove the link image on the upper left corner of the blog post?
How can I increase the number of blog posts per page?

1 Answers

DominicStaff
answered 8 years ago

You can add the following code to the style.css file:

.page-template-layout-blog #content {
max-width: 880px;
}

To remove the link image on the upper left corner of the blog post, You can add the following code to the style.css file:
```
.page-template-layout-blog .post-main:before {
display: none;
}
```
To increase the number of blog posts per page, you log in to Dashboard > Settings > Reading, then change the number in the Blog pages show at most section.

acarri1
replied 8 years ago

Hi Dominic,

Thank you as always for the info. I may not have been clear on what I was asking.

For the page width, I want to know is there a way to have multiple columns just like the homepage. I don’t want to increase the width of the post.

Increasing the number of columns would increase the number of blog posts per page. If I increase the number of blog posts to 12 in the reading sections it still breaks the 12 posts into 4 posts per page and does not place the 12 on one page.

I was able to remove the link icon in the upper left corner; however, it left an empty blank space. How would I remove the white space so it looks like the posts on the homepage? I see the space is named ".item-inner" and that the dimensions need to be changed. What file do I look for to make a permanent change?

Thanks
My goal is to be able to put posts on pages other than the homepage and I thought using the blog page would be the easiest way to do it.

dominic Staff
replied 8 years ago

Please accept my apology for the delay in the getting back to you.
Issue 1+3: At the moment, our theme does not support to make a blog page look like the home page. However, I can help you custom some css code lines to display 3 column on the home page, you can try the following code into the style.css file:

.page-template-layout-blog .post-main {
   padding: 0;
}
.page-template-layout-blog .post-main:before {
   display: none;
}

.page-template-layout-blog #content .pagenav {
   clear: left;
}
.page-template-layout-blog-php .post {
    width: 30%;
    float: left;
}
.page-template-layout-blog-php .post.grid-double, .page-template-layout-blog-php .post.grid-triple {
    width: 30%;
}
.page-template-layout-blog #content {
max-width: 880px;
}
.page-template-layout-blog-php .post:nth-child(3n+1) {
    clear: left;
}
.page-template-layout-blog-php .format-quote blockquote {
    margin: -21px -21px 5px;
    padding: 20px;
    font-size: 110%;
    font-weight: bold;
    color: #fff;
    background: #222;
}

.page-template-layout-blog-php .format-quote blockquote:before {
    font-family: FontAwesome;
    content: "\f10e";
    font-size: 22px;
    text-align: center;
    line-height: 43px;
    color: #fff;
    position: absolute;
    right: 0;
    top: 0;
}
.page-template-layout-blog-php  .format-quote blockquote {
    position: relative;
}

Issue2: To increase the number of blog posts per page, you log in to Dashboard > Pages > Then edit blog page and change the number in the Posts per page: section in the right hand side.
See the screenshot: http://prntscr.com/a27p6n
Hope this helps!