Jump to content

Blog Category Page Category Attribute Add

Recommended Posts

  • 3 months later...
2 hours ago, FrankSy said:

I'm trying to change the background color of blog posts with a certain category. How would I go about that?

Please post the URL for a page on your site where we can see your issue.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site. Please read the documentation at the link provided to understand how it works.

Please read the documentation at the link provided on how to share a link to your site to understand how it works. A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

We can then take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment
43 minutes ago, FrankSy said:

I was testing the other code, but not the priority for now. 

Hello Frank,

Got it.

Quote

So Blog Category Page Category Attribute Add code should now be installed.

It is installed!

I noticed a problem which is totally my bad. There was an issue with the character encoding for the twcsl code and so the code you downloaded is slightly corrupted causing code not to work as expected. We need to get you a good copy. I have corrected the issue for the encoding but the file is on a CDN ( content delivery network ) so it may take awhile before the CDN refreshes the file.

In the meantime I'd like to direct message you a good version of the code that you can reinstall. It that OK with you?

Once we get this sorted then I can move onto getting you some CSS to control the background colors of categories.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment

@FrankSy

Here is the basic effect.

Add the following to Blog Settings > Advanced > Page Header Code Injection for the blog page. Please see per-page code injection.

<style>

  body[data-blog-category="Books"] #page .page-section {
  
    background-color : red;
    
    }
    
  body[data-blog-category="Books"] #page .page-section .section-background {
  
    background-color : transparent;
    
    }
    
  </style>

This is for v7.1 and specific to the poster's need.

I think this will almost certainly need some adjustment depending on what other effects you apply to the blog page.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment

hi creedon,

I've added the CSS to the blog pages. Not much change for now and I don't think I'm applying any effects to the page. I experimented adding the css in the custom css or the overall blog header. Still no luck 

I think we're nearly there, than you for your help

Frank

Link to comment
  • 1 month later...

@creedon

Hello Tom,

I hope that you’re well.

I was wondering if you could help me.
I’m trying to use your work.
I’m also trying to customise blog post having certain tags.

I’ve installed twcsl and the Blog Tag Page Tag Attribute:
https://github.com/tomsWebConsulting/twcsl/tree/main/Blog Tag Page Tag Attribute Add

I’ve tried to target posts that have “Fair” as a tag with the following code (among other attempts).

body[data-blog-tag="Fair"] #page .page-section {
  background-color: red !important;
}
body[data-blog-tag="Fair"]  #page .page-section .section-background {
  background-color: red !important;
}

I can’t make it work.

This is an exemple of a blog post on the website:
https://sebastienbertrand.com/all-exhibitions/artmonte-carlo-2017
Password: NeverModern 

Could you please have a look at it?

Edited by jonas.nicollin
Link to comment
6 hours ago, jonas.nicollin said:

I’m also trying to customise blog post having certain tags.

My code is designed to work on Blog tag pages. Those pages that list posts for a particular tag. Like the following.

Screen Shot 2022-05-19 at 11.26.54 AM.png

It appears you want to color a blog post page that has a particular tag. Is that correct?

Edited by creedon

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment

Oh, then it makes sense.

I thought it was intended for both: blog page as well as blog posts (sub-pages).

12 hours ago, creedon said:

It appears you want to color a blog post page that has a particular tag. Is that correct?

Yes, that is correct.
I would like to customise all blog posts tagged as “Fair”.
Actually, both on blog page and blog posts.

I would like to change blog post title font’s styles and to hide blog post categories on these specific pages.
(Not especially background colour… it was just a test.)
I’ve inspected the code to find something high in the body (like json data).
In vain.

Would you have something to do this?

Thank you @creedon

Link to comment
10 hours ago, jonas.nicollin said:

Would you have something to do this?

Not at present but here are my thoughts. I think it would be possible to create code that would gather up the tags and categories. Process them into classes like SS does add in some locations, and add them higher up the chain so effects like you want can be done.

I'm willing to give it a go but it may take several days. Bump this thread after awhile if I don't post back.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

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...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.