جعبه دانلود سایت پی سی دانلود برای وردپرس

جمعه ۸ مرداد ۱۳۹۵

جعبه دانلود سایت پی سی دانلود برای وردپرسReviewed by جواد نبوی on Jul 29Rating: 5.0

جعبه دانلود سایت پی سی دانلود

همیشه از انعطاف پذیری وردپرس گفته اند و شنیده ایم. شاید بعضی از شما ها ندانید دلیلش چیست. چرا این همه بر منعطف بودن وردپرس تاکید می کنند و به عنوان یکی از مهم ترین ویژگی های آن یاد می کنند. اگر با مطلب امروز ما همراه باشید حتما به دلیلش پی خواهید برد. وردپرس در حالت عادی و به صورت پیشفرض، مانند هسته خامی است که هر چه فکرش را بکنید میتوانید رویش نصب کرده و کاملا آن را اختصاصی کنید. افزونه های بیشمار وردپرس قدرت بینظیری به آن می دهند. اگر یک سایت دانلود دارید، احتمالا وارد کردن لینک های دانلود به صورت عادی درون ویرایشگر متن برایتان کمی سخت و نتیجه اش ناامید کننده است. صرف نظر از ظاهر نه چندان دلچسب آن، انجام این عمل برای هر مطلب کار زمان بری است. به احتمال خیلی زیاد همه شما با سایت پی سی دانلود آشنایی دارید. اگر هم چیزی از این سایت دانلود کرده باشید، مطمئنن با جعبه دانلود زیبای آن برخورد کرده اید. جایی که باکس هایی مثل مشخصات فایل، راهنمای نصب، لینک های دانلود و رمز فایل به شکل زیبایی قرار گرفته. این جعبه های دانلود اتوماتیک هستند.

جعبه دانلود پی سی دانلود برای وردپرس

اگر میخواهید باکس های دانلود اتوماتیک شبیه سایت پی ۳۰ دانلود برای سایت خودتان داشته باشید، در این مقاله چنین چیزی را برایتان آماده کرده ایم. جعبه ای که ما درست کرده ایم با استفاده از قابلیت زمینه های دلخواه وردپرس و به کمک افزونه Advanced Custom Fields ساخته شده است. پس از افزودن آن به سایتتان، قسمتی به ویرایشگر مطلب شما اضافه می شود که میتوانید اطلاعات مربوط به فایل دانلودی و لینک های دانلود را در آن قرار دهید. سپس نتیجه اش را درون سایتتان ببینید.

اضافه کردن جعبه دانلود شبیه سایت پی سی دانلود به وردپرس

برای نصب جعبه دانلود پی سی دانلود به چند چیز نیاز دارید. در این آموزش قدم به قدم با مراحلی که خدمتتان عرض می کنیم پیش بروید تا به نتیجه برسید.

قدم اول: اضافه کردن فایل فونت

ما برای اضافه کردن این جعبه دانلود، باید ابتدا فونت BKoodak را به قالب اضافه کنیم. بدین منظور، فونت BKoodak را از اینجا دانلود کنید.

سپس به فایل منیجر هاستتان بروید و فایل فشرده فونت (که همین الان دانلود کرده اید) را در محل فولدر قالبتان آپلود کنید. توجه کنید که فایل فشرده فونت را درون فولدر قالب فعلی سایتتان آپلود کنید. یعنی به مسیر wp-content » themes بروید و پوشه قالب خودتان را باز کنید و فونت را آپلود کنید.

پس از آپلود فایل فشرده شده فونت، یک بار روی آن کلیک کنید و از منوی بالای صفحه، روی دکمه Extract کلیک کنید. سپس در کادر باز شده، روی دکمه Extract File(s) کلیک کنید.

حال اگر روی دکمه Reload کلیک کنید، میبینید که یک فولدر با نام Download-font به دیگر فولدر های موجود، اضافه شده است.

جعبه دانلود پی سی دانلود برای وردپرس

قدم دوم: اضافه کردن کد های CSS برای استایل دهی به باکس دانلود

برای اینکه شکل و نمای ظاهری این جعبه دانلود را شبیه چیزی که در پی سی دانلود قرار دارد بکنیم، باید یکسری کد CSS به قالب مان اضافه کنیم.

