MokoConsulting/MokoOnyx
1
0
Fork 0
Code Issues 10 Pull Requests Releases 2 Wiki Activity

feat: native social media icons (replaces mod_rssocial dependency) #129

New Issue
Closed
opened 2026-06-18 14:55:04 +00:00 by jmiller · 1 comment
jmiller commented 2026-06-18 14:55:04 +00:00
Owner
Copy Link
Copy Source

Summary

Build social media icon functionality directly into the MokoOnyx template, eliminating the need for the third-party mod_rssocial module. This makes social links a first-class template feature configurable via template parameters.

Motivation

  • Remove dependency on third-party mod_rssocial module
  • Leverage Font Awesome 7 brand icons already bundled with MokoOnyx
  • Provide admin-friendly configuration via template parameters (no module setup needed)
  • Consistent styling with the rest of the template design system

Platforms to Support

All 22 platforms from mod_rssocial:
Bluesky, Discord, Email, Facebook, Flickr, GitHub, Instagram, LinkedIn, Linktree, Pinterest, Reddit, Snapchat, SoundCloud, Spotify, Telegram, Threads, TikTok, Tumblr, Twitch, Vimeo, WhatsApp, X/Twitter, YouTube

Scope

Template Parameters (templateDetails.xml)

  • New Social fieldset/tab
  • Master enable/disable toggle
  • Display position selector (footer, topbar, floating)
  • Icon style (plain / circle-bg / rounded-bg)
  • Icon size (small / medium / large)
  • Per-platform URL fields (leave blank = hidden)
  • Link target (_blank / _self)
  • Optional: icon color override, hover effect

Layout and Rendering

  • PHP partial in src/html/layouts/mokoonyx/social-icons.php
  • Rendered in index.php based on position param
  • Uses Font Awesome 7 brand icon classes (no custom icon font needed)
  • Accessible: aria-label per link, rel noopener noreferrer on external links

Styling

  • CSS in template.css using existing CSS custom properties
  • Dark/light theme aware via data-bs-theme selectors
  • CSS variables: --social-icon-size, --social-icon-gap, --social-icon-color, --social-icon-hover-color, --social-icon-bg, --social-icon-radius

Language Strings

  • Admin labels/descriptions in tpl_mokoonyx.ini
  • Accessible link labels (e.g., Follow us on Facebook)

Out of Scope (for now)

  • Share-current-page buttons (sharing mode from mod_rssocial)
  • Popup/collapse behavior
  • Per-icon individual color overrides
  • Social sharing counters

Files to Create/Modify

  • src/templateDetails.xml - new Social fieldset
  • src/index.php - render social icons partial
  • src/html/layouts/mokoonyx/social-icons.php - new layout file
  • src/media/css/template.css - social icon styles
  • src/language/en-GB/tpl_mokoonyx.ini - language strings
  • src/language/en-US/tpl_mokoonyx.ini - language strings

Reference

  • Source module: mod_rssocial (RSJoomla)
  • Font Awesome 7 brand icons: already bundled in src/media/vendor/fa7free/
