need to update buddy press topbar - wordpress

i am new to word press and trying to modify Buddy Press top bar.
my current top bar is
i want to make user area top bar like
the basic difference is to put the login user image/aviator on left side of bar.
and also if possible remove visit link from right side.
Thanks

I suggest you start by creating a custom theme (or plugin if you prefer) that is a child theme of the bp-default theme. Follow the instructions here or here.
From there you can remove the Visit menu like so:
remove_action( 'bp_adminbar_menus', 'bp_adminbar_random_menu', 100 );
When it comes to the avatar, the easiest solution is probably to unregister BuddyPress default admin bar logo bp_adminbar_logo, create a replacement function to output the avatar, and finally register that function instead.
remove_action( 'bp_adminbar_logo', 'bp_adminbar_logo' );
function my_adminbar_logo() {
echo '<a href="' . bp_core_get_userlink( bp_loggedin_user_id(), false, true ) . '">';
bp_loggedin_user_avatar( 'type=thumb&width=40&height=40' );
echo "</a>";
}
add_action( 'bp_adminbar_logo', 'my_adminbar_logo' );
There, just add some CSS and you're done :)

Related

Wocommerce back button from single product back to previous page styling to make it a button

I've made a back link to take customer from single product back to product display. I need to know how to give this code a class to make it a button.
The code is
add_action( 'woocommerce_after_add_to_cart_button', 'back_button', 10 );
function back_button() {
global $product;
echo ' Go Back to selection ';
Thanks
I tried putting
add_action( 'woocommerce_after_add_to_cart_button', 'back_button', 10 );
function back_button() {
global $product;
echo ' <button>Go Back to selection</button> ';
}
In answer to my own question, even though it's not really what I was after but it does the job. I got Wordpress Back button widget plugin. It lets you add “Back” button to your website.
The button can be added via widget, [alg_back_button] shortcode or echo alg_back_button( 'Back' ); function. So until I learn more, this will do. I hope this will help someone else :)

How to add search button in wordpress Menu

I want a search button at the right side of the primary menu which display a searchbox under primary menu once it is clicked.I am a newbie in wordpress and only know html and php basic.Can anyone please help me out?
To add the Custom Items into your menu , Then you should use the filter hook wp_nav_menu_items.
Please see the below Code and paste it into the current active theme functions.php file :
add_filter('wp_nav_menu_items','add_search_box_into_menu', 10, 2);
function add_search_box_into_menu( $nav, $args ) {
if( $args->theme_location == 'primary' )
$nav .= '<li class="custom-header-search"><form action="'.home_url( "/" ).' id="searchform" method="get"><input type="text" name="s" id="s" placeholder="Search"></form></li>';
return $nav;
}
For more help : See here
You'll need to add not just a link, but the search form.
To do so, you need to customize your theme.
Important: if you use a theme you didn't create, then first create a child theme and modify it (it will ensure you that your changes are still applied ethen if the theme recieve updated).
Then in the HTML/PHP code where you menu is, you can use the get_search_form() method to display the search form in place.
If you want to customize the search form, juste create a searchform.php file in your theme folder and customize it.
More informations here : https://codex.wordpress.org/Styling_Theme_Forms

Get URL of image placed in my Footer area in Wordpress as widget

I created widget area (Footer area) for my Wordpress theme where I can add Image widget. The thing is that I would like to get url of image that is into my Footer area as widget. Is there a function for that?
In functions.php I add:
function widgets() {
register_sidebar(
array(
'name' => 'Footer area',
'id'=> 'footer_area1'
)
);
}
In my header.php I add:
<div id="Footer">
<?php
dynamic_sidebar('footer_area1');
?>
</div>
Now, I can add all sorts of widgets (Image, Text, Meta, Menu etc.) into that area. But when I add Image widget that is default widget, I would like to get URL of image/picture that is placed in that area through Image widget. How can I get url?
I hope that clears the question.
This will work for you
<?php dynamic_sidebar( 'footer_area1' ); ?>
As per the documentation https://developer.wordpress.org/reference/functions/dynamic_sidebar/
Edit
If you would like to extend the Image Widget, you can try look at using this https://codex.wordpress.org/Function_Reference/the_widget
But for a much more easier approach, I'd suggest uploading your image to Media Library and then copying the image url from there and pasting it into a custom widget area.
Widget settings are stored in the options table. You can get the content of an option field with get_option(). Replace MY_WIDGET with the actual ID of your widget:
$widget = get_option( 'widget_MY_WIDGET' );
Use print_r to inspect the returned value (false if option does not exist) and get an idea of how to grab the desired value:
print_r( $widget );
EDIT :
To find the widget id :
Open Appearance->Widgets
On top of the screen, find “Screen Options” and open it
Click on “Enable Accessibility Mode”
Find a widget for which you want to know ID and click the “Edit” button
In the address bar, find “editwidget=something” where “something” is the ID you are looking for

