Theme Veggie by Anariel Design : Modifications of Header, blog,archive, single post, menus, contents and more using css.

theme Veggie by Anariel Design
If you are will to create a food or recipe related blog/site then Veggie theme by Anariel Design is for you. You can show your unique cooking techniques and recipe to the world using this Veggie theme.

Theme Veggie by Anariel Design comes free with wordpress.com premium or business plan.But if you are using wordpress.com free plan then you have to purchase it with $79.

Here I am sharing you some css styling using which you can give the veggie theme a new look as your own.

If you have any question or changes in mind feel free to ask me in comments section

or
can take my personal help.

**** Top Header Logo Section Modification ****

Question 1: To reduce white space just top and bottom of the header logo area in Theme Veggieby by Anariel Design

.site-logo {
margin-bottom: 0px !important;
}

#masthead {
padding-top: 0px !important;
margin-bottom: 0px !important;
}

Theme Veggieby Anariel Design top header logo section modifications

Question 2: To change the color of top social icons

.social-navigation a {
color: green !important;
}

Question 3: To change top social icons hover color
.social-navigation a:hover {
color: red !important;
}

**** Top Menu modifications ****

Question 4: To change top and bottom border color and thickness (width) in top menu section

.primarymenu {
border-color: red !important;
border-width: 1px !important;
}

Question 5: If you want to use background color in top menu

.primarymenu {
background-color: yellow !important;
}

Theme Veggieby Anariel Design top menu section modifications

Question 6: To change font size, color and font family of top menu font item

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

Question 7: To change sub menu background color

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

Question 8: To change submenu menu item font color
.main-navigation ul ul a {
color: white !important;
}

*** Blog / Archive (Category, Tag, Archive, Search) page modifications ***

Question 9 : To change Blog or Archive page titles font color, size and font family

.blog .entry-title, .blog .entry-title a, .archive .entry-title, .archive .entry-title a {
color: red !important;
font-size: 26px !important;
font-family: !cursive important;
}

Question 10 : To change Hover color of blog or Archive page titles

.blog .entry-title a:hover, .archive .entry-title a:hover {
color: green !important;
}
Question 11 : If you want to change Continue Reading font color, size and font family

.more-link {
font-size: 18px !important;
color: red !important;
font-family: cursive;
}

Question 12 : If you don’t want to show border below the Continue Reading

.more-link {
border: none !important;
}

Theme Veggieby Anariel Design blog category archive tag section modifications

Question 13 : If you want to make the continue reading to be a button shape

.more-link {
background: darkred;
padding: 12px;
color: white !important;
}

Question 14 : If you don’t want to show Post date, Author and Comments below the post content in Blog or Archive pages

.blog .entry-meta, .archive .entry-meta {
display: none;
}

Question 15 : If you want to reduce gap between two posts in archive and blog page

.archive article, .blog article {
margin-bottom: 12px !important;
}

Question 16 : If you want to use border as separator between two posts in blog or archive pages

.archive article, .blog article {
margin-bottom: 21px !important;
border-bottom: 2px solid darkred;
}

**** Single Post modifications ****

Question 17 : To change single post font size, color and font family in Theme Veggieby Anariel Design

.single .entry-title {
color: red !important;
font-size: 26px !important;
font-family: cursive !important;
}

Question 18 : If you want to reduce gap between post date, author etc and starting of post

.single .entry-meta {
margin-bottom: 12px !important;
}

Question 19 : If you don’t want to show post date and author name in single post page

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

Theme Veggieby Anariel Design single post content section modification

Question 20 : If you want to reduce gap between top menu and single post thumbnail image

.single .primarymenu {
margin-bottom: 12px !important;
}

Question 21 : If you want to make your single post to be full width

.single #secondary {

display: none;

}
.single .site-main {
margin: 0 0% 0 0;
}

.single .post-thumbnail img {
width: 100% !important;
}

Question 22: To change font size, color and font family of single post contents

.single .entry-content, .single .entry-content * {
font-size: 16px !important;
color: black !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 )

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 )

Connecting to %s

%d bloggers like this: