0

آموزش ساخت جعبه دانلود

دسته بندی ها : آموزشگاه 22 دسامبر 2013 خانه وردپرس 1359 بازدید

من در این تاپیک گفته بودم که می خوام این جعبه دانلود که خودم بابتش پول دادم و براش زحمت کشیده شده رو بفروشم:

http://forum.wp-parsi.com/topic/13455-%D8%A7%D9%81%D8%B2%D9%88%D9%86%D9%87-%D8%B2%D9%85%DB%8C%D9%86%D9%87-%D9%87%D8%A7%DB%8C-%D8%AF%D9%84%D8%AE%D9%88%D8%A7%D9%87-%D9%BE%DB%8C%D8%B4%D8%B1%D9%81%D8%AA%D9%87-advanced-custom-fields/page__st__10#entry112721

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

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

*برای استفاده از این جعبه دانلود حتما باید افزونه Advanced Custom Fields نصب باشه.

1- فایل های جاوا اسکریپت زیر رو در پوشه ی js قالبتون قرار بدید:
در این آدرس:

wp-content/themes/your theme/js

اگه این پوشه وجود نداشت اون رو بسازید.

دانلود فایل های جاوا اسکریپت:
فایل پیوستی js.zip 4.04K 26 تعداد دریافت ها

2- کدهای زیر رو هم در انتهای فایل Style.css قرار بدید:

/* download box css */
.tab-container {
width: 625px;
}
.etabs {
margin: 0;
padding: 0;
}
.tab {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
background: none repeat scroll 0 0 #EEEEEE;
border-color: #999999 #999999 -moz-use-text-color;
border-image: none;
border-radius: 7px;
border-style: solid solid none;
border-width: 1px 1px medium;
display: inline-block;
margin: 5px 0 5px 5px;
}
.tab a {
color: #FFFFFF;
display: block;
font-family: B Yekan;
font-size: 15px;
line-height: 2em;
outline: medium none;
padding: 0 10px;
text-decoration: none;
}
.tab a:hover {
text-decoration: underline;
}
.tab.active {
background: none repeat scroll 0 0 #FFFFFF;
border-color: #666666;
position: relative;
top: 1px;
}
.tab a.active {
font-weight: bold;
}
.panel-container {
margin-bottom: 10px;
}
.tab.dl-color {
background: none repeat scroll 0 0 #EEAF00;
border: 4px solid #DFA200;
}
.tab.help-color {
background: none repeat scroll 0 0 #45A7EF;
border: 4px solid #338DCF;
}
.tab.info-color {
background: none repeat scroll 0 0 #3BCADA;
border: 4px solid #2FB1BF;
}
.tab.require-color {
background: none repeat scroll 0 0 #C8C7C7;
border: 4px solid #898989;
}
#tabs1-dl {
background: none repeat scroll 0 0 #FDFBCB;
border: 3px solid #FFD40F;
border-radius: 10px;
padding: 0 10px 10px;
}
#tabs1-help {
background: none repeat scroll 0 0 #CBE9FC;
border: 3px solid #4FBCFF;
border-radius: 10px;
padding: 0 10px 10px;
}
#tabs1-info {
background: none repeat scroll 0 0 #AEF2F9;
border: 3px solid #67C7CF;
border-radius: 10px;
padding: 0 10px 10px;
}
#tabs1-require {
background: none repeat scroll 0 0 #E3E3E3;
border: 3px solid #898989;
border-radius: 10px;
padding: 0 10px 10px;
}
#tab-container h2 {
font-family: yekan;
font-size: 18px;
margin: 0;
font-family: B Yekan;
}

3- کدهای زیر هم باید در فایل Single.php قرار بگیرن:
در هر قالب بستگی به جایی که می خواید قرار بگیره داره.

لینک های دانلود

راهنما

مشخصات

سیستم مورد نیاز

4- موردی که باید حتما انجام بشه اینه که کدهای زیر رو به فایل header.php بعد از تابع

اضافه کنید:



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

1- در سمت راست منوی مدیریت روی زمینه های دلخواه کلیک کنید.
2- در قسمت بالا و در کنار ((گروه های زمینه)) روی افزودن کلیک کنید.
3- در قسمت ((تنظیمات)) موقعیت رو (( معمولی (بعد از نوشته) )) قرار بدید.
4- در پایین این قسمت یعنی استایل تیک گزینه دارای متاباکس استاندارد رو بزنید.
5- در بالای صفحه هم نام گروه زمینه رو انتخاب می کنید مثلا ((جعبه دانلود)).
6- روی افزودن زمینه کلیک کنید.
7- در قسمت برچسب زمینه بنویسید ((لینک های دانلود)) و در قسمت نام زمینه هم بنویسید ((download_links)).
8- در قسمت بعد یعنی نوع زمینه ((ویرایشگر دیداری)) رو انتخاب کنید.
9- حالا باز روی افزودن زمینه کلیک کنید.
10- در قسمت برچسب زمینه ((راهنما)) و در قسمت نام زمینه بنویسید ((help)) نوع زمینه رو هم که ((ویرایشگر دیداری)) قرار میدید.
11- کلیک روی افزودن زمینه – نوشتن ((مشخصات)) در قسمت برچسب زمینه – نوشتن ((info)) در قسمت نام زمینه – نوع زمینه هم که ((ویرایشگر دیداری)).
12- مثل مرحله قبل: افزودن زمینه – نوشتن ((سیستم مورد نیاز)) در قسمت برچسب افزونه – نوشتن ((require)) در قسمت نام زمینه – نوع زمینه هم که ((ویرایشگر دیداری)).

مراحل تموم شد.

دمو جعبه دانلود:

http://dabestanfatemeh.ir/oloom-4/

در قسمت ارسال نوشته باید تصاویر زیر رو مشاهده کنید:

Capture.PNG
***************************
Capture2.PNG
***************************
Capture3.PNG
***************************
Capture4.PNG

اگه نبود از بالا قسمت تنظیمات صفحه تیک گزینه جعبه دانلود رو بزنید.

*ویژگی خوبی که این جعبه دانلود داره اینه که محدودیتی در گذاشتن لینک دانلود وجود نداره.

موفق باشید

مطالب زیر را حتما بخوانید:

قوانین ارسال دیدگاه در سایت

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

نظرات کاربران

    دیدگاهتان را بنویسید

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

    Time limit is exhausted. Please reload CAPTCHA.

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

    لینک کوتاه :