How do I design how blog posts appear on the page?

We have a very similar issue with blog posts.

This looks acceptable on a large screen, but not on a phone sized device.

There is an option in the Blog Posts editor to not display the header. This works in preview, but we cannot make it work outside the editor. We would in any case prefer to have headers, but get text normally wrapped and centered.

How can we change this header format?

Thanks for sharing the best posts they very nice and very help us. You made a good site its very interesting one. I am very impressed with your job about this category that you did well.

Hi Emily-

I checked out your blog page, but it doesn’t look like any posts are published so I wasn’t able to see exactly what you mean by “hanging above,” but in the Florentine Theme, you’ll need to use Custom CSS to modify the blog page.

Since the last time this thread was updated, we have released a new Theme called Crio that gives you a lot more control over the appearance of your Blog page without using code.

That being said, we’re happy to help you create some Custom CSS for your theme if you can describe what you’re going for with the background and provide a link so we can take a look for you.

Hi Emily-

Awesome, thanks for the detailed idea of what you’re looking for! I’ll try to answer each one in turn. A lot of these are going to be handled with Custom CSS. Navigate to Customize > Advanced > Custom JS & CSS to add any of the custom rules I’m about to list.

i’d like that green transparent background to be the grey colour in my theme’s colour palette (i think it’s number 4), including the widget area. (but i still want the flower to be the background image showing just at the top of the page)

Try this CSS Rule:

.blog.palette-primary .site-content, .single-post.palette-primary .site-content 
   { background-color: #2f383d; }

i’d like to be able to display the posts in a list with excerpts rather than an endless scrolling through every post.

Two things are required to show excerpts rather than the full post.

First, you’ll need to change a setting in Settings > Blog (or Settings > Reading if you don’t have BoldGrid Inspirations active) and make sure that the option for For each post in a feed, include Summary instead of Full Text.

Then, in your actual post, make sure to include a Read More tag after your first paragraph to show WordPress where the summary should stop. It looks like this:

– feature image or thumbnail on the left
– title, author, date, and short description on the right
– categories displayed somewhere (i like the prominent way creative market does it – is something like that at all possible?)
– possibly with a light border around each post
– choosing between list and grid is definitely a cool feature, but not really sure what is possible here

A lot of the things you’re trying to do can be done more easily by using the Post List component in a separate page. Check out this short video I made for another user that has a quick overview of how to use it:

I also helped another user using a Post List block component move their featured images to the left-hand side like you described here, check out those instructions here.

Switching between the list and grid view would take a pretty significant amount of customizations, probably requiring some work in PHP and JavaScript. That might be more trouble than it’s worth.

i’d like visitors to be able to choose a category at the top and have just the posts filed in that category shuffle around on this same page rather than have a whole new category page load – that or have the ability to edit how the category pages look too, but the load time is definitely a turn off if people want to check out what there is in the different categories at a glance

I can see what you mean about the loading time. You might want to consider a caching plugin to help speed that up. Another good option is the Search and Filter Plugin, which adds a new widget to accomplish that in your sidebar.

Yet another possibility using the Post List block would be to add “sections” for different categories to your page, since those Post Lists will let you sort by category.

on the actual post pages:
– grey background
– remove date from above picture
– add a more prominently styled author, date, and categories below the title (more like an article i guess) again, similar to creative market
– remove the HTML options from the commenting area (I don’t think it’s relevant to my audience at all, and kinda clogs things up)

Gray background: the code I provided in the first question will do this for you.
Remove the HTML options: Use the custom CSS found in this article.

Your two questions about the Post Metadata are a little tougher. It’s easy enough to hide the date:

span.posted-on { display: none; }
span.byline { text-transform: capitalize !important;
/* Also add custom styling here */}

But adding the categories to this section isn’t quite so straightforward. I’ll do a little more research to see if I can find a plugin that will meet this need for you.

If moving to crio is the best bet, can i do so without losing all that i’ve made so far or would it mean abandoning the florentine theme and starting over?

You’d keep all of your content, but some customizations would be lost, so this might not be the ideal solution for you at this stage. Feel free to try out Crio in Cloud WordPress to see if you like it without affecting your site.

Hi Emily-

You’re not obligated to keep the default blog page in your menu. You can remove it by navigating to Customize > Menus, expanding the existing Blog menu item, and click the Remove button:

Then, you’re free to add another page with the posts list widget or another post displaying plugin to the menu, so you don’t have any duplicates.

Glad to hear it Emily! Let us know if you have any more questions, we’re happy to help.