How to add a chapter description to a Squarespace course
In this tutorial, I'll show you how to add custom excerpts to your chapter titles using a bit of CSS magic. All code snippets are in the description below. Be sure to update the text & style for your own unique website. Don't forget to like, subscribe, and share your results in the comments!
Resource Links:
📝 Original blog post → https://insidethesquare.co/squarespac...
🎓 Free Code Training → https://insidethesquare.co/learn
📚 Squarespace CSS Code Collection → https://insidethesquare.co/css
📄 How to add code to a single page → https://insidethesquare.co/squarespac...
🙋♀️ Have a question? Check out my code troubleshooting tips → https://insidethesquare.co/code-help
- -
Code from the tutorial - - be sure to change colors, font, size values, and text!
// Hide lesson timestamp
.course-list__grid-course-item-lesson-meta time, .course-list__chapter-duration, .course-list__grid-chapter-item-chapter-meta{
display:none
}
// Give the chapter section a background
.course-list__grid .course-list__grid-chapter-item{
background:#e5f5f6;
border-radius:10px;
padding:20px
}
// Style the excerpt & add the text for the first chapter
.course-list__grid .course-list__grid-chapter-item-header{
border-bottom:none
}
.course-list__grid-chapter-item
.course-list__grid-chapter-item-chapter-name:after{
content:"\A Describe the first chapter with a sentence or two";
white-space:pre;
font-size:1rem;
font-weight:300!important;
line-height:1rem;
text-wrap: wrap
}
// Change the text for the second chapter
.course-list__grid-chapter-item:nth-of-type(2) .course-list__grid-chapter-item-chapter-name:after{
content:"\A Describe the second chapter with a sentence or two"
}
// Change the text for the third chapter
.course-list__grid-chapter-item:nth-of-type(3) .course-list__grid-chapter-item-chapter-name:after{
content:"\A Describe the third chapter with a sentence or two"
}
- -
The term Squarespace is a trademark of Squarespace, Inc. This content is not affiliated with Squarespace Inc. The accuracy of this information is subject to change. #squarespacetips #squarespacetutorial #squarespace #learnsquarespace #learncoding #squarespacetricks #squarespacetraining #squarespacecode
Watch video How to add a chapter description to a Squarespace course online without registration, duration hours minute second in high quality. This video was added by user InsideTheSquare with Becca Harpain 03 September 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 176 once and liked it 12 people.