如何在Squarespace Bedford模板中实现元数据项跳转后的高级格式化

数据老陈

2026-5-22

Hey there! Let's walk through how to add custom, page-specific formatting for author metadata (or other meta items) on your Squarespace Bedford template—so the styling only kicks in when someone clicks an author name to view their aggregated blog post page.

Custom Formatting for Author Metadata (Author Summary Page Only)

1. Find the unique body class for the author summary page

First, navigate to an author's post summary page (just click any author name from a blog post to get there). Right-click anywhere on the page and select "Inspect" to open your browser's developer tools. Look at the <body> tag at the top of the HTML structure—Bedford templates add a unique class here for author pages, usually something like collection-type-blog-author or page-author (yours might be slightly different, so use the exact class you see).

This class is your secret weapon: it lets us target styles only to this specific page, so your regular blog posts stay untouched.

2. Write targeted custom CSS

Head to your Squarespace dashboard, go to Settings > Advanced > Custom CSS, then paste in CSS code prefixed with that unique body class. Here are some common use cases to adapt for your needs:

Example 1: Spruce up the author's name at the top of the summary page

Want to make the author's header name bold, larger, and styled? Use this:

/* Only applies to the author summary page */
.page-author .author-profile-header .author-name {
  font-size: 2.5rem;
  font-weight: 700;
  color: #2c3e50;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 1rem;
}

Example 2: Style the author metadata in each blog post listing

If you want to turn the author tag in each post preview into a colored badge:

/* Author metadata styling on the summary page's post list */
.page-author .blog-item .blog-meta .author {
  background-color: #3498db;
  color: white;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 0.85rem;
  margin-right: 8px;
}

Example 3: Hide unwanted meta items on the summary page

Maybe you don't want to show the post date on the author's summary page—just add this:

/* Hide post dates only on the author summary page */
.page-author .blog-item .blog-meta .date {
  display: none;
}

3. Test and tweak

Save your CSS changes, then refresh both the author summary page and a regular blog post to confirm: your custom styling should only appear on the author's aggregated post page. If something isn't working, double-check that you used the correct body class and CSS selectors (use the developer tools to right-click the element you want to style and copy its selector if needed).

A quick note: Bedford is a Squarespace 7.0 template, so make sure you're using the 7.0 custom CSS entry point (don't confuse it with 7.1's site styles setup).

内容的提问来源于stack exchange，提问作者Picasso