Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
webinaide

Font Face: Change the font type of the image blocks

Question

Anyone have luck changing the image block title & body text and the button text to a custom font via Font Face? I've tried a few options (see below) and nothing is changing. Thank you!

a.sqs-block-button-element { font-family: "Gotham-Book2" !important; }.sqs-block-image .design-layout-overlap .image-title p { font-family: "Gotham-Book2" !important; }

Edited by webinaide
Initial Revision

Share this post


Link to post

16 answers to this question

Recommended Posts

  • 0

@webinaide


/* Image blocks and button in image blocks */
.sqs-block-image * {
   font-family: "Gotham-Book2" !important;
}
/* Newsletter form button */
.newsletter-form-button {
   font-family: "Gotham-Book2" !important;
}


Share this post


Link to post
  • 0

Is there a way to change just the header font on the image block -- the code you provided works for changing all of the text in the image block...

I don't want the button font to change or the body text in the image block. I'm using the "Ready" template. The code you provided in the previous post works but changes all of the font.

Thanks!

Share this post


Link to post
  • 0
8 minutes ago, jenplusplus said:

Is there a way to change just the header font on the image block -- the code you provided works for changing all of the text in the image block...

I don't want the button font to change or the body text in the image block. I'm using the "Ready" template. The code you provided in the previous post works but changes all of the font.

Thanks!

Can you share link to your site and take screenshot of "header"?

Share this post


Link to post
  • 0

This is the code I've written for the H1 & H2. I'd like it to be the header font on the collage image block.

 

//START GOLDEN TRAIL


@font-face {   
font-family: 'Golden Trail';   
src:
  url(https://static1.squarespace.com/static/5dc1032774027b0583e895e0/t/5dc8a8c2492ddd0f8b9f3257/1573431490912/GoldenTrail-KC.ttf),
  
  url(https://static1.squarespace.com/static/5dc1032774027b0583e895e0/t/5dc84cbc09cdf43d6dc464b4/1573407932368/GoldenTrail-KC.otf),
  
  url(https://static1.squarespace.com/static/5dc1032774027b0583e895e0/t/5dc8a729b9580a736408900d/1573431081886/GoldenTrail-KC.woff),
  
  url(https://static1.squarespace.com/static/5dc1032774027b0583e895e0/t/5dc8a734af9d520b7a6a7e82/1573431092599/GoldenTrail-KC.woff2); 
}

h1 {
 font-family: 'Golden Trail';
}
h2 {
 font-family: 'Golden Trail';
}

Share this post


Link to post
  • 0
10 minutes ago, jenplusplus said:

This is the code I've written for the H1 & H2. I'd like it to be the header font on the collage image block.

.image-title.sqs-dynamic-text p {
    font-family: 'Golden Trail' !important;
}

 

Share this post


Link to post
  • 0
4 hours ago, Onepaa said:

I am also facing the same issue when i implementing on my webiste https://triviaquestions4u.com/

Can you take screenshot?

Share this post


Link to post
  • 0

@Tuanphan

Thanks for that code to change the image block font. One more question-- how do I change the navigation font that shows up on the footer?

I've successfully used this code for the hamburger menu/top-of-site navigation:

//NAVIGATION BAR//
.nav-blocks-wrapper div a span {
   font-family: 'Golden Trail' !important;

 

But what do I need to write the code to make the very bottom of the site navigation change to this font as well?

image.thumb.png.d280f67bf9f3a6e9762fcf9fa06441a0.png

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...