/ اموزش اضافه کردن چند رنگ به استایل (اختصاصی ویکی وی بی)
وندا هاست
طراحی و راه اندازی وبسایت و انجمن توسط ویکی وی بی ویکی وی بی در قبال معاملات صورت گرفته با هر یک از اعضا و سفارشات طراحی خارج از این اطلاعیه هیچگونه مسئولیتی نمی پذیرد
بک لینک ها
فروش قالب وردپرس فروش فایل مشابه ژاکت وندا هاست
صفحه 3 از 7 نخستنخست 12345 ... آخرینآخرین
نمایش نتایج: از 21 به 30 از 68

مقاله: اموزش اضافه کردن چند رنگ به استایل (اختصاصی ویکی وی بی)

    1. اموزش اضافه کردن چند رنگ به استایل (اختصاصی ویکی وی بی)

      اموزش اضافه کردن چند رنگ به استایل (اختصاصی ویکی وی بی)

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

      این اموزش تقدیم به طراحان قالب که میخوان از رنگ دار کردن استفاده کنم
      ان شالله سعی منم بر همینه که حدودا یک ماه دیگه یک استایله هفت رنگه متفاوت براتون بزارم

      اما بعد ار این همه مقدمه بریم سراغ اموزش:

      در ایتدا باید یک فایل css جداگانه در پوشه قالب خود بسازید ، به عنوان مثلا یک فایل blue.css بسازید ( با استفاده از نرم افزار notepad++ )



      این فایل را باید با استفاده از فایل additional.css یا هر فایل Css قالب اصلی بسازید ، مثلا کد زیر مربوط به قسمت تصویر تالار ها در قالب forumbits.css میباشد :

      کد PHP:
       .forumhead, .forumhead_display {     background:#c2ad74 url(images/wikivb-Ver1/misc/forumhead.png) repeat-x;     border-radius: 5px 5px 0px 0px;     _background-image: none;     padding: 0;     font:  normal 16px BKoodakBold,Calibri !important;  } 



      که دارای رنگ قهوایی با کد c2ad74 و عکس بک گراند با ادرس images/wikivb-Ver1/misc/forumhead.png و کد های دیگر می باشد .

      در اینجا باید کد های بالا را در فایل blue.css که ساخته اید بزارید ، سپس تغییرات لازم را برای قالب مثلا آبی بدهید ( کد رنگ c2ad74 را آبی کنید بک گراند را ابی کنید و .... )

      خوب یاد گرفته ایید که هرجایی که میخواهید تغییر رنگ پیدا کند باید کد اصلی را از فایل های Css قالبتان داخل فایل blue.css بزارید و کد ها یا عکس ها را تغییر دهید.

      در اخر که فایل blue.css را تکمیل کردید ذخیره کنید و آن را داخل هاستتان آپلود کنید ( در پوشه قالب آپلود کنید)

      حال فایل headinclude_bottom قالب را باز کنید و تمام کد های آن را پاک و کدهای زیر را بزارید :


      کد PHP:
      {vb:cssfile additional.css} {vb:raw template_hook.headinclude_bottom_css}  <link rel="stylesheet" type="text/css" href="http://wikivb.ir/images/wikivb-Ver1/asli.css" />  <link rel="alternate stylesheet" type="text/css" media="screen" title="blue-theme" href="http://wikivb.ir/images/wikivb-Ver1/blue.css" />  <script src="http://wikivb.ir/images/wikivb-Ver1/styleswitch.js" type="text/javascript"></script> 
      که حالا کد php:

      کد PHP:
       <link rel="stylesheet" type="text/css" href="http://wikivb.ir/images/wikivb-Ver1/asli.css" /> 


      مربوط به رنگ پیش فرض قالب میباشد ، به جای images/wikivb-Ver1/asli.css ادرس فایل css که ساخته اید را بنویسید ( اگر میخواهید قالب اصلی پیش فرض باشد ادرس را حذف کنید )

      کد PHP:
      <link rel="alternate stylesheet" type="text/css" media="screen"  title="blue-theme" href="http://wikivb.ir/images/wikivb-Ver1/blue.css" /> 
      مربوط به رنگ دیگر قالب شماست ( بجای images/wikivb-Ver1/blue.css ادرس فایل css که ساخته اید را بدهید )

      همینطور میتوانید کدهایی برای رنگ های دیگر اضافه کنید ....
      ( red.css . green.css , brown.css و ... )


      در اینجا کار رو به پایان است .

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

      کد های زیر را به اخر قالب additional.css اضافه کنید :

      کد PHP:
      .change-color floatleftbackgroundurl(http://wikivb.ir/images/wikivb-Ver1/choose.png) no-repeat right; padding-right: 75px; margin-top: -20px; margin-left: 11px; } 
      به نسبت مکان قالب مقدار ها را تغییر دهید .

      کافیست کدهای زیر را در محلی که میخواهید تنظیمات تغییر رنگ قالب نشان داده شود بزارید :

      کد PHP:
        <div class="change-color"> <a href="javascript:chooseStyle('none', 60)" checked="checked"><img width="28" height="26" src="http://wikivb.ir/images/wikivb-Ver1/asli.png" alt="انتخاب رنگ اصلی" title="انتخاب رنگ اصلی"></a> <a href="javascript:chooseStyle('blue-theme', 60)"><img width="28" height="26" src="http://wiki.ir/images/wikivb-Ver1/blue.png" alt="انتخاب رنگ آبی" title="انتخاب رنگ آبی"></a>  </div>

       
      و در اخر:ادرس images/wiki-Ver1/blue.png ایکون مربوط به تغییر رنگ میباشد 
      چنانچه این مطلب مورد پسند شما واقع شده بر روی کلیک کنید .

  1. #21
    S0h3!L آنلاین نیست.
    S0h3!L
    مدير ارشد
    1,585نوشته4,899مورد پسند

    تاریخ عضویت
    Oct 2012
    شماره عضویت
    3
    پسندیده است
    4,062 پست
    بلاگ
    0 پست
    میزان امتیاز
    4885
    www.ubuntuforums.ir
    نقل قول نوشته اصلی توسط local نمایش پست ها
    لطفا این تایپک رو هم مثل بقیه پشتیبانی کنید.مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    صبر کنید استارتر هروقت آنلاین شن و تاپیک رو ببینن کمکتون میکنن

    2 نفر از اعضا پست S0h3!L را پسندیده اند


    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  2. #22
    J⑩nAt⑩N آنلاین نیست.
    J⑩nAt⑩N
    مدير بازنشسته
    3,937نوشته6,621مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    53
    پسندیده است
    4,639 پست
    بلاگ
    0 پست
    میزان امتیاز
    6632
    sooon
    نقل قول نوشته اصلی توسط local نمایش پست ها
    لطفا این تایپک رو هم مثل بقیه پشتیبانی کنید.مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    یه کمی هم شکیبا باشید
    من تایپکتون رو دیدم
    ولی فایل رو نداشتم ممنون از امین که قرار داد
    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  3. #23
    local آنلاین نیست.
    local
    کاربر سايت
    2,070نوشته1,232مورد پسند

    تاریخ عضویت
    Apr 2013
    شماره عضویت
    1475
    پسندیده است
    1,828 پست
    بلاگ
    7 پست
    میزان امتیاز
    1241
    No Set
    این اموزش رو قدم به قدم رفتم ولی متاسفانه کار نکرد.
    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  4. #24
    AminX آنلاین نیست.
    AminX
    مدير بازنشسته
    4,703نوشته6,570مورد پسند

    تاریخ عضویت
    Mar 2013
    شماره عضویت
    984
    پسندیده است
    2,596 پست
    بلاگ
    2 پست
    میزان امتیاز
    6578
    مسئول 2 ستاره
    www.cssnevis.ir
    اشتباه رفتید ، آموزش مشکلی نداره .

    میتونید فایل های Css داخل استایل های قابلیت تغییر رنگ یا styleswitch رو ببینید .

    کاربر زیر پست AminX را پسندیده است:


    .....

  5. #25
    J⑩nAt⑩N آنلاین نیست.
    J⑩nAt⑩N
    مدير بازنشسته
    3,937نوشته6,621مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    53
    پسندیده است
    4,639 پست
    بلاگ
    0 پست
    میزان امتیاز
    6632
    sooon
    بیشتر دقت کنید چون این اموزش تغییر رنگ اولین بار توسط خودم گذاشته شد
    خودم مبتکرش نیستم
    ولی خیلیلا از رو همین اموزش قالب چند رنگ زدن

    قبلا هم تست شده پس دقت کنید
    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  6. #26
    saeidx57 آنلاین نیست.
    saeidx57
    کاربر سايت
    194نوشته24مورد پسند

    تاریخ عضویت
    May 2014
    شماره عضویت
    5418
    پسندیده است
    133 پست
    بلاگ
    پست
    میزان امتیاز
    34
    www.iran-foreca.com
    سلام..
    لطفا یکم ساده تر توضیح بدین. میخوام از این استفاده کنم ولی نمیدونم چی گفتین.
    اول گفتین یه فایل بسازید که میشه فایل رنگ یا همون blue.css ...
    بعد این پایین اینو گفتین :
    مربوط به رنگ پیش فرض قالب میباشد ، به جای images/wikivb-Ver1/asli.css ادرس فایل css که ساخته اید را بنویسید
    ادرس این فایل css چیه ؟؟؟ . کجا و کی باید بسازیم ؟؟؟
    پایین ترشم گفتین blue.css رو بذارید که اون مشکلی نیست ولی این asli.css چیه ؟؟؟ تو اموزش دربارش چیزی نگفتید که.
    ویرایش توسط saeidx57 : 08-06-2014 در ساعت 12:00 PM

  7. #27
    saeidx57 آنلاین نیست.
    saeidx57
    کاربر سايت
    194نوشته24مورد پسند

    تاریخ عضویت
    May 2014
    شماره عضویت
    5418
    پسندیده است
    133 پست
    بلاگ
    پست
    میزان امتیاز
    34
    www.iran-foreca.com
    نقل قول نوشته اصلی توسط J⑩nAt⑩N نمایش پست ها
    بیشتر دقت کنید چون این اموزش تغییر رنگ اولین بار توسط خودم گذاشته شد
    خودم مبتکرش نیستم
    ولی خیلیلا از رو همین اموزش قالب چند رنگ زدن

    قبلا هم تست شده پس دقت کنید
    جاناتان داداش کمکم کن. دستت درد نکنه.

  8. #28
    Danial آنلاین نیست.
    Danial
    کانديد مديريت
    625نوشته1,060مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    64
    پسندیده است
    692 پست
    بلاگ
    0 پست
    میزان امتیاز
    1070
    www.delgia.ir
    درود
    توی همون فایل قالب یه فایل ایجاد کنید با نام asli.css
    حالا میرید تو ادمین سی پی و هر قسمتی که باید با تعویض رنگ تغییر کنه رو پیدا می کنید.
    رنگشو از اون جا بر میدارید و میذارید تو asli.css
    حالا رنگ دومو تو blue.css میذارید.

    کاربر زیر پست Danial را پسندیده است:



  9. #29
    saeidx57 آنلاین نیست.
    saeidx57
    کاربر سايت
    194نوشته24مورد پسند

    تاریخ عضویت
    May 2014
    شماره عضویت
    5418
    پسندیده است
    133 پست
    بلاگ
    پست
    میزان امتیاز
    34
    www.iran-foreca.com
    نقل قول نوشته اصلی توسط DANIAL نمایش پست ها
    درود
    توی همون فایل قالب یه فایل ایجاد کنید با نام asli.css
    حالا میرید تو ادمین سی پی و هر قسمتی که باید با تعویض رنگ تغییر کنه رو پیدا می کنید.
    رنگشو از اون جا بر میدارید و میذارید تو asli.css
    حالا رنگ دومو تو blue.css میذارید.
    واقعیتش بازم نفهمیدم چی گفتین.... کمی پیچیده توضیح دادین.مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  10. #30
    Danial آنلاین نیست.
    Danial
    کانديد مديريت
    625نوشته1,060مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    64
    پسندیده است
    692 پست
    بلاگ
    0 پست
    میزان امتیاز
    1070
    www.delgia.ir
    نگاه کنید مثلا ما یه کلاس داریم به نام .forumhead
    کداش به طور مثال بصورت زیر هست:
    کد:
    .forumhead {
    background: blue;
    width: 100%;
    height: 40px;
    }
    حالا ما می خوایم وقتی رنگ آبی هست بکگراند آبی باشه و وقتی رنگ قرمز هست بکگراند قرمز باشه.
    پس ما از این جا فقط background: blue; رو بر می داریم و می ذاریم در فایل blue.css
    به این صورت باید قرار بدید:
    کد:
    .forumhead {
    background: blue;
    }
    دیگه نیازی نیست width و height هم بذارید چون با تغییر رنگ اینا که تغییر نمی کنه؛فقط بکگراند تغییر می کنه.
    حالا دوباره این بخش رو در فایل red.css یا هر چیزی مثل yourname.css قرار میدیم به این صورت:
    کد:
    .forumhead {
    background: red;
    }
    و کدی که در خود ویبولتین باقی میمونه فقط این هست:
    کد:
    .forumhead {
    width: 100%;
    height: 40px;
    }

    کاربر زیر پست Danial را پسندیده است:



صفحه 3 از 7 نخستنخست 12345 ... آخرینآخرین

اطلاعات موضوع

کاربرانی که در حال مشاهده این موضوع هستند

در حال حاضر 1 کاربر در حال مشاهده این موضوع است. (0 کاربران و 1 مهمان ها)

کلمات کلیدی این موضوع

مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی مجوز های ارسال و ویرایش

  • شما نمیتوانید موضوع جدیدی ارسال کنید
  • شما امکان ارسال پاسخ را ندارید
  • شما نمیتوانید فایل پیوست کنید.
  • شما نمیتوانید پست های خود را ویرایش کنید
  •  
خرید بک لینک
مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی