Help Changing CSS in Vigilance

whitreed · Member · Jan 22, 2011 at 10:46 pm
Copy link

Add topic to favorites
I am working with the Vigilance theme on my blog (www.us2photo.com). There are a few small changes that I need to make, but I don’t know the CSS language to make these changes.

1. I want to remove the title for my static home page (so that it doesn’t say “home” at the top).

2. I want to remove the sidebar completely.

3. I want the content of the pages to be wider.

4. I want the navigation menu to be right-aligned.

5. There are two grey lines at the top of each page (beneath the title). I want to get rid of these lines.

Thank you for any advice!

The blog I need help with is: (visible only to logged in users)
timethief · Member · Jan 22, 2011 at 11:27 pm
Copy link
Just mentioning that when 1 of the 2 volunteers who help with CSS arive here they will find your username linked to a blog wearing the Freshy theme. May I suggest you post the URL for the blog wearing the Vigilance theme that you are editing the CSS on?
thesacredpath · Member · Jan 23, 2011 at 12:47 am
Copy link
This should do it. It looks as if you’ve already fixed #4.
```
.home .pagetitle, #sidebar {
display: none;
}

#content {
width: 900px;
}
```
whitreed · Member · Jan 23, 2011 at 7:43 pm
Copy link
Thank you so much. These worked beautifully. I still have one more question though :)

On the homepage, we need to get rid of the navigation menu so that it looks more like a website. How do I get rid of the menu on JUST the homepage?

(here is the link to the blog, @timethief: http://www.us2photo.com)
timethief · Member · Jan 23, 2011 at 7:46 pm
Copy link
@whitreed
I cannot help you with this. We have only 2 Volunteers who help with CSS editing. They are halluke and thesacredpath. Please be patient while waiting for them to locate this thread and help you.

P.S. I am currently waiting for thesacredpath to check his email and contact me on a similar issue.
thesacredpath · Member · Jan 23, 2011 at 7:48 pm
Copy link
This should do it.
```
.home #nav {
display: none;
}
```
whitreed · Member · Jan 23, 2011 at 7:53 pm
Copy link
@thesacredpath, Thank you so much! Your responses have been so fast and helpful! Wish I had your know-how!
thesacredpath · Member · Jan 23, 2011 at 8:14 pm
Copy link
You are welcome and you will get there. Mine has been a path of first understanding the relationship between the markup (XHTML) and the CSS and then just plundering. One tool that makes me look much better than I am is the Firebug Add-on for Firefox which allows me to quickly identify what CSS is controlling an element and it allows me to try changes real-time. You should check it out.
memeticstudios · Member · Feb 7, 2011 at 10:56 pm
Copy link
My blog layout is similar. But I cant get rid of the big grey line on the home page. How do I do this?
memeticstudios · Member · Feb 7, 2011 at 11:00 pm
Copy link
the url is http://memeticstudios.com/
thesacredpath · Member · Feb 7, 2011 at 11:04 pm
Copy link
In #header, set the bottom border to “none.”
thesacredpath · Member · Feb 7, 2011 at 11:07 pm
Copy link
And actually it looks really funny with the line gone since then the speech-bubble type graphics you have for the header and the navigation just float aimlessly on the page. There needs to be something in between them for them to point at and to provide a separation. That of course is just my opinion.
memeticstudios · Member · Feb 8, 2011 at 12:29 am
Copy link
hmm.. yeah now that I see it I agree. Any suggestions on what to fill that space with? Perhaps make the line shorter to be the same length as the header?
thesacredpath · Member · Feb 8, 2011 at 12:47 am
Copy link
The problem is that the header image itself has white space on each side of the dark area, so the white on the left and right is part of the header width. If you redid the header image so that the black area was 920px wide (with no white on either side) then the dark bottom border would be the same width as the image.
memeticstudios · Member · Feb 8, 2011 at 1:25 am
Copy link
Thanks so much. I think I found something that I like. One more question.
How do I make it so that when you are on the “Projects” and “Contacts” pages it doesn’t say the name on the left hand side? Somehow I already did this on my blog page.
thesacredpath · Member · Feb 8, 2011 at 5:04 am
Copy link
You need to hide the page titles in the CSS.

h1.pagetitle, h2.pagetitle {display:none; }
memeticstudios · Member · Feb 13, 2011 at 10:26 pm
Copy link
Now I’m trying to make it so my home page shows a summary (with picture) of my 5 most recent blog posts. Any ideas?
thesacredpath · Member · Feb 13, 2011 at 10:46 pm
Copy link
To summarize posts, use the “read more” tag in the post:

http://en.support.wordpress.com/splitting-content/more-tag/

To set the number of posts to show per page, go to settings > reading.
memeticstudios · Member · Feb 13, 2011 at 10:59 pm
Copy link
I would like to have smaller links with pictures on my front page (no Summary). Like on this blog: http://philipbloom.net/.
thesacredpath · Member · Feb 13, 2011 at 11:23 pm
Copy link
Put in the image with an alignment of “none” (which will left-align with no text wrap) and then put the read more tag right after the image and before any text.

As far as the size of the post title, change it to whatever size you want.
```
.post-header h1, .post-header h2 {
font-size: 2.6em;
}
```

No items found.