Theme Vigilance by The Theme Foundry CSS Upgrade||Style Sheet Edit || Hide,Remove or Modify your Blog’s Site Title,Navigation Menus,Post Title,Site Description,Footer Comments,Tags,Author Information, Sidebar,Post Contents Width font color, size or Text alignment,

Theme Vigilance by The Theme Foundry


If you are using Theme: Vigilance by The Theme Foundry and if you want to Edit your blog or site’s style using CSS then this section is specially for you. Here I have shared some important aspect which you may face while editing Vigilance theme’s CSS style sheet. Here I have shared about how to resize and change color of Header Title font and Blog post title font. Also, you will be able to widen your blog content area by removing the sidebar. You can also vanish or disappear the Tag portion which is just under the Blog Post Title if you don’t want to show it. Again If you want to interchange the position of Navigation bar and Blog Description you can easily do it by the procedure I have shared below. Just Read them below and give your blog or page a stylish look by changing and modifying the CSS. If you have any question regarding CSS post your question in the comment box.

1. If you don’t want to show Header Title of Vigilance theme just add the following property in #title

#title {
display: none;
font-size: 4.6em;
font-weight: bold;
height: 165px;
line-height: 1.3em;
margin: 0;
overflow: hidden;
text-align: center;
vertical-align: middle;
width: 920px;
}

2.If you want to change header Title font color,font size and font type of Theme Vigilance by The Theme Foundry

#title span {
color: red;
font-family: cursive;
font-size: 1em;
position: relative;
top: 25%;
}

3. If you want to change Header or Site Title’s Background Color of Theme Vigilance.

#title {
background-color: green;
font-size: 4.6em;
font-weight: bold;
height: 165px;
line-height: 1.3em;
margin: 0;
overflow: hidden;
text-align: center;
vertical-align: middle;
width: 920px;
}

4. If you want to remove the white / Blank space just above the Header Title or Site Title.

#header {
border-bottom: 5px solid #333333;
padding: 0 0 0;
position: relative;
}
#title span {
color: red;
font-family: cursive;
font-size: 1em;
position: relative;
top: 5%;
}
#title {
font-size: 4.6em;
font-weight: bold;
height: 131px;
line-height: 1.3em;
margin: 0;
overflow: hidden;
text-align: center;
vertical-align: middle;
width: 920px;
}

5. If you don’t want to show Site Description in Vigilance theme

#description {
display: none;
float: left;
margin-top: 15px;
}

6. If you want to change Site Description’s Font color,font type and font size

#description h2 {
color: black;
font-family: cursive;
font-size: 1.2em;
font-weight: normal;
}

7.If you want to remove “Home”, “About Me” Navigation (Nav) bar of Theme Vigilance

#nav {

display: none;

}

8. If you want to remove the gray Line just under or beneath the Header Title of Theme Vigilance

#header {

border-bottom: none;
padding: 20px 0 0;
position: relative;

}

9. If you want to remove sidebar from the right hand side of your blog

#sidebar {
display: none;
float: right;
padding-bottom: 20px;
width: 300px;
}

10. if you want to make your Theme Vigilance content area wider after Hiding SideBar

#content {
float: left;
padding: 20px 20px 20px 0;
width: 930px;
}

11. if you want to Hide Tags from Theme Vigilance

.tags {
display: none;
float: right;
font-style: italic;
text-align: right;
width: 400px;
}

12. if you want change Font Type, font size and also make the blog post font justified or aligned of Theme Vigilance

.entry {
font-family: cursive;
font-size: 1.3em;
text-align: justify;
}

13. If you want to change Blog Post Date Color, font size,font type

.post .date {
color: #757575;

font-family: “Trebuchet MS”,”Lucida Grande”,”Lucida Sans”,Verdana,Arial,sans-serif;
font-size: 1.6em;
font-weight: normal;
padding-top: 10px;
text-transform: uppercase;
}

14. If you want to Hide Blog Post Date

.post .date {
color: #757575;
display: none;
font-family: “Trebuchet MS”,”Lucida Grande”,”Lucida Sans”,Verdana,Arial,sans-serif;
font-size: 1.6em;
font-weight: normal;
padding-top: 10px;
text-transform: uppercase;
}

15.If you want to change Blog post header Background Color

.post-header {
background-color: red;
border-bottom: 4px double #EEEEEE;
padding-bottom: 7px;
}

16. If you want to change Blog Post Header Font color,font type and Font size
.post-header {
border-bottom: 4px double #EEEEEE;
font-family: cursive;
font-size: 1em;
padding-bottom: 7px;
}

17. If you want to change “Author Information” or “Meta”‘s font color,size and font type

.meta {
color: red;
font-family: times New Roman;
font-size: 1.2em;
}

18. If you don’t want to show or hide “Author Information” or “Meta”‘s

.meta {
color: red;
font-family: times New Roman;
font-size: 1.2em;
}

19. If you want to change Navigation menus (“Home” “About Me”)font type and font size

#nav ul li a:hover, #nav ul li:hover > a, #nav ul li.current_page_item > a, #nav ul li.current_page_parent > a, #nav ul li.current_page_ancestor > a, #nav ul li.current-cat > a, #nav ul li.current-menu-ancestor > a, #nav ul li.current-menu-item > a, #nav ul li.current-menu-parent a {
border-top: 4px solid #772124;
color: blue;
font-family: times New Roman;
font-size: 23px;
text-decoration: none;
}

#nav li a {
color: blue;
font-family: times New Roman;
font-size: 23px;
padding-top: 0.1em;
text-decoration: none;
}

20. If you want to move the “HOME”, “About Me” Nav bar to the Left hand side just change in the #nav and #description as below.

#nav {
float: left;
font-family: “Trebuchet MS”,”Lucida Grande”,”Lucida Sans”,Verdana,Arial,sans-serif;
font-size: 1.5em;
margin: 15px 0 10px;
}

#description {
float: right; //( or display: none);
margin-top: 15px;

}

21. If you want to move description at the right hand side just change in #description

#description {
float: right;
margin-top: 15px;
}

22.If you don’t want to show or hide comments in Theme: Vigilance by The Theme Foundry

#comments
{
display:none;
}

23.If you don’t want to show leave a reply in Theme: Vigilance by The Theme Foundry

#respond {
display: none;
font-size: 1.5em;
}

24. If you want to change “Comments” Header font type,font size

div.c-head {
color: black;
font-family: times New Roman;
font-size: 20px;
font-weight: bold;
}

25. If you want to change “Comments” Header font color

a:link, a:visited {
color: blue;
}

26. If you want to change “Comments” Body font-color,font size and font type

div.c-body p {
color: red;
font-family: cursive;
font-size: 15px;
margin: 10px 0 0;
}

Need Help for CSS?? Submit your problem in the comment box below.

About these ads

