WordPress.com Theme Sight by WpShower Modification: Modify Header,footer, Slider, Menus, links, sidebar,Titles using CSS

Theme Sight by WPShower modifications

Here I have shared some more css modifications which you can enjoy if you are using theme Sight by WPshower, it is a free theme which u can use under wordpress.com and wordpress.org and the following css you can use in your custom css if you want to give it your choiceable look .

Here is the download link of the theme : Theme Sight by WPShower Download

1. If You want to change font color,font size, font weight and font family of Theme Sight of wordpress.com

.site-title a {
color: darkred !important;
}

.site-title {
font-family: times new roman !important;
font-size: 4.5rem !important;
font-weight: bold !important;
text-transform: none !important;
}

**** If you use “text-transform:lowercase“ then your site title will be lowercased letters

2. If you want to change Site Description’s font color, font family, font weight

.site-description {
color: darkred;
font-family: times new roman;
font-size: 2.1rem;
font-weight: bold;
padding: 2em 0 0;
}

3. If you want to remove the Search Box from the top right of the header section in theme Sight

.header-nav-search-container {
display: none;
}

4. If you want to remove the “Site Description” from the header

.site-description {
display: none !important;
}

5. If you want to show Site Title to cover the whole space of the header without Search and Site Description in theme Sight use the codes below

.site-header hgroup {
width: auto;
}

.site-title {
width: auto;
padding: 12px 0 0;
}
.header-nav-search-container {
display: none;
}
.site-description {
display: none !important;
}

6. If you want to change Navigation Menu’s (parents) hover background color of theme Sight

.main-navigation ul li:hover {
background: red !important;
padding-bottom: 12px;
margin-bottom: 0px !important;
text-decoration: none;
}


7. If you want to remove the Underline which is showing in Menu while hover


.main-navigation a {
text-decoration: none !important;

}

8. If you want to change the Sub Menu’s background color of theme Sight


.main-navigation ul ul {
background: none repeat scroll 0 0 darkred;
}

9. Show posts in Home page Slider of Theme Sight WordPress


*** just select your posts as sticky and it will be visible in the slider… and try to use featured image.


10. If you want to change the Featured Slider yellowish background color of theme Sight


.featured-post {
background: none repeat scroll 0 0 lime !important;

}


11. If you want to remove the Categories showing above the Featured slider of Home page in theme sight

#featured-content .entry-categories {
display: none;
}


12. If you want to change the Featured Slider’s Post Title’s font color, font family and font size of theme Sight


.featured-post-content .entry-title a {
color: darkred !important;
font-family: times new roman;
font-size: 21px;
}


13. If you want to change the background color or image of theme Sight of wordpress use the following code

body {
background: none repeat scroll 0 0 orange !important;
}

14. If you don’t want to show the Post date showing in the Featured Post Slider in Theme sight


#featured-content .entry-meta {
display: none;
}


14. If you want to change the Right Sidebar’s widget title’s font color, font family and font size of theme Sight


.widget-title {
color: darkred;
font-weight: bold;
font-family: times new roman;
font-size: 1.8em;
}


15. If you want to change Right Sidebar’s link color,font family,font size, font weight


#secondary li a {
color: darkred;
font-size: 13px;
font-family: times new roman;
font-weight: bold;
}


16. If you want to put background color beside the Widget title,and make the Widget Title Centered in Theme Sight

.widget-title {
background: none repeat scroll 0 0 green !important;
color: darkred;
font-family: times new roman;
font-size: 1.8em;
font-weight: bold;
text-align: center;
}


17. If you want to give your widget block some background color use this code


.widget {
background: none repeat scroll 0 0 orange !important;
padding: 12px !important;
}


18. If you want to put border around the Featured Thumnbnail images showing in the homepage in theme Sight


.entry-thumbnail img {
border: 7px solid orange;
max-width: 100%;
}


19. If you want to remove the footer Theme Info “Blog At WordPress.com “ from theme Sight use this code


.site-info {
display: none !important;
}


20. From Individual Post, If you want to remove the Top Category Name from theme Sight


.entry-categories {
display: none !important;
}


21. From Individual Post page if you want to remove the “Posted On” metas


.entry-header .entry-meta {
display: none !important;
}

If this CSS Modification seems helpful to you? You can donate $1 to support my site :)

Please make some donations


Want me to help you personally for CSS Issue? You can purchase gig from me in fiverr ..


Click the Image below

About these ads

16 Responses to WordPress.com Theme Sight by WpShower Modification: Modify Header,footer, Slider, Menus, links, sidebar,Titles using CSS

  1. Stephanie says:

    Do you have to purchase the CSS upgrade to use these codes or is there something I’m missing? Thank you!

  2. Hi – how can I add border around the slider or around the main blog area (that includs the slider)?
    Is there a way to do it?
    Thanks!

    • hi Blondynka
      sorry for the late response…can u share me ur site url pls?

      Om

      • Hi – the url is:

        http://wkrainieteczy.wordpress.com/

        I think I figured it out, but have further question:
        How can I align the sub menu and widget text and titles?
        Currently they are slightly missaligned (widget more indented than sub-menu text)

      • Hi Blondynka
        would u mind to share here what code u used for the border around slider?

        also
        can u share me screenshot image about the alignment issue pls? sorry didnt understand

        Om

      • Hi – the code I used for the changes that are now active:

        1) for the margin around slider which uses the background of the slider (currently active)

        .featured-thumbnail {
        margin: 0 1em;
        }

        .featured-content .featured-post-content {
        margin: 1.7em 1em;
        }

        2) for the padding around slider (which is not active currently), it creates white padding on each side, but also some padding on the bottom which is same colour as slider background

        .featured-wrapper {
        padding-left: 1 em;
        }
        .featured-wrapper {
        padding-right: 1em;
        }

        3) other changes:

        .site-header {
        margin: 1em;
        }

        .latest-posts-header {
        display: none;
        }

        .home .hentry:first-of-type {
        padding-top: 0;
        }

        I don’t seem to be able to add screen print or any files, but I basically need all text on the right side (widget’s, sub-menu and slider text) to be align with each other.
        I know how to manipulate slider text, but not the sub-menu and widgets.

        Thanks!

      • HI Blondynka
        thanks…actually i didnt understand that align issue properly :(
        Om

      • Hi – I managed to sort out the alignment issue with the text on the right side by adjusting the margin of the header, this poshed the text of the second menu toward the right side by few pixels, which seemes to work (at least on screens of my computers).

  3. ithinkink says:

    Hi,

    I’m trying to change the white color on the sight theme to this: #fccb32 and keep the black background.

    How do I do that?

    Thanks,
    T

  4. barracov says:

    You’re a life saver thanks for this? How do I change the font colour of main menu? How do I change background colour of main menu? If I add a period or another word to my title, how do I change the colour and/or font of the period or second word? Thanks!

    http://18thcenturyconductlit.wordpress.com

    • Barracov
      pls try this

      .main-navigation li:hover > a, .main-navigation ul ul :hover > a, .main-navigation ul ul a:hover {
      color: red !important;
      text-decoration: underline;
      }

      Om

  5. barracov says:

    Also, how do I change the menu background colour once someone has clicked and is viewing the current page? Also, how do i change the font colour when I hover the menu?

    • Hi
      Menu background for selected ite
      #page > nav > div.menu > ul > li.current_page_item {
      background: grey;
      }

      and

      Menu background for all
      .main-navigation li {
      background: red;
      }

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 305 other followers

%d bloggers like this: