Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
Sign in to follow this  
emfaw

Five: targeting the banner image text overlay style in css

Question

Hi thereI've loaded in some custom fonts to my site via css. The style I wish to use this font in is the text that overlays on the banner images at the top of each page in the template called Five.I understand that the other styles have names such as h1, h2 etc etc.

What is the style name for the text overlay on banners called in the css?

Thank you

Edited by emfawcett

Share this post


Link to post

8 answers to this question

Recommended Posts

  • 0

I use rules like the following for that purpose:


#page-title {width: 290px; background-color: #d92414;
     padding-left: 10px; padding-right: 10px; margin-right: 0 !important;}

#page-description p {background-color: #025928; padding-left: 5px; padding-right: 5px;}

In my case I'm just after some background to make the text more readable.

Share this post


Link to post
  • 0

For people who don't use your template to help, you need to give the url to your site.


I'm a retired attorney who was asked by a friend to build a website. In a prior lifetime, in a galaxy far, far away and long, long ago, I was a computer systems analyst / programmer. I'm a novice autodidact in CSS, JavaScript and HTML learning in part by example.. I've asked questions on this forum and been lucky enough to have others help me, so I'm inclined to answer any question I can. Pay it forward.

Share this post


Link to post
  • 0

This is what I have used to try to get the Notera font to be the font used for the banner headers that overlay on the banner images. It's all in Design > Custom CSS. It's not working so far but hopefully just needs a small tweak to get it to work...

@font-face {font-family: 'Notera'; src: url('//static1.squarespace.com/static/55b4a361e4b085d388b66c34/t/56565d14e4b022a250f38f73/1448500500816/Notera.otf'), url('//static1.squarespace.com/static/55b4a361e4b085d388b66c34/t/56565d44e4b022a250f390a8/1448500548748/Notera.ttf'), url('//static1.squarespace.com/static/55b4a361e4b085d388b66c34/t/565b94cee4b0c6e18e4cca94/1448842446649/Notera.woff'); font-weight: 400;}

h1.page-title{ font-family: 'Notera'; font-weight: 400; }

Share this post


Link to post
  • 0

Copy and paste into Design > Custom CSS:


#page-title {  font-family: "My Custom Font";}

Substitute the name of your custom font for the text My Custom Font. Font names with spaces in them must be enclosed in quotes; names that are a single word need not be. I believe font names are case sensitive.

I'm a retired attorney who was asked by a friend to build a website. In a prior lifetime, in a galaxy far, far away and long, long ago, I was a computer systems analyst / programmer. I'm a novice autodidact in CSS, JavaScript and HTML learning in part by example.. I've asked questions on this forum and been lucky enough to have others help me, so I'm inclined to answer any question I can. Pay it forward.

Share this post


Link to post
Guest
This topic is now closed to further replies.
Sign in to follow this  

×
×
  • Create New...