[lorencowka]

This is my problem, I do not remember where I took it from and where I inserted it. I think I took, from WordPress forum. I actually want “search” to be there but at the same time I want the menu bar be much smaller – it is too high. If you have a solution to fix it with search remaining it would be ultimate.
I do not believe search alone is causing the problem. Bar was too high even before I inserted it. (I am 57 years old, it is all new to me but I am going somewhere. This is my last major problem.)
Thanks!

[Sakin]

@lorencowka: So what you want to do it? Can you explain it so that I can send you css for that. Maybe you can show me screenshot of what you want.

[lorencowka]

This is about my main menu bar, which does not look good with “Search” being in a separate row and and adding the height to the bar. I want everything what is there to stay there: Home, about me, travel blog, how to travel for free, privacy disclaimer, contact and search. I just want the main menu bar to be adjusted accordingly – all items in one row and reduced height of the bar to be the same size as secondary menu bar: Western USA, Easter USA, Central USA, Canada.
Thank you!

[Sakin]

@lorencowka: Do you mean that when you click on search, it expands and make your menu height more. Then you can add the following css:

.header-sidebar #s { color: #ccc; }
.header-sidebar #s:focus { width: 120px; color: #eee; }

[lorencowka]

I changed from capital letters to lower case letters and that took care of the height of the bar and put search in the same row as other items of primary menu. So this almost what I wanted, but now I want it to be centered on the page or going across the page just like secondary menu.
Thanks you again!

[Sakin]

@lorencowka: You cannot make it full width just by the css as it’s wrap together with header code. So, you can make it center only. For that you can add the following css in “Appearance => Theme Options => Custom CSS” box

#header-right {
    clear: both;
    text-align: center;
    width: 100%;
}
#header-right .widget {
    float: none;
}
#header-menu ul.menu {
    display: inline-block;
    float: none;
}

[lorencowka]

yvonnestravel.com

It worked-perfect! Thanks a lot!

I have two more questions.

1. Is there a way to visually separate posts? I think there is a tiny horizontal line in between but I am not sure. If there is, can it be stronger? Any other ways? When people are scrolling down I would like them to see which picture and which title go together.

2. Secondary menu. For example: The West. I created subcategories: Colorado, Utah, Arizona. When someone clicks on The West, I would like to have a drop down menu which would show: Colorado, Utah, Arizona. Only after clicking on state, person would be redirected to a post from that state.

Thank you in advance!

[Sakin]

@lorencowka:
1. How about changing it to 4 px double line. You can try adding in the following css:
.site-content article { border-bottom: 4px double #ddd; }
2. That’s not a problem. You can drag and drop the subcategories below your parent category in your custom menu. Read this http://catchthemes.com/blog/custom-menus-wordpress-themes/

[lorencowka]

Thanks a lot!
1. It looks like it worked but it is still hard to see. Is there a way to change the color?

[lorencowka]

2. That was easy! Video instruction helped a lot! I can’t believe it. Other than #1 I think I have no more want questions. You have been extremely helpful!

[lorencowka]

# 2 solved. I found solution on forum! No more question… for now! I am happy how my site looks like> THANK YOU!!!

[Sakin]

@lorencowka: That’s nice. Thanks 🙂

[lorencowka]

Hello, after some feedback from my viewers I would like to ask you for help again.

1. The slide show should be more visible. There is a lot of wasted space above the heather picture. I would the picture to be on the very top of the screen with a minimal border or even none.

2. When people click on any menu items it looks like nothing happens and they need to scroll down to see what they were looking for. I would like the home page items not to show on any other pages. Only two menu bars should stay on the top of the page. Remove heater picture, title of the blog, and “once you travel..”

3. When I click on Travel Blog, the first thing I see on the top of the page is Travel Blog. I want to remove it and show just the posts.

4. When linking from anywhere in a blog to a post, what I see is for example “Category Archives, New Jersey” on the top of the page. I would like to remove it and show posts only.

5. Is there a way to go back from publish to draft?

Thanks!

[Sakin]

@lorencowka:
1. Ok then add the following css in “Appearance => Theme Options => Custom CSS” box:

#site-logo { padding-top: 0; }
#hgroup-wrap { padding-left: 0; padding-right: 0; }
#hgroup.logo-enable.logo-left { padding: 0 20px; text-align: center; }

2. (Edited) Ok then add the following css in “Appearance => Theme Options => Custom CSS” box:

#header-left { display: none; }
.home #header-left { display: block; }

3 and 4. Ok then add the following css in “Appearance => Theme Options => Custom CSS” box
.page-header { display: none; }

5. Yes, you can change that anytime, edit that post/post and then set is as Draft from “Published”. Read this http://en.support.wordpress.com/pages/new-page-screen/#publish

[lorencowka]

wwww.yvonnestravel.com
1.There is some improvement, still a lot wasted space. What I would like to do is to remove header text from underneath the picture and put it up inside of the body of the picture. There is a lot of sky that could be written over.
And/or:
a. Yvonne’s Travel Blog – change it to smaller font
b. reduce space between two menus to minimum or remove it entirely
c. make space above the header picture even smaller

2. It worked but it did the same to the home page. I want my home page to stay the way it is now, as far as which elements are showing there.

3 & 4 – worked, thank you!

[lorencowka]

An update to 1. I figured out how to put a text in the picture and now have more space but still would like b. and c. done

[Sakin]

@lorencowka: First, find the following css in your “Appearance => Theme Options => Custom CSS” box and delete it.

#header-right {
    padding-top: 5px;
}
#hgroup-wrap  {
    padding-bottom: 20px;
}
#hgroup-wrap { padding-left: 0; padding-right: 0; }

Then add the following css in “Appearance => Theme Options => Custom CSS” box

#hgroup-wrap, #header-right { padding: 0; }
#header-right .widget.widget_nav_menu {
    background-color: #2885af;
    margin-top: 0;
}

2. Sorry correction of css for this:

#header-left { display: none; }
.home #header-left { display: block; }

[lorencowka]

Both worked, thank you very much!!!!

[lorencowka]

I used your directions you gave to someone else to make my primary menu font bold.
I would like to do the same for my secondary menu. How can I do it? Thanks!

[Sakin]

@lorencowka: Then in your custom css box, find the following css:

#header-menu ul.menu a {
       font-weight: bold;
}

And then replace with the following css:

#header-menu ul.menu a,
#secondary-menu ul.menu a {
       font-weight: bold;
}

[Author]

Posts