برچسب: آموزش طراحی قالب بلاگ بیان

  • آموزش ساخت قالب بلاگ بیان : بخش اول ساختار فایل ها

    آموزش ساخت قالب بلاگ بیان : بخش اول ساختار فایل ها

    آموزش ساخت قالب بلاگ بیان : بخش اول ساختار فایل ها

    قسمت قبلی : مقدمه

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

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

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

    برای شروع کار یک فولدر در دسکتاپ ویندوز خودتون با نام قالب بلاگ من (My Blog Theme) ایجاد کنید.سپس سه فولدر دیگر با نام های css – js– imgs   داخل آن ایجاد کنید. سه تا فایل با نام و فرمت های زیر ایجاد کنید.

    Index.html – post.html ، وارد پوشه سی اس اس شوید فایلی با نام و فرمت زیر ایجاد کنید style.css. یک اسکرین شات از طرح قالب را در فولدر imgs  اضافه کنید.اسکرین شات مورد نظر در لیست قالب های شخصی بیان نشان داده خواهد شد.

    ساختار فولدر و فایل های قالب باید مانند شکل زیر باشند :
    theme-folder-struture

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

    آموزش ساخت قالب بلاگ بیان : بخش اول ساختار فایل ها
    همانطور که در شکل بالا مشاهده می کنید.ساختار قالب ما از ۳ بخش اصلی تشکیل شده است. هر کدام رو توضیح می دهم.

    بخش هدر یا سربرگ

    در این بخش ؛ عنوان ، شعار ، لوگو و منو سایت قرار داده می شود. ( به طور کلی می توان برای نمایش بخش های دیگری مانند : شماره تماس ، آدرس ما در شبکه های اجتماعی ، بنر تبلیغاتی  ، دکمه ورود و عضویت و اسلایدر استفاده کرد).

    بخش محتوای اصلی

    سایدبار

    از این بخش می توان برای نمایش امکانات سایت و وبلاگ ، اطلاعات تکلمیلی ، دسترسی سریع و لیستی از محتوا سایت استفاده کرد.بخش های که در این قسمت معمولا نمایش داده می شوند عبارتند از : پروفایل مدیر سایت یا وبلاگ  و لیست موضوعات ، لینک ها ، آخرین مطالب ، نظرات کاربران ، آرشیو مطالب و تبلیغات و ..

    محتوای اصلی سایت

    محتوای اصلی سایت شامل : لیست محتوای سایت که شامل متن ، فیلم ، موسیقی و … می شود به همراه اطلاعات منتشر کننده محتوا در این قسمت نمایش داده می شوند.بخش های مانند فرم نظرات کاربران ، نظرات ارسالی کاربران و مدیر سایت ، مطالب پیشنهادی ، امتیاز دادن به مطالب و امکان بازنشر (اشتراک گذاری) آن در شبکه های اجتماعی در این قسمت نشان داده می شوند.

    بخش پانویس سایت یا فوتر

    در این قسمت از سایت یا قالب مون ؛ متن کپی رایت ، لینک دسترسی سریع به صفحات و در برخی موارد لیست آخرین مطالب و نظرات ، لینک شبکه های اجتماعی ، فرم تماس با ما و …

    در پست بعدی تگ های مخصوص قالب های بیان  را بررسی می کنیم و نحوه ی استفاده و بخش های استفاده آنها در قالب وبلاگ خودمان رو توضیح خواهم داد.بعنوان مثال یاد می گیریم که در سایدبار قالب مان از چه کدهای می توان استفاده کرد.سپس کدنویسی ساختار قالب رو شروع می کنیم.موفق باشید.

  • آموزش ساختن قالب های حرفه ای برای بلاگ بیان

    آموزش ساختن قالب های حرفه ای برای بلاگ بیان

    آموزش ساختن قالب های حرفه ای برای بلاگ بیان

    اگر عضو بلاگ بیان  هستید و می خواهید برای خودتان قالب درست کنید یا اینکه می خواهید بعنوان یه کدنویس قالب دانش خودتون رو توسعه بدهید و برای سرویس وبلاگدهی بیان هم قالب بنویسد، جای درستی اومدید این سری مطالب برای شماست.

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

    • آشنایی با تگ های اچ تی ام ال ( زبان نشانه گذازی ابر متن یا HTML: Hyper Text Markup Language)
    • آشنایی با سی اس اس (CSS : Cascading Stylesheet )
    • ویرایشگر متن یا محیط کدنویسی
    • مرورگر وب فقط گوگل کروم ، موزیلا فایرفاکس و اپرا
    • توانایی کار با محیط پنل مدیریت بلاگ بیان
    • تگ های مخصوص قالب های بلاگ بیان
    • طرح برای قالب بلاگ خودتون (طراحی قالب با نرم افزارهای گرافیکی مانند فتوشاپ)؛ حتما نباید خودتون طراحی کنید می توانید از طراحان عزیز بخواهید براتون طراحی کنند یا اینکه تو اینترنت جست جو کنید و از طرح های آماده ایده برداری کنید یا از طرح های رایگان که مناسب برای بلاگ تان هست استفاده کنید.

    همه موارد بالا خودش هر کدوم یه بحث جدا هست و نیاز به چندین جلسه آموزش دارد. من فرض می کنم شما حداقل های هر کدام رو می دانید. همچنین از تگ های که استفاده می کنیم سعی میکنم توضیحات کاملی در مورد اون تگ HTML یا CSS  خدمت تون عرض کنم.

     

    اچ تی ام ال5 (HTML5) چیست ؟

    اچ تی ام ال زبان نشانه گذاری ابر متنی است که بدنه یا ساختار قالب ما را ایجاد میکنه! عدد ۵ هم نشان دهنده نسخه یا ویرایش اچ تی ام ال هست که ما از نسخه ۵ استفاده میکنیم. (توضیحات تکمیلی اچ تی ام ال۵)

    ساختار قالب های اچ تی ام ال

    همانطور که در تصویر بالا می بینید ساختار اچ تی ام ال از دو بخش تشکیل شده ، بخش HEAD  و BODY  یا بدنه کدهای اچ تی ام ال مان. برای اطلاعات بیشتر از ساختار کدهای اچ تی ام ال این لینک را مشاهده کنید.پیشنهاد می کنم اول ساختار نوشتن کدهای اچ تی ام ال رو یاد بگیرید بعد این آموزش رو دنبال کنید.

    مقدمه

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

    متفاوت از همه جا قالب بسازید به سبک من! قالب های حرفه ای بساز و لذت ببر!

    هرگونه سوال ، نظر و یا پیشنهاد خودتان در مورد این دوره  یا هریک از بخش های دوره که منتشر خواهد شد را دریغ نکنید.

    ساختار دوره آموزشی

    • مقدمه
    • ساختار فایل های قالب
    • کدنویسی ساختار قالب 
    • انتخاب استایل و رنگ بندی
    • کدنویسی استایل قالب
    • و…

    این دوره مناسب چه کسانی هست ؟

    کسانی که با بلاگ بیان آشنا هستند و اصول اولیه HTML  و CSS  را می دانند.

    در این دوره چه مطالبی را یاد می گیرم؟

    در این دوره یاد خواهید گرفت چگونه یک قالب برای وبلاگ خودتان بسازید و در آینده آن را توسعه و برای استفاده دیگران قالب بسازید و از آن کسب درآمد کنید.یاد می گیرید که دیگر فقط کدها را کپی نکنید بلکه خودتان آن ها را بنویسید و از کدنویسی لذت ببرید.