آموزش طراحی کارت ویزیت حرفه ای با تنظیمات چاپ

آموزش bootstrap – آموزش جدول در بوت استرپ با سلام به همراهان همیشگی تیم طراحی سایت اصفهان وب یار، این جلسه در راستای یادگیری بوت استرپ با آموزش جدول در بوت استرپ همراه شما عزیزان هستیم. در مقالات گذشته نحوه ی شبکه بندی در بوت استرپ و استایل دهی به متن در بوت استرپ آموزش داده شد. در این آموزش به ایجاد جدول، کلاس table-bordered ، کلاس table-hover و کلاس table-striped پرداخته می شود. همراه ما باشید تا خیلی واضح و ساده با جدول در بوت استرپ آشنا شوید. ایجاد جدول در بوت استرپ برای ایجاد جدول در بوت استرپ از کلاس table در تگ table استفاده می کنیم. جدول پایه به طور پیش فرض شامل خطوط افقی است و padding دارد. کلاس table، استایل مقدماتی را به جدول اضافه می کند و کلاس table-striped جدول را به صورت راه راه در می آورد. در کد زیر با نحوه ی استفاده از این کلاس ها آشنا می شوید. <table class=”table”> <thead> <tr> <td>Class</td> <td>Description</td> </tr> </thead> <tbody> <tr> <td>.active</td> <td>Applies the hover color to the table row or table cell</td> </tr> <tr> <td>.success</td> <td>Indicates a successful or positive action</td> </tr> <tr> <td>.info</td> <td>Indicates a neutral informative change or action</td> </tr> </tbody> </table> <br><br> <table class=”table table-striped” style=”background:#b3b3ff;”> <thead> <tr> <td>Class</td> <td>Description</td> </tr> </thead> <tbody> <tr> <td>.active</td> <td>Applies the hover color […]

