نویسنده: علی باقری نیا
تاریخ: ۱,دی,۱۳۹۲
آخرین ویرایش: ۰۴ فروردین ۱۳۹۶
بدون دیدگاه
1185 بازديد

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

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 اما با لطف یکی از دوستان کمی بهم برخورد و ...

امتیاز دهید :

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
  • من در این تاپیک گفته بودم که می خوام این جعبه دانلود که خودم بابتش پول دادم و براش زحمت کشیده شده رو بفروشم:

    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 نصب باشه.

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

    wp-content/themes/your theme/js

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

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

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

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

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

    راهنما

    مشخصات

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

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

    اضافه کنید:



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

    ۱- در سمت راست منوی مدیریت روی زمینه های دلخواه کلیک کنید.
    ۲- در قسمت بالا و در کنار ((گروه های زمینه)) روی افزودن کلیک کنید.
    ۳- در قسمت ((تنظیمات)) موقعیت رو (( معمولی (بعد از نوشته) )) قرار بدید.
    ۴- در پایین این قسمت یعنی استایل تیک گزینه دارای متاباکس استاندارد رو بزنید.
    ۵- در بالای صفحه هم نام گروه زمینه رو انتخاب می کنید مثلا ((جعبه دانلود)).
    ۶- روی افزودن زمینه کلیک کنید.
    ۷- در قسمت برچسب زمینه بنویسید ((لینک های دانلود)) و در قسمت نام زمینه هم بنویسید ((download_links)).
    ۸- در قسمت بعد یعنی نوع زمینه ((ویرایشگر دیداری)) رو انتخاب کنید.
    ۹- حالا باز روی افزودن زمینه کلیک کنید.
    ۱۰- در قسمت برچسب زمینه ((راهنما)) و در قسمت نام زمینه بنویسید ((help)) نوع زمینه رو هم که ((ویرایشگر دیداری)) قرار میدید.
    ۱۱- کلیک روی افزودن زمینه – نوشتن ((مشخصات)) در قسمت برچسب زمینه – نوشتن ((info)) در قسمت نام زمینه – نوع زمینه هم که ((ویرایشگر دیداری)).
    ۱۲- مثل مرحله قبل: افزودن زمینه – نوشتن ((سیستم مورد نیاز)) در قسمت برچسب افزونه – نوشتن ((require)) در قسمت نام زمینه – نوع زمینه هم که ((ویرایشگر دیداری)).

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

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

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

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

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

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

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

    موفق باشید

  • تازه های وردپرس رو از کانال تلگرام خانه وردپرس دنبال کنید