Jump to content

Line blocks not showing up

Go to solution Solved by melody495,

Recommended Posts

I had put in some custom css to make line blocks disappear so I could have certain text background filled and other not on a blog post. Now, I am trying to redesign the blog posts to just have a line separating content but when I put the line in, nothing shows up. When I put a line on a page that doesn't have a white background, then it shows up. I don't know how to change the color. Is there custom css to change line color? TIA!

Link to comment
  • Replies 7
  • Views 1.4k
  • Created
  • Last Reply

Top Posters In This Topic

Can you share your website URL and an example page where the line is added but not visible? What do you currently have in Custom CSS? Have you tried temporarily removing it?

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment
29 minutes ago, SarahPiano said:

I don't remember what CSS I added that removed line blocks, so I'm not sure how to remove it. 

If you go in the dashboard under design and Custom CSS you should be able to find the code that's added to your website. If you can copy that all in this chat we can try and find the problem and help you remove it.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

I can't find any line blocks on the page or blog, I also can't see any reference to line blocks in the Custom CSS. Can you share a screen recording of this not working or something else that might help me understand what's happening?

Edited by Ziggy

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

Sorry, wrong website css. Here is the correct one:

 

#myBtn {
   width: 50px;
   height: 50px;
   display: none;
   position: fixed;
   bottom: 20px;
   right: 30px;
   z-index: 99;
   border: none;
   outline: none;
   font-size: 25px !important;
   color: white;
   cursor: pointer;
   padding: 10px 10px 10px 11px;
   border-radius: 50%;
   box-shadow: 1px 1px 5px #000;
   /* Change the hex code in the next line to change background color */
   background-color: #a4a4a4;
}

