هاستینجا |هاست لینوکس-هاست وردپرس-هاست پایتون-سرور-ثبت دامنه

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

نوشته شده در 2017/06/25

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

ابتدا برای شروع افزونه زیر را دانلود کرده ونصب و فعال کنید.

Advanced Custom Fields

حال تصاویر زیر را در 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>

<?php

if ( get_field('imdbname') ) {

echo '

اطلاعات کامل در <a href="' . get_field('imdblink') . '">' . get_field('imdbname') . '</a>

</li>';

}

if ( get_field('genre') ) {

echo '<li class="info">

ژانر: ' . get_field('genre') . '

</li>';

}

if ( get_field('quality') ) {

echo '<li class="info">

کیفیت: ' . get_field('quality') . '

</li>';

}

if ( get_field('rating') ) {

echo '<li class="info">

امتیاز: ' . get_field('rating') . '

</li>';

}

if ( get_field('format') ) {

echo '<li class="info">

فرمت: ' . get_field('format') . '

</li>';

}

if ( get_field('size') ) {

echo '<li class="info">

حجم: ' . get_field('size') . '

</li>';

}

if ( get_field('product') ) {

echo '<li class="info">

محصول: ' . get_field('product') . '

</li>';

}

if ( get_field('lang') ) {

echo '<li class="info">

زبان: ' . get_field('lang') . '

</li>';

}

if ( get_field('director') ) {

echo '<li class="info">

کارگردان: ' . get_field('director') . '

</li>';

}

if ( get_field('actors') ) {

echo '<li class="info">

بازیگران: ' . get_field('actors') . '

</li>';

}

if ( get_field('subtitle') ) {

echo '<li class="info">

زیرنویس فارسی: ' . get_field('subtitle') . '

</li>';

}

if ( get_field('synopsis') ) {

echo '<li class="info">

خلاصه داستان: ' . get_field('synopsis') . '

</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;
}

.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;

}