PostUrlPreview (پیش‌نمایش لینک)

معرفی

<PostUrlPreview> همان OG card که در Slack، Discord، X می‌بینید را می‌سازد — لینک به یک تب جدید باز می‌شود و رویداد onClick با stopPropagation کارت والد را نمی‌گشاید.

• چه زمانی استفاده کنیم: وقتی post.body.urlPreview تنظیم شده (مثلاً برای پست‌های text با لینک یا media-single با لینک ضمیمه).
• چه زمانی استفاده نکنیم: برای نمایش media اصلی پست — به‌جای آن از <PostMedia> استفاده کنید.

زمین بازی

زمین بازی

بازنشانی

example.com

تحلیل جدید رفتار کاربران در شبکه‌های اجتماعی

این مقاله به بررسی الگوهای رفتاری کاربران فارسی‌زبان در پلتفرم‌های مختلف می‌پردازد.

تنظیمات

ظاهر

compact

محتوا

دارای تصویر

دارای توضیح

کد این نمونه به‌صورت خودکار قابل تولید نیست — برای کد آماده‌ی copy/paste به بخش «استفاده» در بالای صفحه مراجعه کنید.

استفاده

import { PostUrlPreview } from '@parto-system-design/ui'
;<PostUrlPreview
  preview={{
    url: 'https://example.com/article',
    domain: 'example.com',
    title: 'تیتر مقاله',
    description: 'خلاصه‌ی کوتاه ۱-۲ خطی',
    thumbnailUrl: 'https://example.com/og.jpg',
  }}
/>

حالت‌ها

• compact={true} — بدون description، تامبنیل مربعی کوچک‌تر
• compact={false} (پیش‌فرض) — لِی‌اوت کامل با تامبنیل ۴:۳

کامپوننت‌های مرتبط

• برای پست با media اصلی به جای لینک → <PostMedia>
• برای کارت بزرگ مقالات (editorial post) → <PostCard source="press|web">