۱۰ هدر و فوتر زیبا برای فریم‌ورک بوت‌استرپ

10 هدر و فوتر زیبا برای فریم‌ورک بوت‌استرپ

۱۰ هدر و فوتر زیبا برای فریم‌ورک بوت‌استرپ

Beautiful Bootstrap Headers

هدرهای زیبا برای بوت استرپ

در این مقاله قصد داریم مجموعه ای از هدرهای زیبا بهمراه منو (header + navigation menu) که توسط فریم ورک بوت استرپ نسخه ۳ طراحی شده اند را معرفی کنیم.  تمپلیت هایی که در این مقاله معرفی می شوند براحتی در وب سایت های شما قابل استفاده می باشند.

هدرهای بوت استرپ (Bootrap Headers):

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

هدرها

هدرهایی که در این مقاله معرفی می کنیم می توانند در یک قالب موجود و آماده درج شوند و حتی می توانید در صورتی که با html و css و bootstrap آشنایی دارید، این هدرها را ویرایش و شخصی سازی کنید. در برخی از هدرها، از فونت های گوگل (Google Fonts) و آیکون های glyphicon پیش فرض بوت استرپ استفاده شده است.

bootstrap headers

نحوه استفاده (How to Use):

برای استفاده از هر کدام از قالب های هدر معرفی شده در این مقاله، فقط کافیست مراحل زیر را انجام دهید:

۱- سورس کد ۵ هدر آماده بوت استرپ را دانلود کنید و extract کنید.

۲- فایل .html هر کدام از هدرهایی که برای قالب وب سایت شما مناسب تر می باشد را توسط یک ادیتور باز کرده و کدهای آن را در قالب خود درج کنید. پس از دانلود دموی این مقاله، ۵ هدر با نام های زیر در فولدر وجود دارند:

  • Basic-header.html
  • Header-blue.html
  • Header-icons.html
  • Header-nightsky.html
  • Header-picture.html

۳- استایل های مربوط به هر یک از هدرها، در فایل مجزایی به نام همان هدر در فولدر assets/css موجود می باشد.

این هدرها هیچگونه حق کپی رایتی ندارند و براحتی می توانید در پروژه های شخصی و شرکتی خود استفاده نمائید.

فوترهای زیبا برای فریم ورک بوت استرپ

Fantastic Bootstrap Footers

فوترهای زیبا برای بوت استرپ

در مقاله قبل، ۵ هدر زیبا از فریم ورک بوت استرپ را معرفی کردیم و سورس آنها را برای دانلود قرار دادیم. در این مقاله قصد داریم ۵ فوتر آماده-برای-استفاده (ready-to-use) تحت فریم ورک بوت استرپ را به شما عزیزان معرفی کنیم و سورس آن را بصورت رایگان برای دانلود در اختیار شما قرار خواهیم داد. مانند هدرها، این فوترها نیز کاملا واکنش گرا می باشند و ۱۰۰% رایگان و فاقد کپی رایت می باشند.

فوترهای بوت استرپ (Bootstrap Footers):

تمامی فوترهای این مقاله توسط کتابخانه قدرتمند بوت استرپ (bootstrap library) نسخه ۳ طراحی شده اند. آنها کاملا ریسپانسیو می باشند و در تمامی دستگاه ها و انواع رزولوشن ها بدرستی نمایش داده می شوند. هر یک از این ۵ فوتر، یک فایل css مجزا دارد که براحتی قابل ویرایش و شخصی سازی می باشد. استایل هایی که در فایل های css تعریف شده اند کاملا مستقل می باشند و ویرایش آنها تاثیری بر سایر بخش های قالب بوت استرپ شما نخواهد داشت.

فوترها (the Footers)

نحوه استفاده (How to Use):

به منظور استفاده از هریک از فوترهای این مقاله، کافیست مراحل ساده زیر را طی کنید:

۱- فایل zip فوترهای بوت استرپ را دانلود کرده و آنرا extract کنید.

۲- فایل های با فرمت .html را توسط یک ادیتور باز کرده و کدهای مربوطه را به قالب سایت خود اضافه کنید. لیست فوترهایی که در این مقاله وجود دارند بصورت تصویر زیر می باشد:

انواع فوترهای بوت استرپ

۳- هریک از فوترها دارای فایل css مستقل می باشند که در فولدر assets/css قرار دارند.

کتابخانه هایی که به غیر از بوت استرپ در این فوترها مورد استفاده قرار گرفته اند Font-Awesome و Google-Map می باشند.

نقشه گوگل در فوتر

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

شما کاربران گرامی می توانید سوالات و پیشنهادهای خود را در صفحه تماس با ما مطرح نمائید.

منبع:

 https://tutorialzine.com

این مقاله را در شبکه‌های اجتماعی به اشتراک بگذارید!

Share on facebook
Share on google
Share on linkedin
Share on telegram
Share on email

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

14 − 14 =

مقالات اخیر

مقالات تصادفی

فهرست کلی مقالات

کتاب گوگل ادز

دانلود کتاب "آموزش سرویس گوگل ادوردز"

آموزش کامل فعال‌سازی HTTPS در وردپرس

دانلود کتاب "فعال‌سازی HTTPS در وردپرس"

دانلود رایگان کتاب الکترونیکی

معرفی بهترین ابزارهای بازاریابی محتوا در سال 2019

دانلود رایگان کتاب الکترونیکی "معرفی بهترین ابزارهای بازاریابی محتوا در سال 2019"