Real-World Use Cases
Create a central page for posting activities:
Page Title: Community Updates
Page URL: /community-updates/
Content:
<h2>Share What's Happening</h2>
<p>Post your updates, thoughts, and announcements here!</p>
[bppfa_postform]
<hr>
<h3>Recent Activities</h3>
[Display recent activities widget or shortcode]
Add quick posting to your homepage:
// In your homepage template
<div class="homepage-activity-post">
<div class="container">
<h3>What's on your mind?</h3>
<?php echo do_shortcode('[bppfa_postform]'); ?>
</div>
</div>
Create group-specific posting pages:
Page: Marketing Team Updates
Content:
Welcome to the Marketing Team activity page!
[bppfa_postform]
<style>
/* Pre-select Marketing Team group */
#bppfa-whats-new-post-in option[value="5"] {
selected: selected;
}
</style>
Add activity posting at the end of blog posts:
Your blog post content...
<div class="post-discussion">
<h3>Join the Discussion</h3>
<p>Share your thoughts about this article:</p>
[bppfa_postform]
</div>
Add to course completion pages:
Congratulations on completing the course!
Share your achievement with the community:
[bppfa_postform]
Add to order thank you page:
// In functions.php
add_action('woocommerce_thankyou', 'add_activity_post_after_purchase');
function add_activity_post_after_purchase($order_id) {
?>
<div class="share-purchase">
<h3>Share Your Purchase</h3>
<p>Let the community know about your new purchase!</p>
<?php echo do_shortcode('[bppfa_postform]'); ?>
</div>
<?php
}
// Show form only to specific roles
function display_activity_form_by_role() {
$allowed_roles = array('subscriber', 'contributor', 'author');
$user = wp_get_current_user();
if (array_intersect($allowed_roles, $user->roles)) {
echo do_shortcode('[bppfa_postform]');
} else {
echo '<p>Upgrade your membership to post activities!</p>';
}
}
// Usage in template
<?php display_activity_form_by_role(); ?>
<!-- Modern Card Style -->
<div class="activity-card">
<div class="card-header">
<h3>📢 Share an Update</h3>
</div>
<div class="card-body">
[bppfa_postform]
</div>
</div>
<style>
.activity-card {
background: white;
border-radius: 12px;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
padding: 0;
margin: 20px 0;
}
.card-header {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 20px;
border-radius: 12px 12px 0 0;
}
.card-body {
padding: 20px;
}
</style>
<!-- Trigger Button -->
<button id="open-activity-modal" class="btn btn-primary">
Post an Update
</button>
<!-- Modal -->
<div id="activity-modal" class="modal">
<div class="modal-content">
<span class="close">×</span>
<h2>Share with Community</h2>
[bppfa_postform]
</div>
</div>
<style>
.modal {
display: none;
position: fixed;
z-index: 1000;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.5);
}
.modal-content {
background-color: #fefefe;
margin: 15% auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
max-width: 600px;
border-radius: 8px;
}
.close {
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
cursor: pointer;
}
</style>
<script>
jQuery(document).ready(function($) {
$('#open-activity-modal').click(function() {
$('#activity-modal').show();
});
$('.close').click(function() {
$('#activity-modal').hide();
});
});
</script>
// In functions.php
add_action('widgets_init', function() {
register_sidebar(array(
'name' => 'Activity Posting Sidebar',
'id' => 'activity-posting-sidebar',
'before_widget' => '<div class="activity-widget">',
'after_widget' => '</div>',
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
));
});
// In your theme sidebar
<?php if (is_active_sidebar('activity-posting-sidebar')) : ?>
<div class="quick-post-widget">
<h3>Quick Update</h3>
<?php echo do_shortcode('[bppfa_postform]'); ?>
</div>
<?php endif; ?>
// Show after user completes profile
add_action('xprofile_updated_profile', 'show_celebration_post_form', 10, 3);
function show_celebration_post_form($user_id, $posted_field_ids, $errors) {
if (empty($errors)) {
?>
<div class="profile-complete-celebration">
<h3>🎉 Profile Updated!</h3>
<p>Share your updated profile with the community:</p>
<?php echo do_shortcode('[bppfa_postform]'); ?>
</div>
<?php
}
}
<!-- Step 1: Choose Type -->
<div id="step1" class="form-step">
<h3>What would you like to share?</h3>
<button onclick="showStep2('update')">Status Update</button>
<button onclick="showStep2('achievement')">Achievement</button>
<button onclick="showStep2('question')">Question</button>
</div>
<!-- Step 2: Post Form -->
<div id="step2" class="form-step" style="display:none;">
<h3 id="post-title"></h3>
<div id="post-prefix"></div>
[bppfa_postform]
</div>
<script>
function showStep2(type) {
document.getElementById('step1').style.display = 'none';
document.getElementById('step2').style.display = 'block';
if(type === 'achievement') {
document.getElementById('post-title').innerText = '🏆 Share Your Achievement';
document.getElementById('post-prefix').innerHTML = '<p>Start with: "I just achieved..."</p>';
} else if(type === 'question') {
document.getElementById('post-title').innerText = '❓ Ask the Community';
document.getElementById('post-prefix').innerHTML = '<p>Start with: "Does anyone know..."</p>';
} else {
document.getElementById('post-title').innerText = '📝 Post an Update';
}
}
</script>
<div class="corporate-updates">
<div class="update-header">
<img src="/logo.png" alt="Company Logo">
<h2>Company Announcements</h2>
</div>
<div class="update-form">
<p>Share important updates with your team:</p>
[bppfa_postform]
</div>
<div class="update-guidelines">
<h4>Posting Guidelines:</h4>
<ul>
<li>Keep it professional</li>
<li>No confidential information</li>
<li>Tag relevant team members with @mentions</li>
</ul>
</div>
</div>
<div class="gaming-post">
<div class="game-header">
<h2>🎮 Share Your Gaming Moments</h2>
<div class="game-tags">
<span class="tag">#Victory</span>
<span class="tag">#Epic</span>
<span class="tag">#Fail</span>
</div>
</div>
[bppfa_postform]
<p class="hint">Pro tip: Use hashtags to categorize your post!</p>
</div>
<div class="edu-discussion">
<div class="discussion-prompt">
<h3>Today's Discussion Topic:</h3>
<p>"How has online learning changed your perspective?"</p>
</div>
<div class="response-form">
<h4>Share Your Thoughts:</h4>
[bppfa_postform]
</div>
</div>
<!-- FAB Button -->
<div class="fab-container">
<button class="fab" onclick="togglePostForm()">
<span class="fab-icon">+</span>
</button>
</div>
<!-- Slide-up Form -->
<div id="mobile-post-form" class="slide-form">
<div class="form-header">
<h3>Quick Post</h3>
<span class="close-form" onclick="togglePostForm()">×</span>
</div>
[bppfa_postform]
</div>
<style>
.fab-container {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 999;
}
.fab {
width: 56px;
height: 56px;
border-radius: 50%;
background: #007cba;
color: white;
border: none;
font-size: 24px;
box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}
.slide-form {
position: fixed;
bottom: -100%;
left: 0;
right: 0;
background: white;
padding: 20px;
box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
transition: bottom 0.3s ease;
z-index: 998;
}
.slide-form.active {
bottom: 0;
}
</style>
<script>
function togglePostForm() {
document.getElementById('mobile-post-form').classList.toggle('active');
}
</script>
// Only load form when user scrolls to it
add_action('wp_footer', function() {
?>
<script>
jQuery(document).ready(function($) {
var formLoaded = false;
$(window).scroll(function() {
if (!formLoaded && $('#lazy-activity-form').isInViewport()) {
$('#lazy-activity-form').html('<?php echo do_shortcode("[bppfa_postform]"); ?>');
formLoaded = true;
}
});
});
</script>
<?php
});
// Load form via AJAX when needed
function loadActivityForm() {
jQuery.ajax({
url: ajaxurl,
type: 'POST',
data: {
action: 'load_activity_form'
},
success: function(response) {
jQuery('#activity-form-container').html(response);
}
});
}