How Would I Create A Website Similar to the One Attached?

http://www.newbeginningbeautysalon.com/#pgContact


Hello,
Paste the following code also in your Custom CSS and do not delete the previous code.
(Appearance -> Theme Options -> Styling Options -> Custom CSS)

Code:

.footer-container {
display: none ! important;
}
.content {
display: none  ! important;
}
.slider-container {
margin-top: 0px ! important;
border-bottom: 0px ! important;
}
#menu li.current-menu-item a, #menu li.current-menu-parent a, #menu li.current_page_parent a, #menu li a.selected, #menu li a:hover, #menu li.current_page_item a {
padding-left: 2px;
padding-right: 2px;
padding-top: 2px;
padding-bottom: 2px;
}
#menu li {
font-size: 10px;
}
.header .menu-bar {
height: 28px;
margin-left: 0px;
margin-right: 0px;
}

You can adjust these values as per your requirement.

 

Hello,

May be you like to use the RoadFighter theme that has the Full width home page slider and it will suit your requirements. Feel free to try the trial version of theme before purchasing the PRO version and make yourself satisfy. Here is the link for the theme.

http://www.inkthemes.com/wp-themes/roadfighter-wordpress-theme/

Hope you will like the template.

 

Here's what I was able to come up with:

http://salonsample3.onlineentrepreneur.info/

Is there anyway to make the menu area transparent, make it smaller, remove the space just above the footer, and move the menu to the left. Thanks in advance.

 

Hello,
Paste the following code in your Custom CSS
(Appearance -> Theme Options -> Styling Options -> Custom CSS)

Code:

#menu li.current-menu-item a, #menu li.current-menu-parent a, #menu li.current_page_parent a, #menu li a.selected, #menu li a:hover, #menu li.current_page_item a {
background: transparent;
color: black;
}
.container {
background: transparent;
}
.footer-container {
display: none;
}
.content-wrapper {
display: none;
}
.slider-container {
border-bottom: none;
}

This will solve your issue.

 

Hi Piyush,

So far, the slider area isn't transparent, it hasn't moved to the left, it is still the very same size. The only thing that did change is the footer area is gone.

Also, another change that it made that I don't like is it took away the highlighting color for the menu item.

And finally, I also wanted to be able to move it down a little bit.

So to finalize, I would like to have it transparent, smaller in size (probably half the normal size), move it to the left or right (once I have the code I'll play with where I want it on the page), move it further to the bottom, and I would like to have the highlighting back for the menu.

Thank you .

 

Hi Piyush,

One last question re the same website, I'd also like to remove the extra space at the very top and bottom of the menu. Last bit of questions. Promise.

 

Hello,
Remove the following code from your Custom CSS
(Appearance -> Theme Options -> Styling Options -> Custom CSS)

Code:

#menu li.current-menu-item a, #menu li.current-menu-parent a, #menu li.current_page_parent a, #menu li a.selected, #menu li a:hover, #menu li.current_page_item a {
background: transparent;
color: black;
}

This will return back the highlights feature of menu.

Now, paste the following code in your Custom CSS

Code:

.container {
background-color: transparent ! important;
box-shadow: none ! important;
}
.header .menu-bar {
margin-top: 0px;
}
.slider-container {
margin-top: 0px;
}
.slide-img {
opacity: .5;
}

This will solve your most of the issue.

Please specify your issue more clearly about the menu alignment with the help of screenshot images that where you want to relocate it.

 

I'm a little overwhelmed at the moment. I'm not sure what I'm not saying that is making it so difficult for you to understand. I want to make the menu 50% smaller horizontally and vertically. I want to move it to the left. I want to move it to the bottom.

These are things that can't be drawn on a screen shot. In addition, the extra space in the bottom margin is now back. I've included a screenshot of that.​

​

The website is: http://salonsample3.onlineentrepreneur.info/. Thank you
​

 

Hello,
Paste the following code also in your Custom CSS and do not delete the previous code.
(Appearance -> Theme Options -> Styling Options -> Custom CSS)

Code:

.footer-container {
display: none ! important;
}
.content {
display: none  ! important;
}
.slider-container {
margin-top: 0px ! important;
border-bottom: 0px ! important;
}
#menu li.current-menu-item a, #menu li.current-menu-parent a, #menu li.current_page_parent a, #menu li a.selected, #menu li a:hover, #menu li.current_page_item a {
padding-left: 2px;
padding-right: 2px;
padding-top: 2px;
padding-bottom: 2px;
}
#menu li {
font-size: 10px;
}
.header .menu-bar {
height: 28px;
margin-left: 0px;
margin-right: 0px;
}

You can adjust these values as per your requirement.

 

Just forget it. I'll see if I'm able to get the answer from somewhere else!!!!!!!

 

PM sent.