Guru
asked 6 years ago

Hi All,
I absolutely adore this top menu bar which is very sleek and cute. But above all its very functional, and I am looking to get one for my normal theme which doesn’t have any such features. Can anyone please help?

Best regards,

5 Answers
DominicStaff
answered 6 years ago

Hi Guru !
Regarding the top menu bar you are mentioning, it is not a feature of the theme, it is our separate plugin named DW Promobar . Please download the plugin here: http://designwall.com/wordpress/plugins/dw-promobar/ and configure according to your needs.

Guru
answered 6 years ago

Hi @Dominic,
Thanks for your quick response!
I should have been more clear, I was’nt talking about the promo bar. Which is a fantastic plugin I must say. But I was refereing to the menu items below the promo bar which is the actual main menu for Design Wall like in these screenshots:
http://postimg.org/image/qad8bqkqb/
http://s7.postimg.org/p79j2gvkb/Untitled2.png
 
Any help will be most appreciated. And sharing it here would benefit many others in my shoes!
 
Best regards and Cheerios!

Jackie Lord
answered 6 years ago

Let me explain how we did it:
Step 1. Disable default Admin bar of WordPress:

 add_filter( 'show_admin_bar', '__return_false' , 1000 );

Step 2. Create a new “Topbar” function:

 add_action( 'wp_footer', 'themename_topbar' );
function themename_topbar() { ?>
<div id="topbar">
<ul class="social-links">
<li class="facebook"><a href="#">Facebook</a></li>
<li class="twitter"><a href="#">Twitter</a></li>
</ul>
<?php if (is_user_logged_in()) : //Check if user logged in, display profile links ?>
<?php global $current_user; get_currentuserinfo(); // Get current user info ?>
<ul class="profile-links">
<li><?php echo get_avatar( $current_user->ID, 18 ); ?> <?php echo $current_user->display_name; ?></li>
</ul>
<?php else : // Display login & register link ?>
<ul class="login-links">
<li><a href="<?php echo wp_login_url(); ?>">Login</a> or <a href="<?php echo wp_login_url().'?action=register'?>">Register</a></li>
</ul>
<?php endif; ?>
</div>
<?php }

You may need add some CSS codes to have a topbar look like at DesignWall. This is a quick sample:

 #topbar {
background: #333;
}

#topbar a {
color: #fff;
}

#topbar ul {
list-style: none;
display: inline;
}

#topbar ul li {
margin: 0 10px;
line-height: 30px;
}

#topbar .profile-links,
#topbar .login-links {
float: right;
}

Hope this helps,
Jackie

Guru
replied 6 years ago

Dear @jackie,

Thank for the answer, much appreciated, however, this is a very basic menu bar and does not fulfill the requirement as I had described earlier.

i was referring to the designwall.com dw-topbar in literal terms.

The theme I am using does not have a topbar, and looking at the sleek design you have I just couldn’t resist asking.

Looking forward to your answer. Any help would be appreciated.

Best regards,

Guru
replied 6 years ago

Dear @jackie Any response please

well wisher
replied 6 years ago

Hi @guru you can get a sticky header navigation by using “sticky notification bar plugin” i used to use it with my old theme before switching to wallpress the plugin gives you options to have drop down menus or a promotional message like dw promo bar plugin ,you can tweak the code and add the functionality by using code provided by @jackei jus a suggestion i am not sure if its good thing to do though 🙂

Jackie Lord
answered 6 years ago

On DesignWall, I just use those simple codes to make the topbar. Good or bad depends on a lot of CSS. Can you commit your theme (or your website) to Github (private repo is the most effective way) then invite me to your project – j4ckielord is my username. I’m not sure but hopefully I can help you a bit.

well wisher
answered 6 years ago

Hi now that was an really really good question thanks for putting it up @guru i was trying do that kinda thing with the wallpress theme from many days but  hardly achieved any success @jackie as their is already a sticky top nav bar in wallpress is it possible to cut the code you gave a bit and get that work done in lesser steps with wallpress?
Plus you may be using a redirect to profile plugin i suppose to redirect the user to profile after login instead of the backend dashboard i suppose,that means even admin would not be able to get to get into backend dashboard atleast not without adding a hook that override the redirect for admins.

well wisher
replied 6 years ago

i tried the code provided by @jackie it works perfect but the code only adds the basic things like current logged in user avatar and his/her name with two anchors(facebook and twitter) along the side,the url of the facebook and twitter pages needs to be hard coded in the function manually ,there is no actiion or function which will be retrieve and add the buddypress menu elements such as Activity ,Profile etc +1 for the code provided above to give the basic idea though 🙂

Guru
replied 6 years ago

Valid points Wellwisher, I just need some time to sit down and try to work it out. Will update you how it goes!
Cheers 🙂

Jackie Lord
answered 6 years ago

@wellwisher: the code that I gave out was just a sample one. On our site since we have other plugins like BuddyPress and MyCred, the code is slightly different, but no guarantee that it would work for your site. 
I provide a hard code link because I believe social links on a website are hardly changed. Also when you use the topbar for your site, I don’t think bringing too much option to it would be good as it could lead to slow loading for the site.
@Guru: I think you can submit your code into our Github project and we can create a plugin for that.

well wisher
replied 6 years ago

thanks for your answers @jackei i understand your point actually i am also waiting for the buddypress compatible version of the wallpress cos i have played with buddypress a lot and would like to show you something i did on my site when the completely buddypress compatible version of wallpress comes out,i hope it will be usefull for may other wallpress and buddypress users thanks

Powered by DW Question & Answer Pro