Below are four additional theme partials (no-JS compact card by default, with a tiny toggle script to reveal the official embed/feed). Drop each file into template-parts/ in your (child) theme, then include anywhere with get_template_part('template-parts/<slug>');.
1) LinkedIn — template-parts/solveforce-on-linkedin.php
<?php
/**
* Template Part: SolveForce on LinkedIn — Compact Card + Embed Toggle
* Usage: get_template_part('template-parts/solveforce-on-linkedin');
*/
$args = [
'company_url' => 'https://www.linkedin.com/company/solveforce/',
// Replace with your org URN embed (or a single post embed):
// For org: https://www.linkedin.com/embed/feed/update/urn:li:organization:<ORG_ID>
// For post: https://www.linkedin.com/embed/feed/update/urn:li:activity:<POST_ID>
'embed_src' => 'https://www.linkedin.com/embed/feed/update/urn:li:organization:123456789',
'avatar' => 'https://media.licdn.com/dms/image/C4D0BAQ/placeholder/company-logo_200_200/0/1',
'name' => 'SolveForce',
'tagline' => 'Information Technology Solutions · USA',
'max_width' => '720px',
'height' => 650,
];
$uid = 'sfl_' . wp_generate_uuid4();
?>
<div id="<?php echo esc_attr($uid); ?>" class="sfl-wrap">
<style>
#<?php echo $uid; ?> .sfl-card{border:1px solid #e9ecef;border-radius:14px;padding:18px;max-width:<?php echo esc_attr($args['max_width']); ?>;display:flex;gap:16px;align-items:center;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.04)}
#<?php echo $uid; ?> .sfl-avatar{width:72px;height:72px;border-radius:50%;object-fit:cover;border:1px solid #f0f0f0}
#<?php echo $uid; ?> .sfl-body{flex:1 1 auto}
#<?php echo $uid; ?> .sfl-name{font-weight:700;font-size:1.05rem;line-height:1.2}
#<?php echo $uid; ?> .sfl-tag{opacity:.85;margin:.4rem 0 .6rem}
#<?php echo $uid; ?> .sfl-actions{margin-top:.7rem;display:flex;gap:10px;flex-wrap:wrap}
#<?php echo $uid; ?> .sfl-btn{border:1px solid #0a66c2;border-radius:999px;padding:.45rem .95rem;font-weight:600;font-size:.95rem;text-decoration:none}
#<?php echo $uid; ?> .sfl-btn.secondary{border-color:#ced4da;color:#222}
#<?php echo $uid; ?> .sfl-embed{display:none;max-width:<?php echo esc_attr($args['max_width']); ?>}
</style>
<div class="sfl-card" aria-label="SolveForce on LinkedIn compact profile">
<img class="sfl-avatar" src="<?php echo esc_url($args['avatar']); ?>" alt="SolveForce LinkedIn avatar">
<div class="sfl-body">
<div class="sfl-name"><?php echo esc_html($args['name']); ?> <span class="sfl-tag">LinkedIn</span></div>
<div class="sfl-tag"><?php echo esc_html($args['tagline']); ?></div>
<div class="sfl-actions">
<a class="sfl-btn" href="<?php echo esc_url($args['company_url']); ?>" target="_blank" rel="noopener">Open on LinkedIn</a>
<a class="sfl-btn secondary sfl-toggle" role="button" aria-expanded="false">Show Feed</a>
</div>
</div>
</div>
<div class="sfl-embed" aria-hidden="true">
<iframe src="<?php echo esc_url($args['embed_src']); ?>" height="<?php echo (int)$args['height']; ?>" width="100%" frameborder="0" allowfullscreen="" title="LinkedIn Feed"></iframe>
</div>
<script>
(function(){
var wrap=document.getElementById('<?php echo esc_js($uid); ?>');
if(!wrap) return;
var toggle=wrap.querySelector('.sfl-toggle'), card=wrap.querySelector('.sfl-card'), embed=wrap.querySelector('.sfl-embed');
toggle.addEventListener('click', function(e){
e.preventDefault();
if(embed.style.display==='block'){
embed.style.display='none'; embed.setAttribute('aria-hidden','true');
card.style.display='flex'; toggle.textContent='Show Feed'; toggle.setAttribute('aria-expanded','false');
}else{
card.style.display='none';
embed.style.display='block'; embed.setAttribute('aria-hidden','false');
toggle.textContent='Show Card'; toggle.setAttribute('aria-expanded','true');
}
}, {passive:true});
})();
</script>
</div>
2) YouTube — template-parts/solveforce-on-youtube.php
<?php
/**
* Template Part: SolveForce on YouTube — Compact Card + Channel/Playlist Toggle
* Usage: get_template_part('template-parts/solveforce-on-youtube');
*/
$args = [
'channel_url' => 'https://www.youtube.com/@solveforce', // public channel URL
// Choose ONE embed URL (channel or playlist). Example playlist id: PLxxxxxxxx
'embed_src' => 'https://www.youtube.com/embed?listType=playlist&list=PLxxxxxxxx',
'avatar' => 'https://yt3.googleusercontent.com/placeholder=s176-c-k-c0x00ffffff-no-rj',
'name' => 'SolveForce',
'tagline' => 'Videos & demos',
'subs' => '—', // optional snapshot text
'videos' => '—',
'max_width' => '720px',
'height' => 650,
];
$uid = 'sfy_' . wp_generate_uuid4();
?>
<div id="<?php echo esc_attr($uid); ?>" class="sfy-wrap">
<style>
#<?php echo $uid; ?> .sfy-card{border:1px solid #e9ecef;border-radius:14px;padding:18px;max-width:<?php echo esc_attr($args['max_width']); ?>;display:flex;gap:16px;align-items:center;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.04)}
#<?php echo $uid; ?> .sfy-avatar{width:72px;height:72px;border-radius:14px;object-fit:cover;border:1px solid #f0f0f0}
#<?php echo $uid; ?> .sfy-body{flex:1 1 auto}
#<?php echo $uid; ?> .sfy-name{font-weight:700;font-size:1.05rem;line-height:1.2}
#<?php echo $uid; ?> .sfy-tag{opacity:.85;margin:.4rem 0 .6rem}
#<?php echo $uid; ?> .sfy-meta{opacity:.85;display:flex;gap:12px;flex-wrap:wrap}
#<?php echo $uid; ?> .sfy-actions{margin-top:.7rem;display:flex;gap:10px;flex-wrap:wrap}
#<?php echo $uid; ?> .sfy-btn{border:1px solid #ff0000;border-radius:999px;padding:.45rem .95rem;font-weight:600;font-size:.95rem;text-decoration:none}
#<?php echo $uid; ?> .sfy-btn.secondary{border-color:#ced4da;color:#222}
#<?php echo $uid; ?> .sfy-embed{display:none;max-width:<?php echo esc_attr($args['max_width']); ?>}
#<?php echo $uid; ?> .sfy-embed iframe{width:100%}
</style>
<div class="sfy-card" aria-label="SolveForce on YouTube compact profile">
<img class="sfy-avatar" src="<?php echo esc_url($args['avatar']); ?>" alt="SolveForce YouTube avatar">
<div class="sfy-body">
<div class="sfy-name"><?php echo esc_html($args['name']); ?> <span class="sfy-tag">YouTube</span></div>
<div class="sfy-tag"><?php echo esc_html($args['tagline']); ?></div>
<div class="sfy-meta">
<span>Subs: <?php echo esc_html($args['subs']); ?></span>
<span>Videos: <?php echo esc_html($args['videos']); ?></span>
</div>
<div class="sfy-actions">
<a class="sfy-btn" href="<?php echo esc_url($args['channel_url']); ?>" target="_blank" rel="noopener">Open on YouTube</a>
<a class="sfy-btn secondary sfy-toggle" role="button" aria-expanded="false">Show Player</a>
</div>
</div>
</div>
<div class="sfy-embed" aria-hidden="true">
<iframe src="<?php echo esc_url($args['embed_src']); ?>" height="<?php echo (int)$args['height']; ?>" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen title="YouTube Embed"></iframe>
</div>
<script>
(function(){
var wrap=document.getElementById('<?php echo esc_js($uid); ?>');
if(!wrap) return;
var toggle=wrap.querySelector('.sfy-toggle'), card=wrap.querySelector('.sfy-card'), embed=wrap.querySelector('.sfy-embed');
toggle.addEventListener('click', function(e){
e.preventDefault();
if(embed.style.display==='block'){
embed.style.display='none'; embed.setAttribute('aria-hidden','true');
card.style.display='flex'; toggle.textContent='Show Player'; toggle.setAttribute('aria-expanded','false');
} else {
card.style.display='none';
embed.style.display='block'; embed.setAttribute('aria-hidden','false');
toggle.textContent='Show Card'; toggle.setAttribute('aria-expanded','true');
}
}, {passive:true});
})();
</script>
</div>
3) Contact Card — template-parts/solveforce-contact-card.php
<?php
/**
* Template Part: SolveForce Contact Card — No-JS Card + Toggle to Simple Form
* Note: The card itself is no-JS. The toggle reveals a lightweight inline form (no external JS).
*/
$args = [
'phone' => '(888) 765-8301',
'email' => 'sales@solveforce.com',
'location' => 'USA',
'site' => 'https://solveforce.com',
'max_width' => '720px',
];
$uid = 'sfc_' . wp_generate_uuid4();
?>
<div id="<?php echo esc_attr($uid); ?>" class="sfc-wrap">
<style>
#<?php echo $uid; ?> .sfc-card{border:1px solid #e9ecef;border-radius:14px;padding:18px;max-width:<?php echo esc_attr($args['max_width']); ?>;display:flex;gap:16px;align-items:center;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.04)}
#<?php echo $uid; ?> .sfc-icon{width:72px;height:72px;border-radius:14px;display:grid;place-items:center;border:1px solid #f0f0f0;font-weight:800}
#<?php echo $uid; ?> .sfc-body{flex:1 1 auto}
#<?php echo $uid; ?> .sfc-name{font-weight:700;font-size:1.05rem;line-height:1.2}
#<?php echo $uid; ?> .sfc-meta{opacity:.9;margin:.4rem 0 .6rem;display:flex;gap:12px;flex-wrap:wrap}
#<?php echo $uid; ?> .sfc-actions{margin-top:.7rem;display:flex;gap:10px;flex-wrap:wrap}
#<?php echo $uid; ?> .sfc-btn{border:1px solid #1d9bf0;border-radius:999px;padding:.45rem .95rem;font-weight:600;font-size:.95rem;text-decoration:none}
#<?php echo $uid; ?> .sfc-btn.secondary{border-color:#ced4da;color:#222}
#<?php echo $uid; ?> .sfc-form{display:none;margin-top:12px}
#<?php echo $uid; ?> .sfc-form input, #<?php echo $uid; ?> .sfc-form textarea{width:100%;border:1px solid #e9ecef;border-radius:10px;padding:.6rem .75rem;margin:.35rem 0;font:inherit}
#<?php echo $uid; ?> .sfc-form button{border:1px solid #1d9bf0;border-radius:999px;padding:.5rem 1rem;font-weight:700}
</style>
<div class="sfc-card" aria-label="SolveForce Contact Card">
<div class="sfc-icon" aria-hidden="true">SF</div>
<div class="sfc-body">
<div class="sfc-name">Contact SolveForce</div>
<div class="sfc-meta">
<span>📞 <?php echo esc_html($args['phone']); ?></span>
<span>✉️ <a href="mailto:<?php echo antispambot($args['email']); ?>"><?php echo antispambot($args['email']); ?></a></span>
<span>📍 <?php echo esc_html($args['location']); ?></span>
</div>
<div class="sfc-actions">
<a class="sfc-btn" href="<?php echo esc_url($args['site']); ?>" target="_blank" rel="noopener">Visit Website</a>
<a class="sfc-btn secondary sfc-toggle" role="button" aria-expanded="false">Message Us</a>
</div>
<form class="sfc-form" method="post" action="<?php echo esc_url(admin_url('admin-post.php')); ?>">
<?php /* Minimal, no-JS form (hook admin_post_nopriv_sf_contact / admin_post_sf_contact) */ ?>
<input type="hidden" name="action" value="sf_contact">
<?php wp_nonce_field('sf_contact_nonce', 'sf_contact_nonce_field'); ?>
<label>
<input required type="text" name="name" placeholder="Your name">
</label>
<label>
<input required type="email" name="email" placeholder="Your email">
</label>
<label>
<textarea required name="message" rows="4" placeholder="How can we help?"></textarea>
</label>
<button type="submit">Send</button>
</form>
</div>
</div>
<script>
(function(){
var wrap=document.getElementById('<?php echo esc_js($uid); ?>');
if(!wrap) return;
var toggle=wrap.querySelector('.sfc-toggle'), form=wrap.querySelector('.sfc-form');
toggle.addEventListener('click', function(e){
e.preventDefault();
var show = form.style.display !== 'block';
form.style.display = show ? 'block' : 'none';
toggle.textContent = show ? 'Hide Form' : 'Message Us';
toggle.setAttribute('aria-expanded', show ? 'true' : 'false');
}, {passive:true});
})();
</script>
</div>
Add a simple handler in functions.php to receive the form:
add_action('admin_post_nopriv_sf_contact','sf_handle_contact');
add_action('admin_post_sf_contact','sf_handle_contact');
function sf_handle_contact(){
if( ! isset($_POST['sf_contact_nonce_field']) || ! wp_verify_nonce($_POST['sf_contact_nonce_field'],'sf_contact_nonce') ){
wp_die('Security check failed.');
}
$name = sanitize_text_field($_POST['name'] ?? '');
$email = sanitize_email($_POST['email'] ?? '');
$msg = wp_kses_post($_POST['message'] ?? '');
// Send email or store (swap to your address)
wp_mail(get_option('admin_email'), "SolveForce contact from {$name}", "Email: {$email}\n\n{$msg}");
wp_safe_redirect( wp_get_referer() ?: home_url('/') );
exit;
}
4) Services Quicklist — template-parts/solveforce-services.php
<?php
/**
* Template Part: SolveForce Services Quicklist — No-JS Card Grid + Toggle for Details
* Usage: get_template_part('template-parts/solveforce-services');
*/
$uid = 'sfs_' . wp_generate_uuid4();
$groups = [
['t' => 'Connectivity', 'items' => ['Fiber Internet','Dedicated Internet Access','SD-WAN','MPLS']],
['t' => 'Cloud', 'items' => ['IaaS','DRaaS','Backup-as-a-Service','Object Storage']],
['t' => 'Security', 'items' => ['SASE','ZTNA','Managed Firewall','SOC-as-a-Service']],
['t' => 'Voice', 'items' => ['UCaaS','CCaaS','SIP Trunks','Hosted PBX']],
];
?>
<div id="<?php echo esc_attr($uid); ?>" class="sfs-wrap">
<style>
#<?php echo $uid; ?> .sfs-card{border:1px solid #e9ecef;border-radius:14px;padding:18px;max-width:960px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.04)}
#<?php echo $uid; ?> .sfs-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
#<?php echo $uid; ?> .sfs-title{font-weight:800;font-size:1.1rem}
#<?php echo $uid; ?> .sfs-btn{border:1px solid #ced4da;border-radius:999px;padding:.45rem .95rem;font-weight:600;font-size:.95rem;text-decoration:none}
#<?php echo $uid; ?> .sfs-grid{margin-top:12px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
#<?php echo $uid; ?> .sfs-col{border:1px solid #f0f0f0;border-radius:12px;padding:12px}
#<?php echo $uid; ?> .sfs-col h4{margin:0 0 6px;font-size:1rem}
#<?php echo $uid; ?> .sfs-col ul{margin:0;padding-left:18px}
#<?php echo $uid; ?> .sfs-col li{margin:.25rem 0}
#<?php echo $uid; ?> .sfs-details{display:none;margin-top:10px;opacity:.9}
</style>
<div class="sfs-card" aria-label="SolveForce Services Quicklist">
<div class="sfs-head">
<div class="sfs-title">SolveForce Services</div>
<a class="sfs-btn sfs-toggle" role="button" aria-expanded="false">Show Details</a>
</div>
<div class="sfs-grid">
<?php foreach ($groups as $g): ?>
<div class="sfs-col">
<h4><?php echo esc_html($g['t']); ?></h4>
<ul>
<?php foreach ($g['items'] as $it): ?>
<li><?php echo esc_html($it); ?></li>
<?php endforeach; ?>
</ul>
</div>
<?php endforeach; ?>
</div>
<div class="sfs-details" aria-hidden="true">
We design, source, and support carrier‑grade connectivity, secure cloud architectures, and modern voice solutions across the U.S. Ask us for curated quotes from multiple providers.
</div>
</div>
<script>
(function(){
var wrap=document.getElementById('<?php echo esc_js($uid); ?>');
if(!wrap) return;
var toggle=wrap.querySelector('.sfs-toggle'), details=wrap.querySelector('.sfs-details');
toggle.addEventListener('click', function(e){
e.preventDefault();
var show = details.style.display !== 'block';
details.style.display = show ? 'block' : 'none';
toggle.textContent = show ? 'Hide Details' : 'Show Details';
toggle.setAttribute('aria-expanded', show ? 'true' : 'false');
details.setAttribute('aria-hidden', show ? 'false' : 'true');
}, {passive:true});
})();
</script>
</div>
Optional: one‑click Block Patterns for each
Register quick patterns in functions.php so editors can insert them from the block inserter immediately:
add_action('init', function () {
if ( ! function_exists('register_block_pattern') ) return;
$patterns = [
['slug'=>'solveforce-on-linkedin','title'=>'SolveForce on LinkedIn','part'=>'solveforce-on-linkedin'],
['slug'=>'solveforce-on-youtube','title'=>'SolveForce on YouTube','part'=>'solveforce-on-youtube'],
['slug'=>'solveforce-contact-card','title'=>'SolveForce Contact Card','part'=>'solveforce-contact-card'],
['slug'=>'solveforce-services','title'=>'SolveForce Services Quicklist','part'=>'solveforce-services'],
];
foreach ($patterns as $p) {
register_block_pattern(
'solveforce/' . $p['slug'],
[
'title' => __($p['title'], 'solveforce'),
'description' => __('Drop-in partial with a compact card and an optional toggle.', 'solveforce'),
'categories' => ['widgets','embed'],
'content' => sprintf(
'<!-- wp:template-part {"slug":"%s"} /-->',
esc_attr($p['part'])
),
]
);
}
});
If you prefer shortcodes, I can package these as
[solveforce_linkedin],[solveforce_youtube],[solveforce_contact], and[solveforce_services]instead—same output, just different insertion method.
If you’d like, I can also add a shared style token so all cards inherit identical spacing/typography from one CSS block (keeps pages lean when you use multiple cards).
Template Part: SolveForce on LinkedIn — Compact Card + Embed Toggle – SolveForce Communications
Template Part: SolveForce on X — Compact Card + Timeline Toggle – SolveForce Communications
Nice—thanks for the dump. I wired this into two “one-click” options: – SolveForce Communications
Plugin Name: SolveForce on X — Profile Card + Embed Toggle – SolveForce Communications
Geometric & Shape Symbols Codex – SolveForce Communications
LogOS Structural Symbol Codex 1 – SolveForce Communications
Key terms in plain language
Open a term for a concise explanation of language used on this page.
Fiber Internet
Internet delivered through strands of glass using light. Fiber commonly supports high capacity, low latency, and strong upload performance, but availability must be confirmed for the exact address.
Dedicated Internet Access (DIA)
A business-grade Internet connection with capacity dedicated to the customer rather than shared in the same way as typical consumer broadband. It often includes symmetrical speeds and an SLA.
SD-WAN
Software-defined wide area networking. It manages multiple connections and chooses paths based on application needs, performance, and policy to improve resilience and control.
MPLS
Multiprotocol Label Switching, a private-network technology that directs traffic along managed paths. Organizations use it for predictable connectivity between locations.
Unified Communications (UCaaS)
A cloud-based combination of business calling, messaging, meetings, presence, and collaboration tools managed as one communications service.
SIP Trunking
A service that connects a business phone system to the public telephone network using Internet Protocol, replacing or supplementing traditional phone lines.
Infrastructure as a Service (IaaS)
Cloud-based servers, storage, and networking that customers configure and manage without owning the underlying data-center hardware.
Disaster Recovery (DRaaS)
A plan and service for restoring applications, data, and operations after an outage or disruption. DRaaS provides recovery infrastructure through a managed cloud service.