AOSSIE-Org / AOSSIE-Org/SocialShareButton

Enhancement: Add Server-Rendered Framework Integration (Rails / Django / Laravel) — demo page section and CDN usage guide

Đang mở
#53 2 bình luận 0 reaction 1 người được giao Được @Abhinandankaushik nhận Xem trên GitHub
planned
Ngôn ngữ chính
TypeScript
Star
25
Fork
65
Merge trung bình
2 ngày 11 giờ
Pull request đã merge (30 ngày)
1

Mô tả

## 🎯 Direction

SocialShareButton is a **lightweight, zero-dependency, framework-agnostic** social sharing component. Ruby on Rails, Django, and Laravel are the three most popular server-rendered web frameworks — they generate HTML on the server and send it to the browser, making CDN-based widget integration the standard approach. This issue adds a single combined demo section covering all three, since the integration pattern is near-identical across them.

📹 **See the button in action**: https://youtu.be/cLJaT-8rEvQ?si=CLipA0Db4WL0EqKM

---

## 📁 Files to Create / Modify

### ℹ️ No New Wrapper File Needed

Integration is done by placing CDN `` and `` tags in the server-rendered base layout template of each framework. No JavaScript wrapper is required.

---

### ✅ Existing File: `index.html` — Add Server-Rendered Frameworks Section

Add a new section with:
- Section heading: `🖥️ Server-Rendered Frameworks (Rails / Django / Laravel)`
- A brief note that the pattern is the same across all three — include CSS in `<head>`, JS before `</body>`, initialize with a script

**Ruby on Rails** (`app/views/layouts/application.html.erb`):

```erb
<%# In <head> %>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/social-share-button/dist/social-share-button.css">

<%# Before </body> %>
<script src="https://cdn.jsdelivr.net/npm/social-share-button/dist/social-share-button.js">

new SocialShareButton({
container: '#share-button',
url: window.location.href,
title: document.title,
theme: 'dark',
buttonText: 'Share'
});

```

**Django** (`templates/base.html`):

```html
{# In #}

{# Before #}

new SocialShareButton({
container: '#share-button',
url: window.location.href,
title: document.title,
theme: 'dark',
buttonText: 'Share'
});

```

**Laravel** (`resources/views/layouts/app.blade.php`):

```blade
{{-- In --}}

{{-- Before --}}

new SocialShareButton({
container: '#share-button',
url: window.location.href,
title: document.title,
theme: 'dark',
buttonText: 'Share'
});

```

---

## ✅ Acceptance Criteria

- [ ] No new wrapper file required — integration is template/CDN only
- [ ] `index.html` updated with a server-rendered frameworks section containing separate code snippets for Rails, Django, and Laravel
- [ ] Copy-to-clipboard button present on new code blocks in `index.html`
- [ ] README updated to mention Rails, Django, and Laravel as supported integration patterns

---

> ⚠️ **Planned — Not Final**
> This issue represents a planned enhancement and is **not guaranteed to be implemented**. It may be dropped if it does not align with the repository's direction. **Before opening a pull request, please discuss with the maintainers in this issue thread.**

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.