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

  • 2 months later...
  • 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 comment

@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 comment

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 comment
  • 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 comment
  • 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 comment
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?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

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

×
×
  • Create New...