آموزش ساده طراحی سایت ریسپانسیو responsive واکنش گرا در تبلت و موبایل در قالب پروژه منو ریسپانسیو به طراحی سایت با قابلیت های نمایش یوزر فرندلی userfrendly سایت در گجت ها گویند. برای طراحی سایت ریسپانسیو بعد از طراحی قابل درک از سه سایز وبسایت تان ابتدا در فایل هدر قالبتان دستورات ریسپانسیو را وارد کنید: آموزش طراحی سایت ریسپانسیو responsive واکنش گرا <meta name=”apple-mobile-web-app-capable” content=”yes”> <meta name = “viewport” content = “width =device-width, initial-scale = 1.0”> حالا بروی css قالب کار می‌کنیم. مقدار width ها را برابر صد در صد می دهیم . width:100%; در طراحی منوی سایت از  آیکنی با قابلیت display با مقدار hidden  استفاده می کنیم.(چون در حالت ریسپانسیو در تبلت فقط آیکن نمایش داده می شود.) در پایان آموزش همه کد ها و فایل html قالب موجوداست. حالا تعیین میکنیم که سایز گجت ما در چه ابعادی است. @media only screen and (max-width:1024px;){ مقادیر دیگر سی اس اس #menu-icon { display:inline-block;}کد نمایش آیکن منو بجای منو } آموزش طراحی سایت با قابلیت ریسپانسیو responsive واکنش گرا تبلت موبایل به همن راحتی سایت رسپونسیو شد. دانلود فایل آموزش  فیلم آموزش طراحی سایت واکنش گرا به زودی ….   مرورگرهای موبایل برای سازگاری با سایت‌هایی که در گذشته طراحی شده‌اند، از مفهومی به نام Viewport برای نمایش سایت‌ها استفاده می‌کنند. Viewport فضایی مجازی است که معمولا حدود […]

با آموزش منو ریسپانسیو Responsive واکنش گرا از تیم وب یار خدمت شما هستیم,اگر اصول کلی در مورد کدهای ریسپانسیو را نمیدانید و میخواهید صحفه ای ریسپانسیو بسازید حتما مطلب آموزش کدهای طراحی سایت ریسپانسیوResponsive را بخوانید. آموزش طراحی منو ریسپانسیوResponsive قدم به قدم با من همراه باشید تا ببینید که به چه راحتی به طراحی و کدنویسی یک منو ریسپانسیو (واکنش گرا) میپردازیم,و شما پس از یاد گرفتن کدهای طراحی منو واکنش گرا به راحتی میتوانید منو ریسپانسیو داشته باشید که در حالت عادی به صورت افقی نمایش داده بشود,و در صفحه نمایش هایی همانند موبایل ,تبلت,به صورت یک آیکون نمایش داده شود که با کلیک کردن بر روی این آیکون منو به صورت منوی کشویی ریسپانسیو نمایش داده شود. برای این کار ما از هیچ فریم ورکی استفاده نمیکنیم . خودمون با Media Query ها این کار رو به راحتی انجام میدیم . اول از همه بذارید با منطق این موضوع آشناتون کنم . ما با استفاده از Media Queries میتونیم تعیین کنیم که صفحه ی وبمون تو هر رزولوشن به چه شکلی نمایش داده بشه . برای منویی که قراره ایجاد کنیم هم به همین صورت عمل می کنیم . یک منو طراحی می کنیم و با استفاده از media query و کدهای css تعیین می کنیم که در رزولوشن های بالا منو بصورت عادی نمایش داده […]

آموزش bootstrap طراحی رسپونسیو رسپانسیو سیستم شبکه بندی در بوت استرپ در این آموزش قصد داریم سیستم شبکه بندی بوت استرپ آموزش bootstrap طراحی رسپونسیو رسپانسیو را بحث کنیم. شبکه (Grid) چیست؟ با مراجعه به ویکی پدیا تعریف زیر را از شبکه داریم: شبکه در طراحی گرافیکی به یک ساختار (معمولاً دو بعدی) گفته میشود که برای ایجاد محتوای ساخت یافته از خطوط مستقیم عمودی و افقی استفاه میکند. از این سیستم برای ایجاد لایه های متناسب با چاپ استفاده میشود. همچنین در طراحی وب برای ایجاد لایه های متناسب و سازگار با یکدیگر از سیستم شبکه بندی استفاده میشود. سیستم شبکه بندی در بوت استرپ صفحه وب ما را به قسمت های مساوی تقسیم میکند. همانند یک برگه در نقشه کشی ؛ با این کار میتوانیم سازگاری و تناسب بین اشیاء مختلف در وب سایت خودمون رو حفظ کنیم. سیستم شبکه بندی در بوت استرپ چیست؟ باتوجه به تعریف رسمی سایت بوت استرپ ؛ سیستم شبکه بندی در بوت استرپ به صورت زیر تعریف میشود: بوت استرپ شامل سیستم شبکه بندی متحرک و با رویکردی Mobile First است که عرض صفحه را به ۱۲ ستون مساوی تقسیم میکند. اندازه ستون ها باتوجه به عرض دستگاه کم و زیاد میشوند. بوت استرپ شامل کلاسهای از پیش تعریف شده ای است که با استفاده از آنها میتوانید به لایه بندی صفحات […]

با سلام به همه دوستاران طراحی وب سایت با سی ام اس قدرتمند دروپال برای آموزش نصب دروپال بروی هاست مخصوصا لوکالهاست در کامپیوتر شخصی خود از زمپ xampp استفاده نمایید که بهینه تر از wamp یا ampp است. منبع آموزش دروپال کار drupalkar.com است که مطالب ارزنده ای را منتشر میکند. آموزش نصب دروپال روی لوکال هاست xampp نصب, دروپال, دروپال ۷, لوکال,نصب جوملا, هاست, لوکال هاست, لوکال xampp, نصب جوملا فارسی, نصب تصویری جوملا, نصب جوملا روی هاست,دروپال فارسی,پشتیبانی دروپال,فارسی سازی دروپال,ترجمه دروپال,سیستم مدیریت محتوای دروپال,طراحی قالب برای دروپال,فارسی سازی افزونه دروپال,ترجمه افزونه دروپال,فارسی سازی قالب های دروپال,آموزش دروپال,طراحی قالب دروپال,آموزش دروپال برای تازه کارها,سیستم مدیریت سایت دروپال نصب برنامه‌ی زمپXAMPP برای نصب کردن دروپال بروی لوکال هاست ،به یک سرور (Server)، پایگاه داده (Database)، و یک زبان برنامه‌نویسی (Programming Language) احتیاج خواهیم داشت، که  XAMPP به راحتی برای ما بعد از طی چند مرحله آن را نصب می‌کند. سرور، پایگاه داده، و زبان‌های برنامه‌نویسی که زمپ (XAMPP) برای ما نصب می‌کند، عبارتند از: – سرور: آپاچی (Apache) – پایگاه داده: مای‌اسکیوئل / مای‌سکوئل (MySQL) – زبان‌های برنامه‌نویسی: پی‌اچ‌پی (PHP) و پرل (Perl) – که دروپال از پی‌اچ‌پی استفاده می‌کند. البته یک سری برنامه‌ی مفید دیگر هم (مثل phpMyAdmin) در کنار برنامه‌های بالا نصب می‌شوند. نکته: اگر دقت کنید، نام برنامه‌ی XAMPP هم از ابتدای نام همان‌ها که […]

فروشگاه اینترنتی ووکامرس امروزه فروشگاه های اینترنتی زیادی در دنیا وجود دارند. این فروشگاه های اینترنتی در فروش بسیاری از محصولات مورد استفاده قرار می گیرند. برای داشتن یک فروشگاه اینترنتی لازم است یک وب سایت داشته باشیم که بتوانیم محصولات خود را در آن قرار داده و بفروش برسانیم. در این نوشته می خواهیم شما را با فروشگاه اینترنتی ووکامرس و مزیت های این فروشگاه آشنا کنیم. همچنین می توانید از طراحی فروشگاه اینترنتی ما بازدید کنید. ووکامرس چیست؟ ووکامرس افزونه ای به زبان php و مبتنی بر وردپرس می باشد. با استفاده از ووکامرس می توانید یک فروشگاه اینترنتی کامل و جامع داشته باشید. این افزونه توسط تیم woothemes، مایک جولی، جیمز کاستر، کلاودیا سانچز و بری کوییج ساخته شده است و بیش از ۶۸۰۰۰۰۰ بار دانلود شده است که با توجه به این آمار، به محبوبیت روز افزون این افزونه پی می بریم. با استفاده از فروشگاه اینترنتی ووکامرس به راحتی می توانید تصاویری از محصول و توضیحاتی از آن را در سایت خود قرار دهید و مشتریان بعد از انتخاب کردن محصول پول محصول موردنظر را پرداخت کرده و آن را دریافت کنند.       با استفاده از فروشگاه اینترنتی ووکامرس می توانید محصولات خود را به دو صورت به فروش برسانید: 1) محصولات را به صورت پستی ارسال کنید در این حالت زمانی که […]