تبلیغات در اینترنتPanypay
صفحه 1 از 14 1234567891011121314 آخرینآخرین
نمایش نتایج: از 1 به 10 از 133

مقاله: آموزش کادربندی و زیباسازی امضا نسخه 2

    1. آموزش کادربندی و زیباسازی امضا نسخه 2 »

      آموزش کادربندی و زیباسازی امضا نسخه 2

      نگارش: , by (مدیر بازنشسته)
      2013/02/09 02:46 AM
      امتیاز:  (2 رای ، میانگین : 3.00 )

      درود .

      آموزش کادربندی و زیباسازی امضا نسخه 2 که توسط علی خلیلیفر عزیز آماده شده هست .

      نمونه شات :



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

      سپس به قالب Additional.css بروید و کد های زیر را به انتهای آن اضافه کنید :

      کد:
      @font-face {
      font-family: 'BYekan';
      src: url('emza/BYekan.eot?#') format('eot'),  /* IE6–8 */ url('emza/BYekan.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('emza/BYekan.ttf') format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
      }
      
      
      .emza {
      box-shadow: 0px 0px 87px rgb(238, 238, 238) inset,rgba(0, 0, 0, 0.4) 0px 4px 4px -4px;
      margin: 10px;
      padding: 10px;
      border-radius: 10px 10px 17px 17px;
      border: 2px solid rgb(235, 235, 235);
      background:white url(emza/blockquote.png) no-repeat 98.54% 27px;
      border-bottom:4px solid rgb(235, 235, 235);
      }
      
      
      .module {
      background: #eee;
      margin: 0 0 20px 0;
      }
      
      
      .module h2 {
      background: #ccc;
      line-height: 2;
      padding: 0 0 0 10px;
      font-size: 16px;
      box-shadow: inset 0 25px 10px -10px rgba(255, 255, 255, 0.2);
      border-radius: 9px;
      }
      
      
      .module h2 a {
      float: right;
      position: relative;
      text-decoration: none;
      color: rgb(255, 255, 255);
      padding: 0 10px;
      -webkit-transition: padding 0.1s linear;
      -moz-transition: padding 0.1s linear;
      -ms-transition: padding 0.1s linear;
      -o-transition: padding 0.1s linear;
      border-radius: 0px 10px;
      font: 14px "BYekan",Calibri;
      direction: rtl;
      text-shadow: 1px 1px rgb(131, 0, 0);
      padding-top: 4px;
      padding-bottom: 4px;
      margin-top: -37px;margin-right: 38px;
      }
      
      
      .module h2 a:hover {
      padding: 0 14px;
      padding-top:4px;
      padding-bottom:4px;
      }
      
      
      .module h2 a:active {
      padding: 0 16px;
      padding-top:4px;
      padding-bottom:4px;
      }
      
      
      .module h2 a:before,.module h2 a:after {
      content: "";
      position: absolute;
      top: 50%;
      width: 0;
      height: 0;
      }
      
      
      .module h2 a:before {
      left: -12px;
      border-top: 8px solid transparent;
      border-bottom: 8px solid transparent;
      margin-top: -8px;
      }
      
      
      .module.blue h2 a {
      background: rgb(233, 0, 0);
      }
      
      
      .module.blue h2 a:hover {
      background: #ff8400;
      }
      
      
      .module.blue h2 a:after {
      left: -5px;
      border-top: 6px solid transparent;
      border-bottom: 6px solid transparent;
      border-right: 6px solid rgb(233, 0, 0);
      margin-top: -6px;
      }
      
      
      .module.blue h2 a:hover:after {
      border-right-color: #ff8400;
      }
      
      
      .matn {
      direction:rtl;
      border-right:0px solid #cecece;
      font:14px BYekan;
      color: rgb(134, 134, 134);
      padding-right:6px;
      font-weight:normal;
      margin-right:50px;
      }
      
      
      .c {
      float:left;
      background:none;
      margin-top:-22px;
      }
      
      
      .c a {
      background: rgb(219, 219, 219) !important;
      }
      
      
      .c a:after {
      left: -5px !important;
      border-top: 6px solid transparent !important;
      border-bottom: 6px solid transparent !important;
      border-right: 6px solid rgb(219, 219, 219) !important;;
      margin-top: -6px !important;;
      }
      سپس به قالب postbit_legacy بروید و به کد زیر را پیدا کنید :

      کد:
      <div class="signaturecontainer">{vb:raw post.signature}</div>
      و جایگزین کنید با :

      کد:
      <div class="emza">
      <div class="module blue">
      <img src="emza/text_signature.png" style="float: right;margin-top: -38px;" />
      <h2> <a href="#">امضاي {vb:raw post.musername}</a></h2></div>
      <div class="matn">{vb:raw post.signature}</div>
      </div>
      موفق باشید .
      فایل های پیوست شده
      • نوع فایل: zip emza.zip (80.6 کیلو بایت, 828 نمایش)
      ویرایش توسط Designer : 2013/10/17 در ساعت 07:50 PM
  1. Top | #2
    کاربر مفید و فعال

    ورژن ویبولتین
    3.8 و 4.2
    نوشته ها
    599
    میزان امتیاز
    74

    پیش فرض

    خیلی عالی

    2 تشکر توسط:


  2. Top | #3
    مدیر بازنشته

    ورژن ویبولتین
    4.2
    نوشته ها
    5,098
    میزان امتیاز
    598

    پیش فرض

    بسیار زیبا !! ممنون ....

    دوستانی که امضا هاشون کوچیک میشه کد زیر رو قبل از گذاشتن در additional.css ور دارن ....

    کد:
    height: 50px;

    کاربر مقابل از [email protected] بابت این پست مفید تشکر کرده است:


  3. Top | #4
    مدیر بازنشته

    ورژن ویبولتین
    4.1.10
    نوشته ها
    905
    میزان امتیاز
    141

    پیش فرض

    دو مورد در کد ها فیکس شد !

    2 تشکر توسط:


  4. Top | #5
    مدیر بازنشته

    ورژن ویبولتین
    4.2
    نوشته ها
    5,098
    میزان امتیاز
    598

    پیش فرض

    کد:
    <h2> <a href="#">امضاي {vb:raw post.musername}</a></h2></div>
    این قسمت هم اینطوری باشه بهتره ....

    کد:
     <h2><a>امضا {vb:raw post.musername}</a></h2></div>

    3 تشکر توسط:


  5. Top | #6
    کاربر سایت

    ورژن ویبولتین
    4.2.0
    نوشته ها
    193
    میزان امتیاز
    24

    پیش فرض

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

    2-فایل پیوست رو آپ کردم تو روت(ایمیج) بعد هم اکسترنتش کردم ولی اون عکس خودنویسه نمیاد باید چیکا کنم؟

    و یه درخواست میشه همین کد هایی که الان برا خوده وی بی استفاده شده رو بذارید آخه این قشنگتره

  6. Top | #7
    مدیر بازنشته

    ورژن ویبولتین
    4.2
    نوشته ها
    5,098
    میزان امتیاز
    598

    پیش فرض

    شما پوشه emza رو درست آپلود نکردید . اصلا فکر کنم آپلود نکردید !!
    http://nejebadiha.com/emza/blockquote.png
    http://nejebadiha.com/emza/text_signature.png
    این دو عکس سر جاشون نیستید . برای تغییر رنگ قرمز باید این کد رو تغییر بدید
    کد:
    rgb(333, 0, 0);
    عدد های 333 و 0 و 0 باید تغییر کنند . میتونید از سایت زیر استفاده کنید
    The Other RGB Color Chart

    برای تغییر رنگ نوشته باید کد زیر رو تغییر بدید
    کد:
    color: rgb(255, 255, 255);
    برای تغییر حالت سایه نوشته کد زیر :
    کد:
    text-shadow: 1px 1px rgb(131, 0, 0);

    3 تشکر توسط:


  7. Top | #8
    کاربر سایت

    ورژن ویبولتین
    4.2.0
    نوشته ها
    193
    میزان امتیاز
    24

    پیش فرض

    م تو روت اپلود کردم
    البته پوشه زیپ رو
    بعد هم اکسترنت کردم
    مسیرش باید تو همو ایمیج باشه یا جای دیگه؟

  8. Top | #9
    مدیر بازنشته

    ورژن ویبولتین
    :-|
    نوشته ها
    2,908
    میزان امتیاز
    387

    پیش فرض

    خیر تو روت باشه

    نمی خواد تو image بریزی

  9. Top | #10
    کاربر سایت

    ورژن ویبولتین
    Version 4.2
    نوشته ها
    157
    میزان امتیاز
    24

    پیش فرض

    ممنون وخیلی عالی بود

    کاربر مقابل از shamstalk بابت این پست مفید تشکر کرده است:


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

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

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

کسانی که این مقاله را دیده اند از این مقاله ها نیز بازدید کرده اند

  1. آموزش زیبا سازی پست بیت { به سبک دفترچه } (جدید)
    توسط Mohsen Neo در انجمن آموزش های وی بولتین
    پاسخ: 13
    آخرين نوشته: 2013/10/10, 04:52 PM
  2. آموزش زیباسازی پست بیت به سبک وب آلفا + Css Hover (جدید!)
    توسط Reza در انجمن آموزش های وی بولتین
    پاسخ: 93
    آخرين نوشته: 2013/08/12, 12:41 PM
  3. درخواست آموزش مرتب سازی زیرانجمن ها
    توسط boors در انجمن پرسش و پاسخ
    پاسخ: 2
    آخرين نوشته: 2013/02/04, 12:45 AM
  4. آموزش زیبا سازی پست بیت { ساده و زیبا } (ورژن3)
    توسط sorathost در انجمن آموزش های وی بولتین
    پاسخ: 4
    آخرين نوشته: 2012/11/15, 08:39 PM
  5. آموزش زیبا سازی پست بیت { ساده و زیبا }
    توسط Mohsen Neo در انجمن آموزش های وی بولتین
    پاسخ: 46
    آخرين نوشته: 2012/08/05, 02:40 PM

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

علاقه مندی ها (Bookmarks)

علاقه مندی ها (Bookmarks)

مجوز های ارسال و ویرایش

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