Snap CSS Customization

magagirao · Member · Oct 24, 2013 at 6:35 pm
Copy link

Add topic to favorites
Hello.
I’ve some questions about SNAP theme:

+ Is there any way to delete the line in the footer? We want to try a hand drawn line image.

+ Font Family from Menu Navigation can be the same as the Headings, and not Body Text? How?

+ The line between the posts is solid, we would like to change to dotted.
How?

+ The Full Widht template page has a Title. How to cut it off?

+ I’m trying to change the H3 tag, and nothing happens:
“h3 {font-size:14px; font-size:1rem;}”

Many thanks for the help!
Margarida

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Oct 25, 2013 at 4:53 am
Copy link
Hi Margarida,

+ Is there any way to delete the line in the footer? We want to try a hand drawn line image.

Add the following to your custom CSS, upload your border image to your media library, get the URL of that image and replace URL_OF_IMAGE between the quote marks in the background declaration.
```
#footer {
background: url("URL_OF_IMAGE") no-repeat scroll center top / contain rgba(0, 0, 0, 0);
border-top: medium none;
}
```
+ Font Family from Menu Navigation can be the same as the Headings, and not Body Text? How?

Add this CSS.
```
#snap-nav a {
font-family: ff-dax-web-pro-1,ff-dax-web-pro-2,Merriweather,Georgia,Times,"Times New Roman",serif !important;
}
```
+ The line between the posts is solid, we would like to change to dotted.
How?

Add this CSS. I included a border-color declaration in the event you wish to make it a different color. You can also change the border style from dotted to dashed to see what you think.
```
.tile .post {
border-color: #FF0000 !important;
border-style: dotted !important;
}
```
+ The Full Widht template page has a Title. How to cut it off?

Snap’s page titles are done a little differently, so this will remove the titles above the content, but will also hid any other h1 text you happen to use in a page, so use h2 in pages if you need a larger heading in the content.
```
.page h1 {
display: none;
}
```
+ I’m trying to change the H3 tag, and nothing happens:
“h3 {font-size:14px; font-size:1rem;}”

Since you have used a custom font for headings, you have to use a slightly different selector. Add this to your CSS and adjust as you desire.
```
.wf-active h3 {
font-size: 20px;
}
```
magagirao · Member · Oct 29, 2013 at 3:21 pm
Copy link
Many thanks thesacredpath.
Very helpful!
magagirao · Member · Oct 29, 2013 at 4:51 pm
Copy link
Hello again.
How can I delete the header bottom line?
I’m trying with #header or #snap-header but notthing.
Thanks in advance.
thesacredpath · Member · Oct 29, 2013 at 7:39 pm
Copy link
Hi, if you are talking about the border line above the header image and below the nav and site title/description, add the following to your CSS.
```
#main-header {
    border: none;
}
```
magagirao · Member · Oct 30, 2013 at 9:19 am
Copy link
Yes. : )
Thanks again.
thesacredpath · Member · Oct 30, 2013 at 10:15 pm
Copy link
You are welcome.

No items found.