نحوه ساخت جعبه اطلاعات برای سایت‌های فیلم

در این پست یاد می‌گیرید یک جعبه اطلاعات برای سایت‌های فیلم یا سریال‌های وردپرسی بسازید.

آموزش ساخت جعبه اطلاعات فیلم

ابتدا افزونه advanced custom fields از مخزن وردپرس نصب و فعال کنید.

ویژگی‌های جعبه اطلاعات فیلم:

• اطلاعات فیلم در سایت imdb
• ژانر
• کیفیت
• امتیاز
• فرمت
• حجم
• محصول
• زبان
• کارگردان
• بازیگران
• زیرنویس فارسی
• خلاصه داستان

ابتدا تصاویر زیر را در پوشه images قالب فعال سایتتان قرار دهید.

دانلود تصاویر

حالا قطعه کد زیر را به فایل single.php اضافه نمایید:

<div class="videoinfobox">
<ul class="metabox">
<?php
if ( get_field('imdbname') ) {
echo '
<li class="imdblink">
<p style="padding-right:15px;"><strong>اطلاعات کامل در <a href="' . get_field('imdblink') . '">' . get_field('imdbname') . '</a></strong></p>
</li>';
}
if ( get_field('genre') ) {
echo '<li class="info">
<p>ژانر: <strong>' . get_field('genre') . '</strong></p>
</li>';
}
if ( get_field('quality') ) {
echo '<li class="info">
<p>کیفیت: <strong>' . get_field('quality') . '</strong></p>
</li>';
}
if ( get_field('rating') ) {
echo '<li class="info">
<p>امتیاز: <strong>' . get_field('rating') . '</strong></p>
</li>';
}
if ( get_field('format') ) {
echo '<li class="info">
<p>فرمت: <strong>' . get_field('format') . '</strong></p>
</li>';
}
if ( get_field('size') ) {
echo '<li class="info">
<p>حجم: <strong>' . get_field('size') . '</strong></p>
</li>';
}
if ( get_field('product') ) {
echo '<li class="info">
<p>محصول: <strong>' . get_field('product') . '</strong></p>
</li>';
}
if ( get_field('lang') ) {
echo '<li class="info">
<p>زبان: <strong>' . get_field('lang') . '</strong></p>
</li>';
}
if ( get_field('director') ) {
echo '<li class="info">
<p>کارگردان: <strong>' . get_field('director') . '</strong></p>
</li>';
}
if ( get_field('actors') ) {
echo '<li class="info">
<p>بازیگران: <strong>' . get_field('actors') . '</strong></p>
</li>';
}
if ( get_field('subtitle') ) {
echo '<li class="info">
<p>زیرنویس فارسی: <strong>' . get_field('subtitle') . '</strong></p>
</li>';
}
if ( get_field('synopsis') ) {
echo '<li class="info">
<p>خلاصه داستان:<br> <strong style="font-family: b yekan,comic sans ms; " id="comment" >' . get_field('synopsis') . '</strong></p>
</li>';
}
?>
</ul>
</div>
و قطعه کد زیر را به فایل style.css اضافه نمایید:
.videoinfobox {
width: 460px;
height: auto;
background-repeat: no-repeat;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-moz-transition: all 0.5s ease-out 0s;
margin-top: 0px;
margin-bottom: 0px;
margin-right: auto;
margin-left: auto;
font-size: 14px;
background-color: #bebbbb;
text-decoration: none;
background-position:-20px center;
paddin-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-right: 10px;
padding: 15px;
border: 5px solid #250;
font-family: B Yekan, Comic Sans MS;
}
.metabox {
line-height: 1.2;
font-family: B Yekan, Comic Sans MS;
}
ul.metabox {
list-style-type: none;
font-family: B Yekan, Comic Sans MS;
}
.imdblink {
background: url("images/imdb.png") no-repeat scroll right center rgba(0, 0, 0, 0);
padding-right: 23px;
font-family: B Yekan, Comic Sans MS;
}
.info {
background: url("images/star.png") no-repeat scroll right center rgba(0, 0, 0, 0);
padding-right: 23px;
font-family: B Yekan, Comic Sans MS;
}

در مرحله بعد به صفحه افزونه advanced custom fields بروید، برروی افزودن کلیک نمایید.

حتما مقاله ساخت اسپیدبار یا نمایش موقعیت کنونی کاربران در وردپرس را بخوانید.

نام گروه زمینه را وارد نمایید (برای مثال: جعبه اطلاعات سریال) و تنظیمات زیر را برای افزونه اعمال نمایید:

• روی دکمه ((+ افزودن زمینه)) کلیک کنید:
  برچسب زمینه=نام لینک اطلاعات – نام زمینه=imdbname – مقدار پیش فرض=IMDB
• روی دکمه ((+ افزودن زمینه)) کلیک کنید:
  برچسب زمینه=لینک اطلاعات – نام زمینه=imdblink
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=ژانر – نام زمینه=genre
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=کیفیت – نام زمینه=quality
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=امتیاز – نام زمینه=rating
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=فرمت – نام زمینه=format
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=حجم – نام زمینه=size
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=محصول – نام زمینه=product
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=زبان – نام زمینه=lang
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=کارگردان – نام زمینه=director
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=بازیگران – نام زمینه=actors
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=زیرنویس فارسی – نام زمینه=subtitle
• دکمه ((+ افزودن زمینه)):
  برچسب زمینه=خلاصه داستان – نام زمینه=synopsisو در آخر بر روی دکمه انتشار کلیک نمایید و به بخش افزودن نوشته رفته و اطلاعات را وارد کرده و از جعبه‌ای که ساخته‌اید؛ استفاده نمایید.

باتشکر از این که تا پایان آموزش “نحوه ساخت جعبه اطلاعات  برای سایت‌های فیلم” همراه ما بودید.