## Summary Build social media icon functionality directly into the MokoOnyx template, eliminating the need for the third-party mod_rssocial module. This makes social links a first-class template feature configurable via template parameters. ## Motivation - Remove dependency on third-party mod_rssocial module - Leverage Font Awesome 7 brand icons already bundled with MokoOnyx - Provide admin-friendly configuration via template parameters (no module setup needed) - Consistent styling with the rest of the template design system ## Platforms to Support All 22 platforms from mod_rssocial: Bluesky, Discord, Email, Facebook, Flickr, GitHub, Instagram, LinkedIn, Linktree, Pinterest, Reddit, Snapchat, SoundCloud, Spotify, Telegram, Threads, TikTok, Tumblr, Twitch, Vimeo, WhatsApp, X/Twitter, YouTube ## Scope ### Template Parameters (templateDetails.xml) - New Social fieldset/tab - Master enable/disable toggle - Display position selector (footer, topbar, floating) - Icon style (plain / circle-bg / rounded-bg) - Icon size (small / medium / large) - Per-platform URL fields (leave blank = hidden) - Link target (_blank / _self) - Optional: icon color override, hover effect ### Layout and Rendering - PHP partial in src/html/layouts/mokoonyx/social-icons.php - Rendered in index.php based on position param - Uses Font Awesome 7 brand icon classes (no custom icon font needed) - Accessible: aria-label per link, rel noopener noreferrer on external links ### Styling - CSS in template.css using existing CSS custom properties - Dark/light theme aware via data-bs-theme selectors - CSS variables: --social-icon-size, --social-icon-gap, --social-icon-color, --social-icon-hover-color, --social-icon-bg, --social-icon-radius ### Language Strings - Admin labels/descriptions in tpl_mokoonyx.ini - Accessible link labels (e.g., Follow us on Facebook) ## Out of Scope (for now) - Share-current-page buttons (sharing mode from mod_rssocial) - Popup/collapse behavior - Per-icon individual color overrides - Social sharing counters ## Files to Create/Modify - src/templateDetails.xml - new Social fieldset - src/index.php - render social icons partial - src/html/layouts/mokoonyx/social-icons.php - new layout file - src/media/css/template.css - social icon styles - src/language/en-GB/tpl_mokoonyx.ini - language strings - src/language/en-US/tpl_mokoonyx.ini - language strings ## Reference - Source module: mod_rssocial (RSJoomla) - Font Awesome 7 brand icons: already bundled in src/media/vendor/fa7free/
jmiller commented 2026-06-18 14:57:32 +00:00
Author
Owner
Copy Link
Copy Source

Branch created: feature/129-feat-native-social-media-icons-replaces-

git fetch origin
git checkout feature/129-feat-native-social-media-icons-replaces-
Branch created: [`feature/129-feat-native-social-media-icons-replaces-`](https://git.mokoconsulting.tech/MokoConsulting/MokoOnyx/src/branch/feature/129-feat-native-social-media-icons-replaces-) ```bash git fetch origin git checkout feature/129-feat-native-social-media-icons-replaces- ```
Sign in to join this conversation.
Labels
Clear labels
automation
Automated processes or scripts
 breaking-change
Breaking API or functionality change
 build
Build system changes
 ci-cd
CI/CD pipeline changes
 config
Configuration file changes
 css
CSS/styling changes
 dependencies
Dependency updates
 deploy-failure
Automated deploy failure tracking
 docker
Docker configuration changes
 documentation
Documentation changes
 dolibarr
Dolibarr module or extension
 generic
Generic project or library
 good first issue
Good for newcomers
 health-check
Repository health check results
 health: excellent
Health score 90-100
 health: fair
Health score 50-69
 health: good
Health score 70-89
 health: poor
Health score below 50
 help wanted
Extra attention needed
 html
HTML template changes
 javascript
JavaScript code changes
 joomla
Joomla extension or component
 major-release
Major version release
 minor-release
Minor version release
 mokostandards
MokoStandards compliance
 needs-review
Awaiting code review
 patch-release
Patch version release
 php
PHP code changes
 push-failure
File push failure requiring attention
 python
Python code changes
 release-candidate
Release candidate build
 security
Security-related changes
 size/l
Large change (101-300 lines)
 size/m
Medium change (31-100 lines)
 size/s
Small change (11-30 lines)
 size/xl
Extra large change (301-1000 lines)
 size/xs
Extra small change (1-10 lines)
 size/xxl
Extremely large change (1000+ lines)
 standards-drift
Repository drifted from MokoStandards
 standards-update
MokoStandards sync update
 sync-failure
Bulk sync failure requiring attention
 sync-report
Bulk sync run report
 template-validation-failure
Template workflow validation failure
 tests
Test suite changes
 type: bug
Something isn't working
 type: chore
Maintenance tasks
 type: enhancement
Enhancement to existing feature
 type: feature
New feature or request
 type: refactor
Code refactoring
 type: version
Version-related change
 typescript
TypeScript code changes
 version
Version bump or release
 version-drift
Version mismatch detected
 work-in-progress
Work in progress, not ready for merge
No labels
Priority Medium
Type Feature
Milestone
No items
No Milestone
Assignees
Clear assignees
jmiller (Jonathan Miller)
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: MokoConsulting/MokoOnyx#129
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?