Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Styling Blog Post Page in 7.1


Recommended Posts

I'm trying to figure out how to apply style edits to a blog post in SS 7.1. I can style the Blog Page itself, but the header and page styles do not carry over to the individual blog post page. Any help would be appreciated!

Link to post
  • 2 months later...
  • Replies 10
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Popular Posts

I'm struggling with blog customization and things like backdating in 7.1, too.

  • 2 weeks later...

Hi @tuanphan! I'm trying to get this sorted as well. Would you share an example of how to do this? I'm building a site on Basil template (brine) and it's got all kinds of wonky styles. I can adjust sizing and stuff, but I'm not sure how to target all the blog post pages.

 

(for reference, the site is ourresolutehope.squarespace.com, and the pass to view is ORH123go!.

Link to post

@barrysutton Ok I figured out how to do what I needed in CSS, if this is helpful for you.

The styles within the blog post itself inherit the styles from the rest of the site (h1, h2, etc) but these were the ones that were doing their own thing on my site. Hope it helps!

/*blog post page styles*/
.BlogItem-title {
    font-family: Lora;
    font-weight: 400;
    font-style: normal;
    font-size: 60px;
    letter-spacing: .015em;
    line-height: 1em;
    text-transform: none;
    color: #1f183f;
}
.BlogItem-meta {
  line-height: 1em;
}
h3.comment-count {
  font-size: 36px;
}

 

Link to post

I'm having trouble applying styles for the elements of a blog post too. The main body text is inheriting the font-family I applied in the CSS for the rest of my site, but I can't, for example, style the title of the post. Here's a snippet from the source of my post.

<div class="blog-item-title">
  <h1 class="entry-title entry-title--large p-name" itemprop="headline" data-content-field="title"> Creating Communication That Resonates</h1>
</div>

I've been completely unable to target the blog title with any CSS I've tried.

If anyone has a suggestion, I'll give it a go and report back.

Link to post
  • 5 months later...

After having the same problem for days, I inspected my blog summary page and was able to apply CSS. 

I reckon it will depend on the blog layout you have chosen. I am using Masonry Blog layout.

Hope this helps! 

//Blog Read More//
.tweak-blog-masonry-text-alignment-left .blog-masonry .blog-more-link {
  font-family: 'Im Fell French' !important;
  text-transform: uppercase;
  font-size: 13px !important;
  align-self: center;
}
//Blog Title//
.blog-masonry .blog-title {
  font-family: 'Creamcandy'!important;
  font-size: 40px !important;
  line-height: 1em
}

//Blog text alignment//
.tweak-blog-masonry-text-alignment-left .blog-masonry {
    text-align: center;
}

// blog meta data//
.light .blog-masonry .blog-categories-list a, .light .blog-masonry .blog-author, .light .blog-masonry .blog-date, .light .blog-masonry {
  font-family: 'Im Fell French' !important;
   text-transform: uppercase;
   font-size: 10px !important;
}

 

Link to post
  • 2 months later...

Hello,

I've tried all the suggestions on here, but still unable to style my Blog headlines. Arrgh!

And my Podcast titles.

Soooo frustrating…

If there's anyone with any more tips it would be greatly appreciated.

It's the Native template.

 

many thanks

 

www.doingdeath.com

Edited by ianHands
Link to post
20 hours ago, ianHands said:

Hello,

I've tried all the suggestions on here, but still unable to style my Blog headlines. Arrgh!

And my Podcast titles.

Soooo frustrating…

If there's anyone with any more tips it would be greatly appreciated.

It's the Native template.

 

many thanks

 

www.doingdeath.com

Can you describe in more detail your problem?

You can send your question to my email to get detail answer. / How to Setup Password & Share URL 

-- I came back. Will answer soon.

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...