Top-level menu item to edit a specific page

I'm not sure if this is possible or advisable, but I'd like to have a top-level menu item on the sidebar in the admin dashboard that links to a specific page within wordpress for editing.
Maybe there's a better way of doing this... here's the functionality I'm after:
I have a page called "Upgrade Contents" where my client can edit the contents of their upgrade package sitewide. I'd like them to be able to edit this page directly from the admin dashboard, like a setting page. Problem is, I don't know how to add a link to edit this page to the admin AND I already have everything set up with ACF using this page.
Is adding a link easy to do or should I just scrap it and make a settings page for my theme and add THAT to the admin?
To add a link at the top level of the menu you can add an item to the global $menu array, like this:
function link_to_user_settings() {
global $menu;
$title = 'User Settings';
$url = 'URL_OF_YOUR_PAGE';
$position = 73;
$permission = 'read';
$icon = 'dashicons-admin-links';
$menu[$position] = array( $title, $permission, $url, '', 'menu-top', '', $icon );
}
add_action( 'admin_menu', 'link_to_user_settings' );
Change the variables accordingly to your needs.
The $position var is where you want the link to appear based on the default positions you can find at the add_menu_page() documentation (in my example 73 means after the Users menu item).

Wordpress Menu + Bootstrap + Glyphicon Instead Text

So I'm working on a Wordpress site with Bootstrap.
I'm using Bootstrap's navbar for the menu integrated with WP.
I have my homepage as a link in the navbar as "home".
Instead of "Home" as a text I want a glyphicon to appear and not text.
I think I could use CSS for that... something like this:
#menu-item-55 {
/* something that removes text and adds the icon */
}
But in bootstrap I have to use the icons like this
<span class="glyphicon glyphicon-search"></span>
Anyone?
Thanks
I figured that I can do it by adding a custom link and putting the inside the navigation label.
I still would like another way to do it. :D
Cheers
If you are using the wordpress 3+ wp_nav_menu with your theme adding this snippet to the functions.php will add a glyphicon-home link of bootstrap to your navigation.
function addHomeMenuLink($menuItems, $args)
{
if('header_menu' == $args->theme_location) // make sure to give the right theme location for the menu
{
if ( is_front_page() )
$class = 'class="current-menu-item active"';
else
$class = '';
$homeMenuItem = '<li ' . $class . '>' .
$args->before .
'<a class="glyphicon glyphicon-home" href="' . home_url( '/' ) . '" title="Home">' .
$args->link_before .
/* 'HOME' . //add home text if you want. */
$args->link_after .
'</a>' .
$args->after .
'</li>';
$menuItems = $homeMenuItem . $menuItems;
}
return $menuItems;
}
add_filter( 'wp_nav_menu_items', 'addHomeMenuLink', 10, 2 );
source
Navigate to Appearance > Menus
Find the menu item that you want to add an icon to
Expand the menu item
Inside the Navigation Item you will want to add your icon code either before or after or in place of your existing menu item label. For this example I’m going to use the home icon. Here’s what you would type:
< i class='icon-home icon-white'>< /i> Home
Note: Make sure to use single quotes!
5.Important: This is something you want to make sure to do, it could negatively impact your SEO if you ignore this step. You will want to make sure to put the plain text in the Title Attribute field.
6.Save the menu. (Also make sure you have selected one of the menus from the Theme Locations drop downs) That’s it!
http://jasonbradley.me/icons-in-the-wordpress-menu/

Resources