بدین منظور، از منوی سمت راست وردپرس به مسیر نمایش » ویرایشگر بروید. در صفحه باز شده، از قسمت سمت چپ روی گزینه شیوه نامه (style.css) کلیک کنید.

وقتی صفحه ویرایشگر فایل استایل قالب باز شد، کد زیر را به انتهای کد های موجود اضافه کنید:

/*----------------------------download box----------------------------------*/
@font-face {
 font-family: 'BKoodakBold';
 src: url('download-font/BKoodakBold.eot?#') format('eot'), /* IE6–۸ */
 url('download-font/BKoodakBold.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
 url('download-font/BKoodakBold.ttf') format('truetype'); /* Saf3—۵, Chrome4+, FF3.5, Opera 10+ */
}
.download-boxxx h4{
font-size: 20px;
font-family: 'BKoodakBold';
width:100%;
margin:15px 5px 5px 0;
float:right;
}
.download-details{
float:right;
width:96%;
margin:7px 0 5px 0;
background: #F3F1E4;
padding: 6px 15px;
border-bottom: 2px solid #DBD6AE;
position: relative;
color: #6E6831;
border-radius:5px;
}
.download-details h4{
color: #BAB485;
}
.download-details p{
margin: 0;
text-align: justify;
}
.download-help{
float:right;
width:96%;
margin:7px 0 5px 0;
background: #FFFACD;
padding: 6px 15px;
border-bottom: 2px solid #F5E462;
position: relative;
color: #AD7B09;
border-radius:5px;
}
.download-help h4{
color: #B78A23;
}
.download-help p{
margin: 0;
text-align: justify;
}
.download-links{
float:right;
width:96%;
margin:7px 0 5px 0;
background: #E6FFB2;
padding: 6px 15px;
border-bottom: 2px solid #B8EB59;
position: relative;
color: #5CA000;
border-radius:5px;
}
.download-links h4{
color: #8CCD18;
}
.download-links p{
margin:0;
text-align: justify;
float:right;
width: 100%;
}
.download-links img{
margin-bottom:-3px;
}
.download-links a{
color: #09700B;
padding: 3px 4px 4px;
}
.download-links a:hover{
color: #09700B;
padding: 3px 4px 4px;
background: #F9FFEB;
}
.download-pass{
float:right;
width:96%;
margin:7px 0 5px 0;
background: #FFEEEE;
padding: 6px 15px;
border-bottom: 2px solid #FFA2A2;
position: relative;
color: #D82727;
border-radius:5px;
}
.download-pass h4{
color: #F26969;
}
.download-pass p{
margin: 0;
text-align: justify;
float:right;
font-weight:bold;
}

در نهایت روی دکمه ذخیره تغییرات کلیک کنید.

خب، با اینکار استایل دهی به باکس دانلود انجام شد. حال نوبت می رسد به اضافه کردن کد های php به فایل single.php قالب.

قدم سوم: اضافه کردن کد های php به فایل single.php

دوباره از منوی وردپرس به مسیر نمایش » ویرایشگر بروید. از قسمت سمت چپ، روی گزینه single.php کلیک کنید.

اضافه کردن باکس دانلود پی سی دانلود به وردپرس

در صفحه باز شده، یکسری کد می بینید که مربوط به صفحه ادامه مطلب می شود. در بین کد ها بگردید و کد زیر را پیدا کنید:

<?php the_content(); ?>

برای آنکه سریعتر این کد را پیدا کنید میتوانید کلید های ترکیبی Ctrl + F را در صفحه کلید بزنید. سپس عبارت the_content(); را وارد کنید و اینتر را بزنید.

پس از آنکه قطعه کد بالا را پیدا کردید، در زیر آن، کد زیر را وارد کنید:

<div class="download-boxxx">
 <?php if( get_field('download_details') ): ?>
 <div class="download-details">
 <h4>مشخصات </h4>
 <p>
 <?php the_field('download_details'); ?>
 </p>
 </div><!--download-details-->
 <?php endif; ?>
 <?php if( get_field('download_help') ): ?>
 <div class="download-help">
 <h4>راهنمای نصب </h4>
 <p>
 <?php the_field('download_help'); ?>
 </p>
 </div><!--download-help-->
 <?php endif; ?>
 <?php if( get_field('download_links') ): ?>
 <div class="download-links">
 <h4>لینک های دانلود </h4>
 <p>
 <?php the_field('download_links'); ?>
 </p>
 </div><!--download-links-->
 <?php endif; ?>
 <?php if( get_field('download_pass') ): ?>
 <div class="download-pass">
 <h4>رمز فایل </h4>
 <p>
 <?php the_field('download_pass'); ?>
 </p>
 </div><!--download-pass-->
 <?php endif; ?>
 </div><!--download-box-->

بخش دانلود پی سی دانلود برای وردپرس

در نهایت روی دکمه ذخیره تغییرات کلیک کنید.

قدم چهارم: اضافه کردن فرم اطلاعات دانلود به ویرایشگر مطالب وردپرس

حال که همه چیز برای نمایش جعبه های دانلود درون سایت مهیا شده است، باید آخرین مرحله را انجام دهیم. در این مرحله باید بخشی را به صفحه ویرایشگر مطالب اضافه کنیم که بتوانیم اطلاعات مربوط به دانلود فایل را درون آن قرار دهیم. چیز هایی مثل لینک دانلود، مشخصات فایل، راهنمای نصب و … .

باکس دانلود در وردپرس

برای انجام این کار دو راه داریم.

ممکن است بخواهید ما یک کد به شما بدهیم تا به قالب سایتتان اضافه کنید و فرم دریافت اطلاعات دانلود خود به خود ایجاد شود. خب اینکار شدنی است اما مشکلی که دارد این است که نمیتوانید خودتان دست به تغییرات در ساختار این فرم بزنید. اما اگر میخواهید ساختار و ویژگی های فرم دریافت اطلاعات دانلود تان قابل ویرایش و تغییر باشد، باز هم راه حلی وجود دارد. هر دو راه را به شما می گوییم. البته این را هم بگویم که نتیجه هر دو راه یکی است. یعنی دو فرمی که ایجاد می شود هیچ تفاوتی با هم ندارند. تنها تفاوت در این است که فرم اولی را نمیتوانید ویرایش کنید و تنها قادر به پر کردن آن هستید. اما فرم دوم را میتوانید طبق سلیقه خودتان در بیاورید. پیشنهاد ما همان راه حل اول است. چون نیاز به افزونه ندارد و فقط با قرار دادن یک کد درون قالب درست می شود.

راه اول:

به ویرایشگر قالب وردپرس بروید (مسیر نمایش » ویرایشگر). سپس از قسمت سمت چپ صفحه روی گزینه functions.php کلیک کنید.

باکس دانلود وردپرس

در صفحه ای که برای تان باز می شود، کد زیر را به انتهای همه ی کد های موجود اضافه کنید.

<?php
if(function_exists("register_field_group"))
{
 register_field_group(array (
 'id' => 'acf_%d8%ac%d8%b9%d8%a8%d9%87-%d8%af%d8%a7%d9%86%d9%84%d9%88%d8%af',
 'title' => 'جعبه دانلود',
 'fields' => array (
 array (
 'key' => 'field_5799c3dc50152',
 'label' => 'مشخصات فایل',
 'name' => '',
 'type' => 'tab',
 ),
 array (
 'key' => 'field_5799ab67dba61',
 'label' => 'مشخصات',
 'name' => 'download_details',
 'type' => 'wysiwyg',
 'instructions' => 'مشخصات دانلود مثل شرکت سازنده، قیمت، تاریخ انتشار و حجم فایل را در اینجا وارد کنید.',
 'default_value' => 'شرکت سازنده: وب تستر
 حجم فایل: ۰ مگابایت
 تاریخ انتشار: ۲۰۱۶
 منبع: وب تستر
 امتیاز: ۵',
 'toolbar' => 'full',
 'media_upload' => 'yes',
 ),
 array (
 'key' => 'field_5799c28adba62',
 'label' => 'راهنمای نصب',
 'name' => '',
 'type' => 'tab',
 ),
 array (
 'key' => 'field_5799c32250150',
 'label' => 'راهنمای نصب',
 'name' => 'download_help',
 'type' => 'wysiwyg',
 'instructions' => 'در اینجا راهنمایی برای نصب نرم افزار یا فایل دانلودی قرار دهید. سعی کنید توضیحات قدم به قدم و شماره گذاری شده باشد.',
 'default_value' => '1- ابتدا نرم افزار را نصب کنید.
 ۲- سپس فایل کرک را از فولدر ...',
 'toolbar' => 'full',
 'media_upload' => 'yes',
 ),
 array (
 'key' => 'field_5799c5ef50154',
 'label' => 'لینک های دانلود',
 'name' => '',
 'type' => 'tab',
 ),
 array (
 'key' => 'field_5799c39e50151',
 'label' => 'لینک های دانلود',
 'name' => 'download_links',
 'type' => 'wysiwyg',
 'instructions' => 'لینک های دانلود مستقیم یا کمکی را در اینجا وارد کنید. سعی کنید هر لینک را در یک خط وارد کرده و حجم آن را جلویش بنویسید. اگر فایل کرک نیز موجود است آنرا وارد کنید. 
 برای آنکه آیکون های دلخواهتان را در کنار لینک دانلود بگذارید، کافیست آن آیکون را آپلود کرده و در کنار لینک قرار دهید.',
 'default_value' => 'دانلود - ۲۳۳ مگابایت
 
 دانلود کرک (به تنهایی)',
 'toolbar' => 'full',
 'media_upload' => 'yes',
 ),
 array (
 'key' => 'field_5799c5fd50155',
 'label' => 'رمز فایل',
 'name' => '',
 'type' => 'tab',
 ),
 array (
 'key' => 'field_5799c5e550153',
 'label' => 'رمز فایل',
 'name' => 'download_pass',
 'type' => 'text',
 'instructions' => 'پسورد فایل را وارد کنید.',
 'default_value' => 'www.webtoaster.ir',
 'placeholder' => 'www.webtoaster.ir',
 'prepend' => '',
 'append' => '',
 'formatting' => 'html',
 'maxlength' => '',
 ),
 array (
 'key' => 'field_5799c9682962a',
 'label' => 'وب تستر',
 'name' => '',
 'type' => 'message',
 'message' => 'این جعبه دانلود توسط <a href="http://webtoaster.ir">وب تستر</a> کد نویسی و ایجاد شده است.',
 ),
 ),
 'location' => array (
 array (
 array (
 'param' => 'post_type',
 'operator' => '==',
 'value' => 'post',
 'order_no' => 0,
 'group_no' => 0,
 ),
 ),
 ),
 'options' => array (
 'position' => 'normal',
 'layout' => 'default',
 'hide_on_screen' => array (
 ),
 ),
 'menu_order' => 0,
 ));
}
?>

در نهایت روی دکمه ذخیره تغییرات کلیک کنید.

راه دوم:

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

فایل xml زیر را دانلود کنید.

دانلود فایل

سپس از منوی وردپرس به بخش ابزار ها » درون ریزی بروید.

روی گزینه WordPress کلیک کنید.

دانلود باکس وردپرس

در صورتی که افزونه WordPress Importer روی سایتتان نصب باشد، وارد صفحه درون ریزی می شوید. در غیر اینصورت، کادری برایتان باز می شود که باید روی دکمه نصب موجود در پایین کادر کلیک کنید تا این افزونه نصب شود.

درون ریزی در وردپرس

پس از نصب، زمانی که روی دکمه فعالسازی افزونه کلیک کردید، وارد صفحه Import WordPress خواهید شد. اگر نشدید دوباره به مسیر ابزار ها » درون ریزی بروید و روی لینک WordPress کلیک کنید.

حال در صفحه Import WordPress قرار داریم. در این صفحه روی دکمه Choose File کلیک کنید. حال فایل xml ای که چند لحظه پیش دانلود کرده بودید را انتخاب کنید و روی دکمه Open کلیک کنید.

روی دکمه بارگذاری پرونده و درون ریزی آن کلیک کنید.

در صفحه بعد، بدون اینکه تغییری در گزینه ها بدهید، روی دکمه Submit کلیک کنید.

درون ریزی در وردپرس

پس از لحظاتی، درون ریزی انجام می شود.

نحوه استفاده از باکس دانلود

چه راه اول را رفته باشید چه راه دوم، نحوه استفاده از باکس دانلود فرقی نمی کند. به صفحه ویرایشگر مطلب مورد نظرتان بروید.

در زیر بخش ویرایشگر دیداری، یک باکس با نام جعبه دانلود قرار گرفته. اگر چنین باکسی نمیبینید از قسمت بالای صفحه روی دکمه تنظیمات صفحه کلیک کنید. سپس در منوی باز شده گزینه “جعبه دانلود” را تیکدار کنید. حال یک باکس با نام جعبه دانلود به بخش زیر ویرایشگر مطلب اضافه شده است.

در این باکس، تب های مختلفی را می بینید. برای وارد کردن هر نوع اطلاعاتی به تب مربوط به آن بروید. اگر هر تب را خالی بگذارید، آن باکس نمایش داده نمیشود.

مثلا فرض کنید میخواهیم مشخصات یک نرم افزار را وارد کنیم، بدین منظور به تب مشخصات فایل بروید. مشخصات فایل را درون ویرایشگر وارد کنید. در این ویرایشگر میتوانید اطلاعات را به صورت دلخواهتان بنویسید (مثلا بخشی از آن را بولد کنید یا مورب و …). اطلاعات به همان صورتی که شما ایجاد می کنید به نمایش در می آیند. حتی عکس هم میتوانید قرار دهید.

باکس دانلود برای وردپرس

نتیجه به صورت زیر است:

جعبه دانلود سایت پی سی دانلود برای وردپرس

پس از وارد کردن اطلاعات، مطلب را منتشر یا به روز رسانی کنید.

همچنین برای وارد کردن لینک های دانلود، به تب لینک های دانلود بروید. هر کدام از تب ها را اگر خالی بگذارید، باکس مربوط به آن به نمایش در نخواهد آمد.

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

در نهایت اگر همه ی تب ها را کامل کنید چیزی شبیه به تصویر زیر در مطلب تان به نمایش در می آید:

جعبه دانلود پی سی دانلود برای وردپرس

جمع بندی

از این باکس دانلود میتوانید در هر قالبی استفاده کنید. میتوانید استایل آن را ویرایش کرده و به صورت اختصاصی در آورید. ما فقط برای معرفی و دادن هسته کار از استایل پی سی دانلود استفاده کرده ایم. اگر CSS بلد هستید بهتر است اختصاصی اش کنید. همچنین اگر میخواهید فرم دریافت اطلاعات دانلود را ویرایش کنید (در صورتی که از راه دوم رفته باشید) کافیست از منوی وردپرس به مسیر زمینه های دلخواه » زمینه های دلخواه بروید. سپس از آنجا زمینه ی جعبه دانلود را بیابید و ویرایشش کنید.

شاد باشید

تبلیغات

نویسنده (مدیر سایت)

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

4 دیدگاه برای “جعبه دانلود سایت پی سی دانلود برای وردپرس”

  1. سجاد گفت:

    سلام من طبق توضیحات پیش رفتم ولی گزینه به نام جعبه دانلود در تنظیمات صفحه وجود نداشته

    1. جواد نبوی گفت:

      سلام
      احتمالا مراحل قبلی رو به درستی انجام ندادید. یک بار دیگه مراحل قبل رو بررسی کنید.

  2. سجاد گفت:

    سلام ببخشید بخش نظرات با کدوم پلاگین جی کویری درست کردید میشه اسمشو بدهید باز تکرار کردم ولی همچین گزینه وجود نداره

    1. جواد نبوی گفت:

      سلام
      بخش نظرات از هیچ پلاگینی استفاده نشده. کد نویسی اختصاصی هست که البته جی کوئری هم نداره.
      اما جعبه دانلود، والا نمیدونم توی سایت شما چه مشکلی وجود داره که این جعبه رو نشون نمیده. اما مراحلی که توی آموزش داده شده کاملا تست شده و مشکلی نداشته.

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *