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

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

مثل آموزش ساخت جعبه دانلود، برای ساخت جعبه اطلاعات فیلم هم نیاز به نصب افزونه Advanced Custom Fields دارید پس همین الان افزونه رو نصب و فعال کنید.

پیشنهاد می‌کنم این نوشته‌ها رو بخونید تا کار با این افزونه براتون راحت باشه:

Advanced Custom Fields یک پلاگین کامل!

آموزش ساخت جعبه دانلود ساده و پیشرفته (شبیه سایت آسان دانلود)

* ویژگی های این جعبه:

1) اطلاعات فیلم در سایت IMDB

2) ژانر

3) کیفیت

4) امتیاز

5) فرمت

6) حجم

7) محصول (برای مثال ایران)

8) زبان

9) کارگردان

10) بازیگران

11) زیرنویس فارسی

12) خلاصه داستان

1- ابتدا این تصاویر رو به پوشه images قالب وردپرس‌تون اضافه کنید:
دانلود تصاویر از لینک مستقیم – حجم: 2.61 کیلوبایت

2- کدهای زیر رو به فایل 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>

3- کدهای زیر رو هم به فایل 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;
}

4- خب حالا بریم سراغ تنظیمات افزونه:

1) به صفحه تنظیمات افزونه برید و روی ((افزودن)) کلیک کنید.

2) نام گروه زمینه رو وارد کنید. مثلا: جعبه اطلاعات فیلم.

3) اون مطالبی که آدرسشون رو در بالا دادم بخونید تا در اینجا دچار مشکل نشید. تنظیمات زیر رو برای افزونه انجام بدید:

a) روی دکمه ((+ افزودن زمینه)) کلیک کنید:
برچسب زمینه=نام لینک اطلاعات – نام زمینه=imdbname – مقدار پیش فرض=IMDB
b)روی دکمه ((+ افزودن زمینه)) کلیک کنید:
برچسب زمینه=لینک اطلاعات – نام زمینه=imdblink
c) دکمه ((+ افزودن زمینه)):
برچسب زمینه=ژانر – نام زمینه=genre
d) دکمه ((+ افزودن زمینه)):
برچسب زمینه=کیفیت – نام زمینه=quality
e) دکمه ((+ افزودن زمینه)):
برچسب زمینه=امتیاز – نام زمینه=rating
f) دکمه ((+ افزودن زمینه)):
برچسب زمینه=فرمت – نام زمینه=format
g) دکمه ((+ افزودن زمینه)):
برچسب زمینه=حجم – نام زمینه=size
h) دکمه ((+ افزودن زمینه)):
برچسب زمینه=محصول – نام زمینه=product
i) دکمه ((+ افزودن زمینه)):
برچسب زمینه=زبان – نام زمینه=lang
j) دکمه ((+ افزودن زمینه)):
برچسب زمینه=کارگردان – نام زمینه=director
k) دکمه ((+ افزودن زمینه)):
برچسب زمینه=بازیگران – نام زمینه=actors
l) دکمه ((+ افزودن زمینه)):
برچسب زمینه=زیرنویس فارسی – نام زمینه=subtitle
m) دکمه ((+ افزودن زمینه)):
برچسب زمینه=خلاصه داستان – نام زمینه=synopsis

* منتظر مراحل کمتری بودید؟ ببخشید کمتر از این دیگه نمیشد.

دکمه انتشار رو بزنید.

به بخش افزودن نوشته برید و اطلاعات رو وارد کنید و از این جعبه به خوبی استفاده کنید.

شاد و پیروز باشید.