To add a custom message when there are no blog posts in the Blog Page. Like this
You can use this code to Custom CSS
If code doesn’t work, you can comment below, message or send me an email.
div.collection-content-wrapper:not(:has(article)) {
position: relative;
}
div.collection-content-wrapper:not(:has(article)):before {
content: "Coming Soon";
font-size: 30px;
display: block;
text-align: center;
color: #000;
}
Change text, text style here.
If you want to apply it on a specific blog page only. First find Blog Page ID.
In my example, it is: #collection-67b563a7177c6159740eab24
Next, use this new CSS code.
#collection-67b563a7177c6159740eab24 {
div.collection-content-wrapper:not(:has(article)) {
position: relative;
}
div.collection-content-wrapper:not(:has(article)):before {
content: "Coming Soon";
font-size: 30px;
display: block;
text-align: center;
color: #000;
}}
