Schedule calendar on the BuddyPress user profile page

Hello,
I'm building a website for online doctors appointments. I'm not experienced in development, but I'm trying to do the work.
I'm also using buddypress. Each doctor will have their own profile with their information and I would like to display their A+ calendar schedule so that clients could make an appointment right on their BuddyPress profile page.
Is there a way to do that?
Thanks in advance
Filipe

  • Hakan

    Hi,

    The following information is given to show how to *display* a schedule on a BuddyPress profile only. We don't plan to enable applying from the profile page, but obviously you can modify this solution by adding other shortcodes.

    Outputting the schedule on any existing WordPress template (including BuddyPress) is quite easy. You can simply use:

    echo do_shortcode( '[app_schedule worker="1"]');

    Replace 1 with your user id or $current_user->ID variable to make it general.

    The same applies for other shortcodes too, e.g. pagination.

    Adding a new tab to a BuddyPress profile page is a little bit tricky though. But this is not about and specific to A+.

    Here is a tested sample that adds a My Schedule tab to BP profile page with weekly schedule and next/previous week buttons:

    function my_setup_nav() {
    	global $appointments, $bp;
    	$a = $appointments;
    	if ( !is_object($a) || !$a->is_worker( bp_loggedin_user_id() ) )
    		return;
    
    	bp_core_new_subnav_item( array(
    		'name' => __( 'My Schedule', 'appointments' ),
    		'slug' => 'my-schedule',
    		'parent_url' => $bp->loggedin_user->domain . 'appointments/',
    		'parent_slug' => 'appointments',
    		'screen_function' => 'tab_template_app_schedule'
    	) );
    }
    
    function tab_template_app_schedule() {
    	add_action( 'bp_template_content', 'screen_content_app_schedule' );
    	bp_core_load_template( apply_filters( 'bp_core_template_plugin', 'members/single/plugins' ) );
    
    }
    function screen_content_app_schedule(){
    echo do_shortcode( '[app_schedule worker="'.bp_loggedin_user_id().'" logged=" " title="My Schedule from START to END"]' );
    echo do_shortcode( '[app_pagination]' );
    }
    add_action( 'bp_setup_nav', 'my_setup_nav', 25 );

    Add the above codes inside functions.php of your current BP theme.

    Note: 1) This tab is only visible to service providers themselves. In this example even if you are admin and sole provider, you still need to assign yourself as provider.
    2) Monthly schedule needs some javascript codes, but that is also possible using the "app_bp_footer_scripts" filter. I am noting this for advanced users.
    3) You can add more than 1 week to the same tab, in fact unlimited number of weeks is possible. Just have a look at "add" parameter of the shortcode. But of course it is up to you how you will locate them inside the tab.

    See the attached screenshot for the result.

    I hope this helps.

    Cheers,
    Hakan

  • filcp

    Hi Hakan,

    Thank you very much for your reply. It was very helpful for me to see and understand a few things, it did work very well, but I'm not quite there, yet.

    My idea was to make this schedule public to everyone and that everyone else would be able to apply for an appointment.

    So I researched a little bit and wrote this code:

    function my_setup_nav() {
    
    	bp_core_new_nav_item( array(
    		'name' =>  __( 'Agenda' ),
    		'slug' => 'agenda',
    		'screen_function' => 'agenda_function',
    		'position' => 40 ) );
    
    }
    
    function agenda_function() {
    
    //add title and content here
    add_action( 'bp_template_title', 'agenda_function_title' );
    add_action( 'bp_template_content', 'agenda_function_content' );
    bp_core_load_template( apply_filters( 'bp_core_template_plugin', 'members/single/plugins' ) );
    }
    
    function agenda_function_title() {
    echo 'Agenda';
    }
    
    function agenda_function_content() {
    
    // content
    echo do_shortcode( '[app_schedule]' );
    echo do_shortcode( '[app_confirmation]' );
    echo do_shortcode( '[app_pagination]' );
    
    }
    add_action( 'bp_setup_nav', 'my_setup_nav', 25 );

    I don't know if I wrote it right, but it partially works. I at least get the tab and schedule public to everyone. What I need to do now is:

    1)To show the schedule of the owner's profile, not just a general schedule, which in your code was shown, but for the logged in user only.

    2)To make it possible for everyone to apply for an appointment from that schedule. I tried to add the [app_confirmation] shortcode under to see if it worked, but still nothing happens when I click on a green slot.

    I really hope it is possible to be accomplished.

    Thank you very much for your support.

    Filipe

  • Hakan

    Hi,

    1) Please see: http://codex.buddypress.org/developer/developer-docs/the-bp-global/

    $bp->displayed_user->id gives you the displayed user's ID. Therefore this will do the job:

    global $bp;
    echo do_shortcode( '[app_schedule worker="'.$bp->displayed_user->id.'"]' );

    Also user domain (profile page url) in the sample should be changed accordingly.

    2) For this, you need to add the already generated (see note) javascript codes to the footer:

    function add_app_scripts( $script ){
    global $appointments;
    $appointments->load_scripts_styles( );
    return $script . $appointments->script;
    }
    add_filter( 'app_bp_footer_scripts', 'add_app_scripts' );

    Note: When a shortcode is called, javascript required for that shortcode is generated based on the settings and saved in $appointments->script variable. By using app_bp_footer_scripts hook, you should output the resulting script collection to the footer area of the page. This concept maintains modularity of the shortcodes.

    Cheers,
    Hakan

  • makenice

    Hello,

    I'm trying to get this fully implemented in the same way that Filipe would like it working. I've added the following code to the functions.php file in my theme (I'm using the Frisco for Buddypress theme).

    When I replace my functions.php file I get the following error:

    Parse error: syntax error, unexpected $end.

    Any help would be much appreciated as I'm unsure how to go about implementing this correctly but I would love this functionality on my site.

    function my_setup_nav() {
    	bp_core_new_nav_item( array(
    		'name' =>  __( 'Agenda' ),
    		'slug' => 'agenda',
    		'screen_function' => 'agenda_function',
    		'position' => 40 ) );
    	}
    
    	function agenda_function() {
    	//add title and content here
    	add_action( 'bp_template_title', 'agenda_function_title' );
    	add_action( 'bp_template_content', 'agenda_function_content' );
    	bp_core_load_template( apply_filters( 'bp_core_template_plugin', 'members/single/plugins' ));
    	}
    
    	function agenda_function_title() {
    	echo 'Agenda';
    	}
    
    	function agenda_function_content() {
    	// content
    	global $bp;
    	echo do_shortcode( '[app_schedule worker="'.$bp->displayed_user->id.'"]' );
    	echo do_shortcode( '[app_confirmation]' );
    	echo do_shortcode( '[app_pagination]' );
    	}
    	add_action( 'bp_setup_nav', 'my_setup_nav', 25 );
    
    	function add_app_scripts( $script ){
    	global $appointments;
    	$appointments->load_scripts_styles( );
    	return $script . $appointments->script;
    	}
    	add_filter( 'app_bp_footer_scripts', 'add_app_scripts' );
  • filcp

    Hi Hakan,

    Man, that worked perfectly. I'm so happy. You are great, thank you so much for your help. Really appreciate it.

    @Makenice,
    The last code Hakan shared shouldn't be put where you did it. At least this is how it worked for me. Instead of putting in the function page, I opened the footer.php and placed it there this way

    <?php function add_app_scripts( $script ){
    global $appointments;
    $appointments->load_scripts_styles( );
    return $script . $appointments->script;
    }
    add_filter( 'app_bp_footer_scripts', 'add_app_scripts' );?>

    Right under

    <?php do_action( 'bp_footer' ); ?>
    
    		</div><!-- #footer -->

    I'm not a good developer, but I try things out and this is how it worked.

    Cheers

  • filcp

    Hi Hakan,

    Perhaps this is one of the reasons you do not have schedules on the buddypress profiles as well. I'm going through a problem with it here and would like to know if you could help.

    I got to make everything work with the schedule in the profile, but now it appears in the profile of every member in the website, even the ones that are not service providers. Is there a way to display this content only in the service providers profile and still make it visible to everyone?

    Thanks

    Filipe

  • chookiewookie

    Hi there,

    I've reopened this topic rather than open a new one - hope that is not too rude or anything....

    But I need to confirm whether the above solutions do in fact work? I can't see how it is possible to change service providers availability, for instance, without going into the backend.
    And if you are in the backend, then you are either
    A) in a multi-site configuration, where each user can see their own appointments anyway, hence the above shouldn't be an issue, or
    B) in a WP single site and only the admin will be able to change hours, services, etc.

    By way of explanation, I am experimenting with a single site WP and BP. I have just installed appts+ - and somehow it magically appeared on user's profiles as an appt tab. I can display upcoming appts by user, and display a schedule on each users profile, in various locations on the profile page.

    But the appts are all with ME as the admin, with the users as the CLIENT. There aren't any other appt schedules for appts to be made with.

    The only services and hours that exist are the ones I set as admin, surely. No users have access to the appts+ settings, except for me.

    I hope some of this makes sense. I have come to the conclusion that the only way to proceed will be to experiment with custom profile fields and let users set their appt hours, and allow people to custom search these fields and request an appt via comments or email.
    (and hence that appts+ is not really 'compatible' with BP....)

    thanks,
    nick

  • aecnu

    Greetings Nick,

    Thank you for letting us know and totally hilarious regarding the "warming up" theory, thank you for that.

    It appears this particular topic is now resolved/closed, if you need any further assistance please let us know.

    If it wasn't resolved, or you have any more questions related to this thread, please feel free to post them below including any new symptoms or errors and tick the 'Mark as Not Resolved (re-open)' box below the post area (or else we'll miss it!)

    Thank you for being a WPMU Dev Community Member!

    Cheers, Joe

  • chookiewookie

    Ha!

    No, I meant the built-in cache that Appts+ uses, and which is cleared every 10 minutes ( I think).

    So every 10 minutes something would magically (and finally) change. Didn't quite get why.

    Silly me.

    I'm still stripping the website back to nothing, in order to experiment. Still having troubles, mainly with non-appt-provider users having access to provider appt calendars. Will let you know how it goes!!!

  • David

    Reopening this old thread...

    I've gone through the code here, and can get the schedule info & tabs to display for a currently logged in user on the profile page, but I'd love to be able to display the schedule for displayed_user schedule to show up, if they're assigned as a worker.

    The end goal is making it as easy as possible for students to see tutor availability on the website, and preferably booking as well. I would be happy if students could just see the schedules of an individual tutor.

    Thanks