48 Responses to Theme Vigilance by The Theme Foundry CSS Upgrade||Style Sheet Edit || Hide,Remove or Modify your Blog’s Site Title,Navigation Menus,Post Title,Site Description,Footer Comments,Tags,Author Information, Sidebar,Post Contents Width font color, size or Text alignment,

  1. Richard says:

    This is very helpful. I have not purchased the CSS upgrade yet, but when I do, this info. will come in handy.
    Right now, I’m just trying to change the post title font with TypeKit. I tried html tags: .post-header, .post-header h1, .post-header h2 and no changes. :-( Any ideas? Is there a .post-title tag? Why do different themes seem to use different tags for the same thing? I don’t know much, but I’m glad I found this link. Thank you!

  2. Richard,

    Thanks for your comments,

    Would you mind to give me your blog or website name?

    Thanks

  3. Litman says:

    hi, I like your website. its a cool site and I wanted to post a bit note 2 tell you, nice job regarding Theme: Vigilance by The Theme Foundry CSS Upgrade and Style Edit

  4. Hello,

    I need your help with something. I’d like to create a static front page for my Vigilance theme, sort of a “welcome page” with just one picture in the middle and a link to the “blog” itself somewhere underneath that picture. I have found this link (http://codex.wordpress.org/Creating_a_Static_Front_Page) that does what it says it does, but I want to know if I can remove everything on that static page, everything BUT the picture and the link towards the posts page. I’m asking because I’m contemplating purchasing the CSS plugin and I want to know if this can be done first.

    Take a look at my blog if you want, let me know what you think and if I can be helped.

    Thanks a lot!

    • HI,
      Sorry for the late in reply as i was not available in the last 2 days. would you mind to clear me the problem again…. I didnt understand what u say..

      Regards
      Om

      • Hi, sorry for not being too clear, I’ve had a long week lol

        So, I have the Vigilance theme, and I’d like to create a static front page for my blog. I followed the tutorial of the link I previously gave you and it worked but it didn’t look the way I wanted. So I wanted to try the CSS plugin. They have that “preview” option. I wanted to hide the top bar, so that the pages I created didn’t show up on it. And it worked. So now I was wondering if with CSS I could basically take out everything only from my static page

        I’d like to have a static front page with only the picture and a link to the blog, nothing else on it, no header, no columns, nothing. Maybe the sharing buttons. Pretty much like this one: http://www.justintshockley.com/

        I haven’t purchased the plugin yet because I wanted to know if my idea was at all doable.

        What do you think?

        Best,
        Filip

      • Hi Filip,

        If you are using wordpress.com self hosted free blog then it is not possible what you are trying to do as it may need php files modification or creating a page template to give it a look which you want.

        WordPress.com is free and you don’t have options to modify the php files or creating template (as i know)

        REgards
        Om

  5. Blanca says:

    Is there anyway to move the location of the tags back to the bottom of the blog instead of just hiding them?

    Some blogs have more tags than others and we don’t want that to distract, confuse or deter the readers.

    Any help with this matter would be greatly appreciated!

    Thank you

  6. Theresa says:

    Hi there,

    Thanks so much for your informative help on the Vigilance wordpress theme – it’s greatly appreciated. I was wondering if you could assist me. I want to remove the grey lines in the sidebar area on my blog – I utilize the wide and left sidebar widgets. I was also wondering if you happened to know how to remove the indentation of the items in the sidebar. I want everything to be in-line without those arrow things. All your tips have been so awesome and would be stoked if you could assist on this.

    Thanks in advance!
    T

    • Hi Theresa,
      Sorry for the late..
      pls try the following code to remove the grey line from the sidebar

      ul li.widget ul li {
      border-bottom-color: white;
      }

      ALso.
      Would u mind to clarify me the indentation problem u mentioned?

      Om

      • Theresa says:

        Thank you so much for your quick reply – means alot! So in regards to the indentation issue, for my sidebar, the categories below the main topic are indented in with an arrow ” > “. I was wondering if there was a way to remove the arrow and align the categories with the main topic. For instance, for my “RECENT POSTS”, I want all the elements under it to be shifted left w/o the arrow so everything is lined up vertically. Sorry for the confusion!!

        I will try your tip this evening. Thank you thank you!!!

        Thanks again,
        Theresa

      • Hi Theresa,
        Good morning

        Would u mind to try the following code…

        ul li.widget ul li a {
        background: none repeat scroll 0 0 transparent;
        display: block;
        padding: 0 0 0 0;
        }

        I think u r searching for this…

        this code will go in the following style sheet (at the bottom)

        http://www.the-habit.com/wp-content/themes/vigilance/stylesheets/master.css

        Pls let me know the result

        Om

      • Theresa says:

        Om, you are absolutely awesome!!! Your code worked! You have no idea how long I’ve been trying to figure that out. Thank you sooooo much! I just have one last quick question. For my sidebar, there are still some grey lines below the categories such as “RECENT POSTS”. Your previous code worked well to get rid of most of the lines, but would you happen to know how to get rid of these as well? I tried to insert “border-top-color: white;” into the code you initially gave me – but it didn’t work.

        Thanks for all your help! I really appreciate it!!

      • Hi Theresa,
        Nice to know my codes helped you..
        i think u r searching for the code…

        h2.widgettitle {
        border-bottom: medium none;
        }

        Pls let me know the result..

        Om

      • Theresa says:

        Hi Om,

        I will try that and let you know if it works.

        Thanks so much for everything!!

      • Theresa says:

        Hi Om,

        I just wanted to let you know that I tried out the last code you sent me, and it worked!! Thanks so very much! I’m so glad that I ran into your site – it’s the most helpful one I’ve seen for wordpress themes!!

        Thanks so much again for everything!!
        Theresa

      • Hi Theresa, :)
        Nice to know my code helps u..
        IF u have any problem share me… i will check it..

        Om

      • Theresa says:

        Thank you Om!!!! :D

  7. Camilla P says:

    Thanks for you great page. I was wondering how to change the background color on all pages. I can change the color on the first page by writing: .home { background-color: #fff; }. But all other pages keep the old background color.

  8. Theresa says:

    Hi Om,

    Hope all is well. I have a question for you regarding custom header/banner images. Do you know how to add one? I’d like to include one on my blog. In particular, I’d like the image to be ‘clickable’ meaning that I want to be able to click on it so it brings users back to the home page.

    Thanks so much in advance Om! You’d helped me out so much, and I’m greatly appreciative!

    Regards,
    Theresa

    The Habit

    • Hi Theresa,
      yes you can do it easily,
      first
      pls check ur theme supports to upload header image or not..
      otherwise
      you may need to modify ur header.php to implement this ..

      Om

  9. Theresa says:

    Hi Om,

    I’d like to move the ‘tags’ to the lower left corner above the ‘comments’. Do you know how to do this? Currently, you just show how to remove them but not relocate them. An option to relocate them would be awesome! :)

    Thanks in advance!
    Theresa

  10. Munrowe says:

    Hi Om -

    I’m a blogger (www.munrowe.com) using the Vigilance Theme, which I’ve played around with quite a bit. The only thing that I’d love to do is widen my main content area WITHOUT reducing the 300px width of my sidebar area. Essentially, I would just like to see LESS of the beige-y background and more of my mainbar area. Is this possible?

    Any help would be greatly appreciated!

    Thx,
    JUSTIN

  11. Victoria says:

    Hi Om!

    I’m trying to get the nav bar on the Vigilance theme to be centered. Can you help with this? Thanks so much!

    • Hi Victoria…
      would u mind to share me your site URL pls to check it

      Om

      • Victoria says:

        I’m helping someone get her site set up — everything else I was able to do and this is the only thing I couldn’t figure out. Her blog is caviardreamsblog dot wordpress dot com

      • HI Victoria..
        ok..try this code at to make theme Vigilance navigation (nav) menu centered

        #nav {
        display: block;
        float: none !important;
        font-family: “raleway-1″,”raleway-2″,sans-serif;
        font-size: 1.5em;
        margin-bottom: 3px;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-top: 10px;
        position: relative;
        width: 678px !important;
        }

        Pls let me know it works or not

        Om

  12. oh my gosh, i love you. THANK YOU THANK YOU THANK YOU!

  13. Okay Question, On the sidebar the text is so small but I can only adjust it with the body text and I like how the body text size is right now and I wish the sidebar text was a little bigger.. Does anyone know how to change the sidebar text to make it bigger?

  14. Om,

    You are the BEST! Thank you so much!

    Okay, one more thing.. The color of text on the sidebar where it says HELLO & WELCOME, CONNECT, & LOVELY SPONSORS I wanted all those the color f8a5b9 but keeping the rest of the text black.. Hopefully that makes sense..?

    • Hi Kristin
      nice to know it helps

      here is the css code to change your widget title’s color of Vigilance theme Sidebar

      #sidebar .widgettitle {
      color: #f8a5b9 !important;
      }

      Regards
      Om

  15. Theresa says:

    Hi Om,

    I was wondering if you could tell me how to add an image within my footer. It’s basically like a clickable link. Any help would be beyond appreciated. :)

    Best,
    Theresa

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 322 other followers

%d bloggers like this: