Photo Blog A single-column, multicolor, grid-based theme by Automattic: Header, Footer, sidebar, color changes and more

Blogging is a great way to share your story, and sometimes a great photo is all it takes. You know what they say: a picture is worth a thousand words. Photo Blog gives you all of the tools you need to tell a beautiful visual story, whether you’re a photography professional, hobbyist, or a mobile phone shutterbug. This single-column, grid-based theme with large featured images makes your pictures pop! You can check Photo Blog Demo Here. You can Get this theme for FREE with wordpress.com Premium or Business plan.

Photo Blog by Automattic tutorial and support

You can ask question regarding any issue you are facing.

Or can take my personal help.

Question 1: How to give space between the square grid in Photo blog theme
Answer : To do this, go to your dashboard and then
Appearance > Customize > Layout and select Grid Layout and the spacing will be done automatically

Question 2 : How to use hover background shadow like the image attached like the Photo Blog
hover background shadow

Answer :
At first Go to
Appearance > Customize > Layout and select Grid Layout and the spacing will be done automatically
then
Appearance > Customize > Style Packs and select Retro Photo and it will be done automatically

Question 3: How to change blue color of top menus and also font size and font family

.main-navigation a {
font-size: 13px !important;
color: red;
font-family: cursive !important;
}

menu color and background change in wordpress photo blog

*** To change hover color of menus
.main-navigation a:hover {
color: yellow !important;
}

*** To change hover background color of submenu items
.main-navigation ul ul a:hover {
background: green !important;
}

Question 4: How to change site title’s font color, font size and font family in Photo Blog theme by Automattic
Answer:
.site-title {
font-family: cursive !important;
color: #111 !important;
font-size: 23px !important;
}

*** If you want to show the site title in the middle ( by removing the site description)

.site-branding {
margin-left: auto !important;
margin-right: auto !important;
padding-right: 0px !important;
text-align: center;
}
.site-description {
display: none;
}

Question 5: To increase the width of single post and single page

div#entry-content, div#entry-content div {
max-width: 1200px;
margin-left: auto !important;
margin-right: auto !important;
}

increase width of single post and single pages

Question 6: To reduce featured image height in single post and single pages

.hero-area {
height: 200px !important;
}
featured image height reduce in single post and page

Question 7 : To change only top header background color

header#masthead {
background: darkred !important;
}
header background color change

Question 8 : If you want to change Hover background color ( hover over image in homepage)

.entry-link {
background: red;
}

Question 9: How to change homepage grid post title’s font color, font size and font family

.home h2.entry-title, .home h2.entry-title a {
font-size: 36px;
color: yellow;
font-family: cursive;
}
home page post title font color font size and font family change

Question 10: To reduce gap just above and below the page title

.page div#entry-content, .page header {
padding-top: 12px !important;
}
reduce gap above and below page title

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: