Rosalie By SiloCreativo : Modification of header, footer, borders, backgrounds, fonts,contents, colors and more

Rosalie is an elegant, minimalistic and responsive modern WordPress theme built specifically for bloggers who love craft, lifestyle, fashion and generally are cool people. Designed for WordPress.com. You can check Roaslie by Silo Creative theme demo.  Here I am sharing you some css customization which you can use to give your site a new look. The theme comes free with wordpress.com premium plan and business plan.  You can ask question regarding any issue you are facing.

wordpress theme rosalie modifications documentation support customization css help

Or can take my personal help.

Question 1 : How to change the Read More button background color, font color, font size and font family

.entry-summary a.more-link {
background: darkred !important;
color: white !important;
}

Read More button color modification

Question 2 : How to change the Read More button Mouse Over / Hover background color, font color

.entry-summary a.more-link:hover {
background-color: darkred !important;
color: white !important;
}

Question 3: To change the Read More button Arrow symbol color and to make the arrow bigger

.entry-summary a.more-link:after {
color: white !important;
font-size: 31px !important;
}

Question 4 : If you don’t want to show post date in Home page posts

.entry-meta.textcenter-xs .posted-on {
display: none;
}

*** If you want to change the font size, color and font family of the Post date/time

span.posted-on time {
color: black !important;
font-size: 17px !important;
font-family: cursive;
}

Question 5: If you don’t want to show the Reading time in homepage posts

span.reading-time{
display: none;
}

*** If you want to change the font size, color and font family of the Reading time in homepage

span.reading-time {
font-size: 18px !important;
color: darkred !important;
font-family: cursive;
}
post title date reading time modifications
Question 6: How to change home page post titles font color, font size and font family

h1.entry-title.textcenter-xs, h1.entry-title.textcenter-xs a {
color: darkred !important;
font-family: cursive;
font-size: 23px;
}

*** To change the hover color of the post titles

h1.entry-title.textcenter-xs a:hover {
color: blue !important;
}

Question 7 : How to change homepage slider title’s font color, font size and font family

.flexslider .slides > li .hentry.has-post-thumbnail h1 {
color: white !important;
font-size: 24px;
font-family: cursive !important;
}
Home page slider title post date reading time modification
Question 8 : How to change homepage slider Reading Time’s font color, font size and font family

.flexslider .slides .entry-meta span.reading-time {
color: white !important;
font-family: cursive !important;
font-size: 24px !important;
}

Questoin 9 : How to change homepage slider post date’s font color, font size and font family

.flexslider .slides .entry-meta span.posted-on time {
color: white !important;
font-family: cursive !important;
font-size: 24px !important;
}

Question 10 : If you don’t want to show the post date, post title, or post dates etc in homepage slider

.flexslider .slides > li .hentry.has-post-thumbnail {
visibility: hidden !important;
}

Question 11: How to change social icons color and hover color

#page .jetpack-social-navigation a:before {
color: red !important;
}

*** If you want to change social icons hover color

#page .jetpack-social-navigation a:hover {
color: blue !important;
}

Also, If you want to give the individual social icons color, feel free to do comments

Question 12 : How to change header title background color of widget section

.widget-title {
background-color: darkred !important;
}

.widget-title:after {
border: 8px solid darkred;
border-color: darkred transparent;
}

Question 13 : How to change widget title’s font color, font size and font family

.widget-title {
color: white !important;
font-size: 14px !important;
font-family: cursive !important;
}

widget title contents modifications

Question 14: How to change widget’s font size, font family and color

.widget p {
color: black !important;
font-family: cursive !important;
font-size: 14px !important;
}

widget links font color size and font family
Question 15 : How to change link color, link font size and family in widget section

.widget_recent_entries > ul > li a {
font-family: ‘Montserrat’, sans-serif !important;
font-size: 14px !important;
color: darkred !important;
}

Question 16: How to change lines and borders in the drop down of top navigation menu

.nav-menu .sub-menu, .nav-menu .children {
border: 1px solid darkred;
}

.nav-menu .sub-menu li:after, .nav-menu .children li:after {
background-color: darkred !important;
}

.nav-menu > li > .sub-menu:after, .nav-menu > ul > li > .children:after {

border: 1px solid darkred;

}

Question 17: How to change navigation menu bar background color

.site-header {
background-color: green !important;
}

Question 18: How to change selected menu item background color, font color, font weight

.nav-menu .current-menu-item > a, .nav-menu .current-menu-ancestor > a, .nav-menu .current_page_item > a, .nav-menu .current_page_ancestor > a {
color: white !important;
background: darkred;
font-weight:bold;
}

navigation menu font color font size font family and border modification
Question 19: How to change Navigation menu font color, font size and font family

.nav-menu li a {
color: blue;
font-size: 14px !important;
font-family: cursive !important;
}

**** to change navigation menu font hover color

.nav-menu li a:hover {
color: yellow;
}

*** to change navigation menu hover background color
.nav-menu li a:hover {
color: yellow;
background: darkred;
}

/****************** footer *********************/

Question 19: How to change footer black background color

footer#colophon {
background: darkred;
}
.site-info {
background-color: darkred;
}

footer site info social icons font color size and font family
Question 20: How to change footer social icons hover color

#page .social-footer .jetpack-social-navigation ul li a:hover {
color: yellow;
}
*** if you want to change individual social icons color change and hover color change ask me in the comments section.

Question 21: If you want to change footer site info or BLOG AT WORDPRESS.COM. font color, size and font family

.site-info p.info a {
color: white !important;
font-weight: bold !important;
font-family: cursive;
font-size: 16px !important;
}

/************* Top Site Title, Tagline section / Site Description section ***************/

site title and site description modification

Question 22 : How to change site title’s font color, font family and font size

.site-title a {
color: red !important;
border: none;
font-size: 23px !important;
font-family: cursive !important;
}

Question 23 : How to change site description or tagline’s font color, font family and font size

.site-description {
color: red !important;
border: none;
font-size: 23px !important;
font-family: cursive !important;
}

If you have any issue feel free to ask me question here in comments section

OR

Pay me some, I will help you for CSS Issue Personally CLICK HERE….

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

%d bloggers like this: