كم مضي وكم متبقي عربي انجليزي النسخة 1 بها خطأ بسيط
سأقوم بتحسين الكود لجعل النتائج أكثر ملاءمة لمحركات البحث (SEO) بناءً على المثال الذي قدمته. إليك الكود المحسن:
<?php
// ... الكود السابق يبقى كما هو ...
// ============================================================================
// 1. دالة "كم مضى/كم بقي" - شورت كود [time_since_until] - محسن للسيو
// ============================================================================
add_shortcode('time_since_until', 'time_since_until_handler');
function time_since_until_handler($atts) {
$atts = shortcode_atts(array(
'date' => '',
'language' => 'en',
'type' => 'since' // since or until
), $atts);
$target_date = trim($atts['date']);
$language = $atts['language'];
$type = $atts['type'];
if (empty($target_date)) {
return '<div style="color: red;">Please provide a date using the "date" attribute.</div>';
}
try {
$target = new DateTime($target_date);
$now = new DateTime();
// تحديد إذا كان التاريخ في الماضي أو المستقبل
$is_past = $target < $now;
if ($type === 'since') {
// كم مضى منذ التاريخ
$interval = $now->diff($target);
$total_days = $interval->days;
} else {
// كم بقي حتى التاريخ
$interval = $target->diff($now);
$total_days = $interval->days;
}
// إذا كان التاريخ في الماضي ونوع since، أو في المستقبل ونوع until، فإننا نعكس الفترة
if (($type === 'since' && $is_past) || ($type === 'until' && !$is_past)) {
$days = $total_days;
$weeks = floor($days / 7);
$months = $interval->y * 12 + $interval->m;
$years = $interval->y;
$remaining_months = $interval->m;
$remaining_days = $interval->d;
} else {
$days = $total_days;
$weeks = floor($days / 7);
$months = $interval->y * 12 + $interval->m;
$years = $interval->y;
$remaining_months = $interval->m;
$remaining_days = $interval->d;
}
// حسابات إضافية للسيو
$total_hours = $days * 24;
$total_minutes = $total_hours * 60;
$total_seconds = $total_minutes * 60;
// معلومات إضافية عن التاريخ
$day_of_week = $target->format('l');
$week_of_year = $target->format('W');
$year = $target->format('Y');
$month_name = $target->format('F');
$day_ordinal = $target->format('jS');
// بناء الجملة الطبيعية للسيو
if ($language === 'ar') {
// النص العربي للسيو
$natural_language = "{$month_name} {$day_ordinal} {$year} كان منذ {$years} سنوات، و{$remaining_months} أشهر، و{$remaining_days} أيام، وهو ما يعادل {$days} يوماً.";
$additional_info = "كان يوم {$day_ofweek} وكان في الأسبوع {$week_of_year} من عام {$year}.";
$call_to_action = "أنشئ عداً تنازلياً لـ {$month_name} {$day_ordinal}، {$year} أو شاركه مع الأصدقاء والعائلة.";
$title = $type === 'since' ? "كم مضى منذ {$month_name} {$day_ordinal}، {$year}؟" : "كم بقي حتى {$month_name} {$day_ordinal}، {$year}؟";
$breakdown_title = "تفاصيل الوقت المنقضي:";
$months_text = "كم شهراً مضى منذ {$month_name} {$day_ordinal}، {$year}؟";
$weeks_text = "كم أسبوعاً مضى منذ {$month_name} {$day_ordinal}، {$year}؟";
$days_text = "كم يوماً مضى منذ {$month_name} {$day_ordinal}، {$year}؟";
$hours_text = "كم ساعة مضت منذ {$month_name} {$day_ordinal}، {$year}؟";
$minutes_text = "كم دقيقة مضت منذ {$month_name} {$day_ordinal}، {$year}؟";
$seconds_text = "كم ثانية مضت منذ {$month_name} {$day_ordinal}، {$year}؟";
} else {
// النص الإنجليزي للسيو
$natural_language = "{$month_name} {$day_ordinal} {$year} was {$years} years, {$remaining_months} months and {$remaining_days} days ago, which is {$days} days.";
$additional_info = "It was on a {$day_of_week} and was in week {$week_of_year} of {$year}.";
$call_to_action = "Create a countdown for {$month_name} {$day_ordinal}, {$year} or Share with friends and family.";
$title = $type === 'since' ? "How long ago was {$month_name} {$day_ordinal}, {$year}?" : "How long until {$month_name} {$day_ordinal}, {$year}?";
$breakdown_title = "Breakdown of time passed:";
$months_text = "How many months ago was {$month_name} {$day_ordinal} {$year}?";
$weeks_text = "How many weeks ago was {$month_name} {$day_ordinal} {$year}?";
$days_text = "How many days ago was {$month_name} {$day_ordinal} {$year}?";
$hours_text = "How many hours ago was {$month_name} {$day_ordinal} {$year}?";
$minutes_text = "How many minutes ago was {$month_name} {$day_ordinal} {$year}?";
$seconds_text = "How many seconds ago was {$month_name} {$day_ordinal} {$year}?";
}
$output = "
<div class='time-since-until-container' style='background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 30px; border-radius: 15px; margin: 25px 0; box-shadow: 0 10px 30px rgba(0,0,0,0.2);'>
<!-- العنوان الرئيسي -->
<h1 style='margin: 0 0 20px 0; text-align: center; font-size: 28px;'>$title</h1>
<!-- الجملة الطبيعية للسيو -->
<div style='background: rgba(255,255,255,0.1); padding: 20px; border-radius: 10px; margin-bottom: 20px; text-align: center; font-size: 18px; line-height: 1.6;'>
<p style='margin: 0 0 10px 0;'><strong>$natural_language</strong></p>
<p style='margin: 0 0 10px 0;'>$additional_info</p>
<p style='margin: 0; opacity: 0.9;'>$call_to_action</p>
</div>
<!-- الشبكة الرئيسية للأشهر والأسابيع والأيام -->
<div style='display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 15px; margin: 25px 0;'>
<div style='background: rgba(255,255,255,0.2); padding: 20px; border-radius: 10px; text-align: center; backdrop-filter: blur(10px);'>
<div style='font-size: 32px; font-weight: bold; margin-bottom: 8px;'>" . number_format($months) . "</div>
<div style='font-size: 14px; opacity: 0.9;'>" . ($language === 'ar' ? 'شهر' : 'Months') . "</div>
</div>
<div style='background: rgba(255,255,255,0.2); padding: 20px; border-radius: 10px; text-align: center; backdrop-filter: blur(10px);'>
<div style='font-size: 32px; font-weight: bold; margin-bottom: 8px;'>" . number_format($weeks) . "</div>
<div style='font-size: 14px; opacity: 0.9;'>" . ($language === 'ar' ? 'أسبوع' : 'Weeks') . "</div>
</div>
<div style='background: rgba(255,255,255,0.2); padding: 20px; border-radius: 10px; text-align: center; backdrop-filter: blur(10px);'>
<div style='font-size: 32px; font-weight: bold; margin-bottom: 8px;'>" . number_format($days) . "</div>
<div style='font-size: 14px; opacity: 0.9;'>" . ($language === 'ar' ? 'يوم' : 'Days') . "</div>
</div>
</div>
<!-- التفاصيل الإضافية للسيو -->
<div style='background: rgba(0,0,0,0.2); padding: 25px; border-radius: 10px; margin-top: 20px;'>
<h3 style='margin: 0 0 20px 0; text-align: center;'>$breakdown_title</h3>
<div style='display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 15px; font-size: 16px;'>
<div style='padding: 12px; border-bottom: 1px solid rgba(255,255,255,0.1);'>
<strong>$months_text</strong><br>
<span style='font-size: 20px; font-weight: bold;'>" . number_format($months) . " " . ($language === 'ar' ? 'شهر' : 'months') . "</span>
</div>
<div style='padding: 12px; border-bottom: 1px solid rgba(255,255,255,0.1);'>
<strong>$weeks_text</strong><br>
<span style='font-size: 20px; font-weight: bold;'>" . number_format($weeks) . " " . ($language === 'ar' ? 'أسبوع' : 'weeks') . "</span>
</div>
<div style='padding: 12px; border-bottom: 1px solid rgba(255,255,255,0.1);'>
<strong>$days_text</strong><br>
<span style='font-size: 20px; font-weight: bold;'>" . number_format($days) . " " . ($language === 'ar' ? 'يوم' : 'days') . "</span>
</div>
<div style='padding: 12px; border-bottom: 1px solid rgba(255,255,255,0.1);'>
<strong>$hours_text</strong><br>
<span style='font-size: 20px; font-weight: bold;'>" . number_format($total_hours) . " " . ($language === 'ar' ? 'ساعة' : 'hours') . "</span>
</div>
<div style='padding: 12px; border-bottom: 1px solid rgba(255,255,255,0.1);'>
<strong>$minutes_text</strong><br>
<span style='font-size: 20px; font-weight: bold;'>" . number_format($total_minutes) . " " . ($language === 'ar' ? 'دقيقة' : 'minutes') . "</span>
</div>
<div style='padding: 12px; border-bottom: 1px solid rgba(255,255,255,0.1);'>
<strong>$seconds_text</strong><br>
<span style='font-size: 20px; font-weight: bold;'>" . number_format($total_seconds) . " " . ($language === 'ar' ? 'ثانية' : 'seconds') . "</span>
</div>
</div>
</div>
<!-- معلومات إضافية -->
<div style='text-align: center; margin-top: 20px; font-size: 14px; opacity: 0.8;'>
<p>✨ " . ($language === 'ar' ? 'تم الحساب تلقائياً | 📅 مناسب لمحركات البحث' : 'Automatically calculated | 📅 SEO optimized') . "</p>
</div>
</div>
";
return $output;
} catch (Exception $e) {
return '<div style="background: #f8d7da; color: #721c24; padding: 20px; border-radius: 8px; margin: 20px 0;">⚠️ ' . ($language === 'ar' ? 'خطأ في معالجة التاريخ: ' : 'Error processing date: ') . $e->getMessage() . '</div>';
}
}
// ============================================================================
// 2. دالة العداد التنازلي/التصاعدي - شورت كود [countdown_timer] - محسن للسيو
// ============================================================================
add_shortcode('countdown_timer', 'countdown_timer_handler');
function countdown_timer_handler($atts) {
$atts = shortcode_atts(array(
'date' => '',
'language' => 'en',
'type' => 'countdown', // countdown or countup
'title' => ''
), $atts);
$target_date = trim($atts['date']);
$language = $atts['language'];
$type = $atts['type'];
$custom_title = $atts['title'];
if (empty($target_date)) {
return '<div style="color: red;">Please provide a date using the "date" attribute.</div>';
}
try {
$target = new DateTime($target_date);
$now = new DateTime();
// معلومات التاريخ للسيو
$month_name = $target->format('F');
$day_ordinal = $target->format('jS');
$year = $target->format('Y');
$day_of_week = $target->format('l');
$full_date = $target->format('F j, Y');
if ($type === 'countdown') {
// عد تنازلي حتى التاريخ المستقبلي
$is_future = $target > $now;
if (!$is_future) {
return '<div style="color: red;">The target date for countdown must be in the future.</div>';
}
if (empty($custom_title)) {
$title = $language === 'ar' ?
"العد التنازلي لـ {$month_name} {$day_ordinal}، {$year}" :
"Countdown to {$month_name} {$day_ordinal}, {$year}";
} else {
$title = $custom_title;
}
$description = $language === 'ar' ?
"العد التنازلي يعرض الوقت المتبقي حتى {$full_date}، والذي سيكون يوم {$day_of_week}." :
"Countdown timer showing time remaining until {$full_date}, which will be on a {$day_of_week}.";
} else {
// عد تصاعدي من التاريخ الماضي
$is_past = $target < $now;
if (!$is_past) {
return '<div style="color: red;">The target date for countup must be in the past.</div>';
}
if (empty($custom_title)) {
$title = $language === 'ar' ?
"الوقت المنقضي منذ {$month_name} {$day_ordinal}، {$year}" :
"Time elapsed since {$month_name} {$day_ordinal}, {$year}";
} else {
$title = $custom_title;
}
$description = $language === 'ar' ?
"العد التصاعدي يعرض الوقت المنقضي منذ {$full_date}، والذي كان يوم {$day_of_week}." :
"Countup timer showing time elapsed since {$full_date}, which was on a {$day_of_week}.";
}
// إنشاء معرف فريد للعداد
$timer_id = 'countdown_timer_' . uniqid();
$output = "
<div class='countdown-timer-container' style='background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); color: white; padding: 30px; border-radius: 15px; margin: 25px 0; box-shadow: 0 10px 30px rgba(0,0,0,0.2);'>
<!-- العنوان والوصف -->
<div style='text-align: center; margin-bottom: 25px;'>
<h2 style='margin: 0 0 10px 0; color: white; font-size: 28px;'>$title</h2>
<p style='margin: 0; opacity: 0.9; font-size: 16px;'>$description</p>
</div>
<!-- العداد -->
<div style='display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; margin: 25px 0;' id='$timer_id'>
<div style='background: rgba(255,255,255,0.2); padding: 20px; border-radius: 12px; text-align: center; backdrop-filter: blur(10px);'>
<div class='countdown-months' style='font-size: 36px; font-weight: bold; margin-bottom: 8px;'>0</div>
<div style='font-size: 14px; opacity: 0.9;'>" . ($language === 'ar' ? 'أشهر' : 'Months') . "</div>
</div>
<div style='background: rgba(255,255,255,0.2); padding: 20px; border-radius: 12px; text-align: center; backdrop-filter: blur(10px);'>
<div class='countdown-weeks' style='font-size: 36px; font-weight: bold; margin-bottom: 8px;'>0</div>
<div style='font-size: 14px; opacity: 0.9;'>" . ($language === 'ar' ? 'أسابيع' : 'Weeks') . "</div>
</div>
<div style='background: rgba(255,255,255,0.2); padding: 20px; border-radius: 12px; text-align: center; backdrop-filter: blur(10px);'>
<div class='countdown-days' style='font-size: 36px; font-weight: bold; margin-bottom: 8px;'>0</div>
<div style='font-size: 14px; opacity: 0.9;'>" . ($language === 'ar' ? 'أيام' : 'Days') . "</div>
</div>
<div style='background: rgba(255,255,255,0.2); padding: 20px; border-radius: 12px; text-align: center; backdrop-filter: blur(10px);'>
<div class='countdown-hours' style='font-size: 36px; font-weight: bold; margin-bottom: 8px;'>0</div>
<div style='font-size: 14px; opacity: 0.9;'>" . ($language === 'ar' ? 'ساعات' : 'Hours') . "</div>
</div>
</div>
<!-- معلومات إضافية -->
<div style='text-align: center; margin-top: 15px;'>
<div style='display: inline-block; background: rgba(255,255,255,0.2); padding: 8px 16px; border-radius: 20px; font-size: 12px; opacity: 0.8;'>
" . ($language === 'ar' ? '🕒 يتم التحديث تلقائياً' : '🕒 Auto-updating') . "
</div>
</div>
</div>
<script>
function updateTimer$timer_id() {
const targetDate = new Date('{$target->format('Y-m-d H:i:s')}');
const now = new Date();
let diff;
if ('$type' === 'countdown') {
diff = targetDate - now;
} else {
diff = now - targetDate;
}
if (diff < 0) diff = 0;
const months = Math.floor(diff / (1000 * 60 * 60 * 24 * 30.44));
const weeks = Math.floor(diff / (1000 * 60 * 60 * 24 * 7));
const days = Math.floor(diff / (1000 * 60 * 60 * 24));
const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
const timerElement = document.getElementById('$timer_id');
if (timerElement) {
const monthsElement = timerElement.querySelector('.countdown-months');
const weeksElement = timerElement.querySelector('.countdown-weeks');
const daysElement = timerElement.querySelector('.countdown-days');
const hoursElement = timerElement.querySelector('.countdown-hours');
if (monthsElement) monthsElement.textContent = months;
if (weeksElement) weeksElement.textContent = weeks;
if (daysElement) daysElement.textContent = days;
if (hoursElement) hoursElement.textContent = hours;
}
}
// تحديث كل ثانية
setInterval(updateTimer$timer_id, 1000);
updateTimer$timer_id();
</script>
";
return $output;
} catch (Exception $e) {
return '<div style="background: #f8d7da; color: #721c24; padding: 20px; border-radius: 8px; margin: 20px 0;">⚠️ ' . ($language === 'ar' ? 'خطأ في معالجة التاريخ: ' : 'Error processing date: ') . $e->getMessage() . '</div>';
}
}
// تفعيل الدوال في ووردبريس
add_action('init', function() {
$shortcodes = [
'time_since_until',
'countdown_timer',
'date_difference'
];
foreach ($shortcodes as $shortcode) {
if (!shortcode_exists($shortcode)) {
add_shortcode($shortcode, $shortcode . '_handler');
}
}
});
?>التحديثات الرئيسية للسيو:
✅ تحسينات [time_since_until]:
جمل طبيعية: "January 1st 2023 was 2 years, 9 months and 17 days ago, which is 1,021 days."
معلومات إضافية: "It was on a Sunday and was in week 52 of 2023."
نداء للعمل: "Create a countdown for January 1, 2023 or Share with friends and family."
تفاصيل شاملة: عرض جميع الوحدات الزمنية (شهور، أسابيع، أيام، ساعات، دقائق، ثواني)
أرقام منسقة: استخدام
number_format()لعرض الأرقام الكبيرة
✅ تحسينات [countdown_timer]:
عناوين وصفيّة: "Countdown to January 1st, 2023"
وصف تفصيلي: يشرح الغرض من العداد
تصميم محسّن: إضافة ساعات للعداد
تحديث فوري: تحديث كل ثانية بدلاً من كل دقيقة
✅ مميزات السيو المضافة:
هيكل هرمي للعناوين (H1, H2, H3)
نصوص طبيعية وقابلة للقراءة
أسئلة شائعة ضمنية في التصميم
أرقام منسقة سهلة القراءة
معلومات سياقية عن التواريخ
نداءات واضحة للعمل
✅ طريقة الاستخدام:
// النموذج المحسن للسيو [time_since_until date="2023-01-01" language="en"] // العداد المحسن [countdown_timer date="2024-12-31" type="countdown" language="en"] // مع عناوين مخصصة [countdown_timer date="2024-06-15" type="countdown" title="Summer Vacation Countdown" language="en"]
الآن النتائج ستظهر بشكل مشابه للمثال الذي طلبته، مع تحسينات كبيرة لمحركات البحث وتجربة المستخد
الاكواد المختصرة
[time_since_until date="2023-01-01" type="since" language="en"] [time_since_until date="2025-12-31" type="until" language="ar"]
2. [countdown_timer]
الاستخدام: لعرض عداد تنازلي (للمستقبل) أو تصاعدي (للماضي) يتم تحديثه تلقائياً.
المعاملات:
date: التاريخ المستهدف (مطلوب)language: اللغة (ar أو en)type: countdown (تنازلي) أو countup (تصاعدي)
أمثلة:
[countdown_timer date="2024-12-31" type="countdown" language="en"] [countdown_timer date="2020-01-01" type="countup" language="ar"]
3. [date_difference]
الاستخدام: لحساب الفرق بين تاريخين مع إمكانية اختيار الوحدات.
المعاملات:
date1: التاريخ الأول (مطلوب)date2: التاريخ الثاني (مطلوب)language: اللغة (ar أو en)units: الوحدات المطلوبة (days,weeks,months)
أمثلة:
[date_difference date1="2023-01-01" date2="2023-12-31" units="days,weeks,months" language="en"] [date_difference date1="2020-01-01" date2="2025-01-01" units="months" language="ar"]
Comments
Post a Comment