Pictorico By Automattic : Theme for travel site, photoblogging or artwork and modifications of header,footer, contents, sidebar,fonts using css

Pictorico by Automattic is a single-column, grid-based theme with large featured images and a post slider, perfect for a photoblogging or travel site.

pictorico by automattic grid-based theme with large featured images and a post slider

Here I am sharing css customization to give your Pictorico theme  a new look.
You can ask question regarding any issue you are facing.

Or can take my personal help.

Download Pictorico Parent Theme

Download Pictorico Child Theme

Question 1: If you want to change skyblue background color of Date showing in blog, archive or search grid contents

.blog .site-content .entry-meta, .archive .site-content .entry-meta, .search .site-content .entry-meta {
background: darkred !important;
}

Question 2: If you want to change blackish background of blog, archive or search grid post title

.blog .site-content .entry-title, .archive .site-content .entry-title, .search .site-content .entry-title {
background: darkgreen !important;
}

pictorico by automattic grid title time background and color modifications

Question 3:  If you want to change blog, archive or search page grid’s post title font size, color and font family

.blog .entry-title a, .search .entry-title a, .archive .entry-title a {
font-size: 24px;
color: yellow;
font-family: cursive !important;

}

Question 4: If you want to change blog, search or archive page grid time’s font size, color and font family

.blog .entry-date, .archive .entry-date, .search .entry-date {
font-size: 15px !important;
color: yellow;
font-family: cursive !important;

}

Question 5: If you want to change font size, color or font family of  site title

.site-title a {
color: darkred;
font-size: 44px;
font-family: cursive !important;
}

*** To change site title’s hove color

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

pictorico by automattic site title and menu modifications

Question 6: If you want to change font size, font weight ( to change menu from bold to normal), color and font family of menu

.main-navigation ul li a {
font-size: 20px !important;
font-weight: normal !important;
color: darkred !important;
font-family: cursive !important;
}

*** To change drop down menus font color

.main-navigation ul ul li a {
color: white !important;
}

*** To change drop down menu background color

.main-navigation ul ul {
background: darkred !important;
}

 

pictorico by automattic widget section modification

Question 7: If you want to change footer widget background color change

#secondary {
background: darkred !important;
}

*** To change footer widget title’s font size, color and font family

.widget-title {
font-size: 23px !important;
color: yellow;
font-family: cursive !important;

}

*** To change footer widget links color, font size and font family

.widget-area a {
color: white !important;
font-size: 13px !important;
font-family: cursive !important;
}

pictorico by automattic grid single post content section modifications

Question 8: If you want to change single post title background color, font size and font family

.has-thumbnail .entry-header .entry-title {
background: darkred;
font-size: 30px !important;
color: yellow;
font-family: cursive !important;
}

*** If you want to change font size, color, font family, line height  in post content section

.entry-content {
font-size: 17px;
line-height: 27px;
font-family: cursive !important;
color: black !important;
}

*** If you want to increase single post content section width

.single .entry-content {
max-width: 1200px !important;
width: 100% !important;
}

pictorico by automattic single post category links tag links and bookmark links to change

Question 9:  at the bottom of single post if you want to change category links (Posted in), tag links and bookmarks font color, size and font family

.entry-footer > span {
color: black !important;
font-family: cursive !important;
font-size: 18px;
}

*** Also, to change footer category links, tag links and bookmark links color to change

.entry-footer a {
color: blue;
}

Question 10: To change the word “Related Post” font color, size and font family

.jp-relatedposts-headline {
font-size: 26px !important;
color: darkred !important;
font-family: cursive !important;
}

share this and Related post title color font and font size change

Question 11: To change “Share This” font size, color  and font family

div.sharedaddy h3.sd-title {
font-size: 23px;
font-family: cursive !important;
color: darkred !important;
}

pictorico by automattic comments title author date and comments text modification

Question 12: If you want to change font size, color and font family of comments title

.comments-title, .comment-reply-title {
color: red !important;
font-size: 23px !important;
font-family: cursive !important;
}

Question 13: If you want to change font size, color and font family of comments author name

.comment-meta .fn a {
color: red !important;
font-size: 15px !important;
font-family: cursive !important;
}

Question 14: If you want to change font size color and font family of comments date

.comment-metadata time {
color: red !important;
font-size: 13px !important;
font-family: cursive !important;
}

*** If you don’t want to show comments date then try this code

.comment-metadata time {
display:none !important;
}

Question 15: To change comments (comments text) font color, font size and font family

.comment-content p {
font-size: 14px !important;
color: darkred !important;
font-family: cursive !important;
}

Question 16: How to change footer copyright info in pictorico theme

Go to your dashboard. Then Appearance > Editor > footer.php . Please check the screenshot for better understanding and use the code i shared below the screenshot to change copyright info

footer copyright information modification

				© Copyright 2018 or 2019
				<span class="sep"> | </span>
                Message about your company

 

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 )

Google+ photo

You are commenting using your Google+ 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 )

w

Connecting to %s

%d bloggers like this: