رفتن به مطلب

تخته امتیازات

  1. B.A.H.M.A.N

    B.A.H.M.A.N

    همکار پرستا


    • امتیاز

      1

    • تعداد ارسال ها

      3,726


  2. Fahime1992

    Fahime1992

    مدیر انجمن


    • امتیاز

      1

    • تعداد ارسال ها

      1,287


  3. payman.sadeqi

    payman.sadeqi

    عضو انجمن


    • امتیاز

      1

    • تعداد ارسال ها

      8


  4. s.e.mohammadi

    s.e.mohammadi

    عضو انجمن


    • امتیاز

      1

    • تعداد ارسال ها

      5


مطالب محبوب

در حال نمایش مطالب دارای بیشترین امتیاز در ۱۹/۰۱/۲۷ در همه بخش ها

  1. با سلام کلیه ایمیل هایی که از سمت فروشگاه من ارسال می شود وارد پوشه اسپم مشتریان می شود ، علت چیست ؟ چه راه حلی برای آن وجود دارد؟ البته به جز استفاده از SMTP سرویس ها
    1 امتیاز
  2. Fahime1992

    جستجو

    سلام وقت بخیر از منوی تنظیمات >> جستجو، بازسازی کل فهرست بندی یا افزودن محصولات یافت نشده به فهرست رو بزنید موفق باشید
    1 امتیاز
  3. من هم همین مشکل رو دارم اما گویا کسی نیست پاسخ بده
    1 امتیاز
  4. فصل دوم : با ادامه آموزش در خدمتتون هستم . همونطوری که متوجه شده اید هر بلوک در پرستاشاپ از سه قسمت و سه عکس اصلی تشکیل شده . که عبارتند از عکس بالای بلوک ، عکس پشت زمینه بلوک و عکس پایین بلوک : block_header.png block_bg.jpg block_footer.png که این عکس ها روی همدیگه سوار میشند و یه بلوک رو میسازند . خوب بریم سر نرم افزار فتوشاپ و یه پروژه جدید باز کنید به ابعاد 25*191 و پشت زمینه این پروژه سفید باشه . مثل شکل زیر با استفاده از ابزار rounded rectangle tool میخوایم عکس بالای بلوک رو طراحی کنیم یعنی block_header.png سعی کنید یه عکس مثل این بکشید ( نگران نباشید اگه نتونستید و یا تو فتوشاپ وارد نبودید فایلهای آماده این پروژه رو براتون تو آخر ای نپست قرار میدم ) این شکلی که میکشید باید رنگش سفید باشه .بعدش روی لایه جدید که ایجاد شده تو قسمت لایه ها راست کلیک میکنید و blending option رو انتخاب میکنید . تو این قسمت مطابق شکل زیر تنظیمات رو انجام بدید : حالا که تا این مرحله پیش اومدین پروژه رو ذخیره کنید و میریم سر پشت زمینه بلوک block_bg.jpg یه پروژه جدید دیگه با اندازه 5*191 ایجاد کنید و ایندفعه رنگ پشت زمینه پروژه باید این باشه : cadeff حالا با استفاده از ابزار line tool و انتخاب رنگ 7d7d7d دو تا خط با عرض یک پیکسل هر دو طرف پروژه مثل شکل زیر می کشیم : حالا هر دو پروژه رو با فرمت jpg یه جایی ذخیره کنید .کار اینا تموم شد . میریم سر آخرین مطلب : یه پروژه دیگه به اندازه 25*191 ایجاد کنید و عکس اولی رو هم که ذخیره کرده اید باز کنید و بکشید بندازید داخل این پروژه و کاملا منطبق کنید . حالا با استفاده از منوی image و rotate canvas و flip canvas vertical عکس خودتون رو برعکس کنید ! اینم عکس پایین بلوک ذخیره کنید . البته با فرمت jpg . حالا میمونه این عکسا رو جایگزین کنیم : این 3 عکس رو کپی کنید تو پوشه img در قالبتون . با آخرین قسمت آموزش طراحی بلوک در خدمت شما دوستام محترم هستم . امیدوارم همه شما تونسته باشید از پست قبلی چیزایی رو یاد بگیرید . باید متذکر بشم که شما باید الان 3 تا عکس با فرمت jpg به نام های block_header , block_footer , block_bg داشته باشید و این سه تا عکس رو تو پوشه img قالبتون قرار داداه باشید. حالا فایل global.css رو باز کنید و به دنیال کد زیر بگردید : #left_column div.block, #right_column div.block { padding-bottom: 5px; background: transparent url('../img/block_footer.png') no-repeat bottom left این کد رو با کد زیر جایگزین کنید : #left_column div.block, #right_column div.block { padding-bottom: 5px; background: transparent url('../img/block_footer.jpg') no-repeat bottom left } ---------------------------------------------- کد زیر را پیدا کنید : div.block h4 { text-transform: uppercase; font-family: Arial, Helvetica, Sans-Serif; font-weight: bold; font-size: 1.2em; padding-left: 0.5em; border-bottom: 1px solid #595A5E; padding-top: 2px; line-height: 1.3em; color: #374853; height: 19px; background: transparent url('../img/block_header.png') no-repeat top left } و با کد زیر جایگزین کنید : div.block h4 { text-transform: uppercase; font-family: Arial, Helvetica, Sans-Serif; font-weight: bold; font-size: 1.2em; padding-left: 0.5em; border-bottom: 1px solid #595A5E; padding-top: 2px; line-height: 1.3em; color: #374853; height: 19px; background: transparent url('../img/block_header.jpg') no-repeat top left } ------------------------------------------------ و کد زیر را پیدا کنید : div.block .block_content { border-left: 1px #d0d3d8; border-right: 1px #d0d3d8; padding: 0 0.7em; background: #f1f2f4 url('../img/block_bg.jpg') repeat-x bottom left; min-height: 16px } و با کد زیر جایگزین کنید : div.block .block_content { border-left: 1px #d0d3d8; border-right: 1px #d0d3d8; padding: 0 0.7em; background: #f1f2f4 url('../img/block_bg.jpg') repeat-y bottom left; min-height: 16px } کار تمام شد . حالا شما یه بلوک زیبا در اختیار دارید . البته شاید چندان زیبا هم نباشه ولی با این آموزش ها میتونید خودتون بلوک های زیباتری طراحی کنید . منتظر نظرات دوستان عزیز هستم. البته این یه روش بسیار ابتدایی و ساده برای طراحی بلوک بود اگه از سوی دوستان عزیز این مطلب با استقبال روبرو بشه روشهای جذاب و حرفه ای رو براتون شرح خواهم داد . block.zip
    1 امتیاز
×
×
  • اضافه کردن...