#myBtn:hover {
   background-color: #aeaeae;
}
@font-face {
font-family: Gab-Orch;
src: url(https://static1.squarespace.com/static/61788ddb0d3251797e374eb9/t/62c642796f3f6f125eff3b78/1657160313792/Gabriel+Orchestra+Cond+Medium.otf);
}
@font-face {
font-family: Gab-Orch-N;
src: url(https://static1.squarespace.com/static/61788ddb0d3251797e374eb9/t/62c6428b3aa09d13dd0cbf61/1657160331579/Gabriel+Orchestra+Cond+Normal.otf);
}
h1 {font-family: 'Gab-Orch';}
h2 {font-family: 'Gab-Orch';}
h3 {font-family: 'Gab-Orch';}
h4 {font-family: 'Gab-Orch';}
// Site Navigation //
.header-nav-item a {font-family: 'Gab-Orch-N' !important;}

// Button //
.header-actions-action .btn {font-family: 'Gab-Orch-N' !important;}
// Small or Tertiary Button //
.sqs-block-button-element--small,  .sqs-button-element--tertiary {
  font-family: 'Gab-Orch-N' !important;}

// Medium or Primary Button //
.sqs-block-button-element--medium, .sqs-button-element--primary {
  font-family: 'Gab-Orch-N' !important;}

// Large or Secondary Button //
.sqs-block-button-element--large, .sqs-button-element--secondary {
  font-family: 'Gab-Orch-N' !important;}
// Newsletter Form Title //
.newsletter-form-header-title {  font-family: 'Gab-Orch' !important;}
// Blog Page Post Title //
.blog-title {  font-family: 'Gab-Orch' !important;}
// Blog Post Entry Titles //
 .blog-item-title h1.entry-title {  font-family: 'Gab-Orch' !important;}
.user-items-list-item-container .list-item-content__title {font-family: 'Gab-Orch-N' ;}
.list-section-title {  font-family: 'Gab-Orch' !important; }
.header-nav-item a[href="/about"], .header-menu-nav-item a[href="/about"]
 {
    color: #2071A8 !important; 
}
// Mobile Menu Text //

.burger-box:after {
content: "Menu =";
text-align: right;
font-size: 16px;
color: #000;
display: block !important;
}

.burger-box {
  width: 60px !important;
  height: 45px !important;
}
.burger-box div {
display: none;
}
// Slashy Navigation //
.header-nav-item a:after {
  content: " |";
  margin-left: 10px;
  color: #6B6C67;
}
// Remove Slash From Folder Nav //

.header-nav .header-nav-item--folder .header-nav-folder-content .header-nav-folder-item a:after {
  content: "" !important;
}

// Remove Active Nav Line //

.header-nav-item--active a {
    background-image: none !important;
}
// Active Nav Color //

.header-nav-item--active a {
  color: #2071A8 !important;
  background-image: none !important; data-position: top-right
}
#wm-subnav{
   background:#ECECE2 !important;
}
#wm-subnav a.wm-subnav-item{
  color:#6B6C67 !important;
}
#wm-subnav .secondary-nav-dropdown-icon path{
  stroke: white !important;
}
 .arrow{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.arrow{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.arrow span{
    display: block;
    width: 30px;
    height: 30px;
    border-bottom: 4px solid #fff;
    border-right: 4px solid #fff;
    transform: rotate(45deg);
    margin: -10px;
    animation: animate 1.8s ease infinite;
}
@keyframes animate {
    0%{
        opacity: 0;
        transform: rotate(45deg) translate(-20px,-20px);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        transform: rotate(45deg) translate(20px,20px);
    }
}
@media(max-width:799px){
  .cloned-subnav.mobile-subnav{
    display:none !important;
  }
  #wm-subnav{
    display:block !important;
  }
  .header-announcement-bar-wrapper{
    padding-top:0px !important;
  }
}
@media(max-width:767px){
  .header-nav-wrapper{
    justify-content: flex-end !important;
  }
  .header-nav-item, .user-accounts-text-link {
  text-transform: uppercase !important; font-size: .9rem;
}
}
/* Line block spacing */
.horizontalrule-block {
    padding-top: 5px;
    padding-bottom: 5px;
}
.blog-item-title {
    margin-bottom: 0;
}
.collection-type-blog.view-item .image-block {
    padding-bottom: 0;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
    padding-top: 0;
}
/* Mobile image crop */
@media screen and (max-width:767px) {
img.ProductItem-gallery-slides-item-image {
    object-fit: contain !important;
}
}
section[data-section-id="624c87ea3dd1ab05f5786ef6"]
ul {
  line-height: 1;
}
/* Google form mobile */
@media screen and (max-width:767px) {
iframe[src*="google.com/forms"] {
    width: 500px !important;
    height: 3000px;
}
}
/* event details page */
.eventitem {
    flex-direction: column;
    justify-content: center !important;
    align-items: center !important;
}
.eventitem>div {
    flex: 1 0 100% !important;
    width: 75% !important;
    padding-left: 0;
    box-sizing: unset !important;
    text-align: left;
}
.header .header-announcement-bar-wrapper {
    position: relative;
    z-index: 2;
    width: 100%;
    box-sizing: border-box;
    padding-top: 10vw;
    padding-bottom: 0vw;
    padding-left: 1vw;
    padding-right: 1vw;
    pointer-events: auto;
}
@media(max-width:767px){
  .header-nav-wrapper{
    justify-content: flex-end !important;
  }
}
#collection-61788e4077ff9c2de60b6ba2 {
  padding-top: 0vw !important;
  padding-bottom: 0vw !important;
  margin-top: 0vw;
  margin-bottom: 0vw;
}

Link to comment

I can't see any CSS there that would remove the line block.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment
  • Solution
On 10/30/2023 at 7:47 PM, SarahPiano said:

 When I put a line on a page that doesn't have a white background, then it shows up. I don't know how to change the color. 

Hi, have you tried going to Site Styles (the brush at to right corner) -> Colors, find line block and change the colour?

On the page you are having issues, click on Site Styles -> Colors. Hovering on your page will tell you the theme that page is using. Locate the theme and click edit (the pencil icon), and change the line block colour for that theme.

Let me know how it goes.

-------- > 👆 <---------- Please quote or @ me when replying, or I won't get a notification 

Melody | Squarespace Website Developer
e: melody@melodylee.tech


💻 💁‍♀️ 1-2-1 Squarespace Training session <- feeling stuck and want to learn?
👩‍💻 💁‍♀️ Customisation help <- send me your design
 Did I help? I like coffee (Thank you)
🧰 See the tools I use (may contain affiliate links)


 

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.